.vid {
    object-fit: cover;
    width: 100%;
    height: 22.5%;
    /* position: fixed; */
	position: absolute;
  }


  body{ 
	/* background-image: linear-gradient(-90deg,#000 7%,#000 17%,#000 29%,#000 44%,#000 66%,#000 83%,#000 100%,#8886B3 100%,#000); */
	background-color: black;

	/* 90deg,#000 7%,#000 17%,#000 29%,#000 44%,#000 66%,#000 83%,#000 96%,#f34804 100%,#000 */
  }
  /* #productpage {
	background: -webkit-linear-gradient(#fff, rgb(255, 0, 0, 1), rgba(255, 0, 76));
	-webkit-background-clip: text;
  	-webkit-text-fill-color: transparent;
    color: #fff;
    font-family: 'Oswald', sans-serif;
    font-size: 3em;
    display: flex;
    position: relative;
    flex-direction: row;
    
} */
ul{
	list-style: none;
}

  #designbtn:hover {
    background-image: linear-gradient( 15deg,
	rgb(255, 0, 0, 1) 0%,   
	rgba(255, 0, 76) 100%);
    color:rgb(0, 0, 0);
    font-family: 'Oswald', sans-serif;
    text-shadow: 6px 6px 6px  rgba(0, 0, 0, 0.5) ;
  }


  /* #Hero{
	background: -webkit-linear-gradient(#fff, rgb(21, 40, 82), rgb(4, 122, 158),rgb(21, 40, 82));
	-webkit-background-clip: text;
  	-webkit-text-fill-color: transparent;
    color: #fff;
    font-family: 'Oswald', sans-serif;
    font-size: 3em;
    display: flex;
    position: relative;
    flex-direction: row;
    
} */


#designbtnTop:hover {
    background-image: linear-gradient( 15deg,
	#00C2FF 20%,
	#CE2127 80%);
    color:rgb(0, 0, 0);
    font-family: 'Oswald', sans-serif;
    text-shadow: 6px 6px 6px  rgba(0, 0, 0, 0.5) ;
  }

  #designbtn1:hover {
    background-image: linear-gradient( 15deg,
	rgb(21, 40, 82) 0%,
	rgb(4, 122, 158) 100%, 
	rgb(21, 40, 82) 0%);
    color:rgb(0, 0, 0);
    font-family: 'Oswald', sans-serif;
    text-shadow: 6px 6px 6px  rgba(0, 0, 0, 0.5) ;
  }

  #designbtn2:hover {
    background-image: linear-gradient( 15deg,
	#1b0800 0%,
	#ff3c00 100%, 
	#f76a33 0%);
    color:rgb(0, 0, 0);
    font-family: 'Oswald', sans-serif;
    text-shadow: 6px 6px 6px  rgba(0, 0, 0, 0.5) ;
  }

  #designbtn3:hover {
    background-image: linear-gradient( 15deg,
	#1d1d1d 0%,
	#F2E4CD 100%);
    color:rgb(0, 0, 0);
    font-family: 'Oswald', sans-serif;
    text-shadow: 6px 6px 6px  rgba(0, 0, 0, 0.5) ;
  }

  #designbtn4:hover {
    background-image: url("blacksand.png");
	background-size: 100% 100%;
    font-family: 'Oswald', sans-serif;
    text-shadow: 1px 1px 8px  #FFFF;
	color: rgb(39, 39, 39);
  }

 #designbtn5:hover {
    background-image: linear-gradient( 15deg,
	#01A4AC 20%,
	#01565a 80%);
    color:rgb(0, 0, 0);
    font-family: 'Oswald', sans-serif;
    text-shadow: 6px 6px 6px  rgba(0, 0, 0, 0.5) ;
  }

  #designbtn6:hover {
    background-image: linear-gradient( 15deg,
	#86aef7 30%,
	#0018FF 70%);
    color:rgb(0, 0, 0);
    font-family: 'Oswald', sans-serif;
    text-shadow: 6px 6px 6px  rgba(0, 0, 0, 0.5) ;
  }

  #designbtn7:hover {
    background-image: linear-gradient( 15deg,
	#FE00FE 20%,
	#2b75ff 80%);
    color:rgb(0, 0, 0);
    font-family: 'Oswald', sans-serif;
    text-shadow: 6px 6px 6px  rgba(0, 0, 0, 0.5) ;
  }

  #designbtn8:hover {
    background-image: linear-gradient( 15deg,
	#120D15 20%,
	#41466E 80%);
    color:rgb(0, 0, 0);
    font-family: 'Oswald', sans-serif;
    text-shadow: 6px 6px 6px  rgba(0, 0, 0, 0.5) ;
  }

  #designbtn9:hover {
    background-image: linear-gradient( 15deg,
	#C5AD9E 20%,
	#D4814E 80%);
    color:rgb(0, 0, 0);
    font-family: 'Oswald', sans-serif;
    text-shadow: 6px 6px 6px  rgba(0, 0, 0, 0.5) ;
  }


  #designbtn10:hover {
    background-image: linear-gradient( 15deg,
	#C5AD9E 20%,
	#D4814E 80%);
    color:rgb(0, 0, 0);
    font-family: 'Oswald', sans-serif;
    text-shadow: 6px 6px 6px  rgba(0, 0, 0, 0.5) ;
  }

  #designbtn11:hover {
    background-image: linear-gradient( 15deg,
	#121212 20%,
	#E30083 80%);
    color:rgb(0, 0, 0);
    font-family: 'Oswald', sans-serif;
    text-shadow: 6px 6px 6px  rgba(151, 151, 151, 0.5) ;
  }

  #designbtn12:hover {
    background-image: linear-gradient( 15deg,
	#BBFFDB 20%,
	#009345 80%);
    color:rgb(0, 0, 0);
    font-family: 'Oswald', sans-serif;
    text-shadow: 6px 6px 6px  rgba(151, 151, 151, 0.5) ;
  }

.pro {
    mix-blend-mode:overlay;
    text-shadow: 6px 6px 6px   rgb(53, 50, 50) ;
    color: #fff;
    font-family: 'Oswald', sans-serif;
    margin-top: auto;
    font-size: 8em;	
    width: 100%;
    text-align: center;
    text-transform: uppercase;
	position: absolute;
}


.backbtn { 
	/* background: -webkit-linear-gradient(#fff, rgb(168, 168, 168), rgb(255, 255, 255));
	-webkit-background-clip: text; */
  	/* -webkit-text-fill-color: transparent; */
color: #fff;
text-decoration: none;
margin-top: 12%;
  width: auto;
  display: flex;
 position: fixed;
 font-family: 'Oswald', sans-serif;
 font-size: 1.7em;
cursor: pointer;
transition: transform .2s;
}

.backbtn:hover {
	/* background: -webkit-linear-gradient(#DFA5B1, #f06553, rgb(1, 43, 90));
	-webkit-background-clip: text;
  	-webkit-text-fill-color: transparent; */
	  color:#BCBCBC;
  
    font-family: 'Oswald', sans-serif;
    /* text-shadow: 6px 6px 6px  rgba(0, 0, 0, 0.5) ; */
	transform: scale(1.02);
  }


video{
	width: 100%;
	height: 65%;
}

iframe{
width: 100%;
height: 65vh;
border-radius: 24px;
}

.QT {
	/* background: -webkit-linear-gradient(#fff, rgb(214, 214, 214), rgb(50, 50, 50));
	-webkit-background-clip: text;
  	-webkit-text-fill-color: transparent; */
    color: #ffffff;
    font-family: 'Oswald', sans-serif;
    font-size: 3em;
    display: flex;
    position: relative;
    flex-direction: row;
    
}

.QT2 {
	/* background: -webkit-linear-gradient(#fff, rgb(214, 214, 214), rgb(50, 50, 50));
	-webkit-background-clip: text;
  	-webkit-text-fill-color: transparent; */
    color: #7D7D7D;
    font-family: 'Oswald', sans-serif;
    font-size: 1.5em;
    display: flex;
    position: relative;
    flex-direction: row;
	margin-top: -2%;
    
}

.container {
	/* background-color: black; */
    margin-top: 13%;
    margin-left:19%;
	margin-left: 19%;
    position: fixed;
	width: 65%;

}

.lcontainer {
	/* background-color: black; */
    margin-top: -5%;
    margin-left: 25%;
	margin-left: 25%;
    position: absolute;
	width: 50%;
	height: 70%;

}

.btn {
	border-radius: 56px;
    border: none;
    cursor: pointer;
    display: flex;
    position: relative;
	
  }

  .btn{
    border: none;
    background-image: linear-gradient(to bottom right,rgb(127, 127, 127), #121212);
    color: whitesmoke;
    text-decoration: none;
    display: block;
    font-size: 1.5em;
    margin: 4px 2px;
    transition-duration: 0.4s;
    cursor: pointer;
    /* border-radius: 5px 5px; */
    font-family: 'Oswald', sans-serif;
    text-align: center;
    width: 100%;
    padding-top: 3%;
	padding-bottom: 3%;
  
  }

  .btn:hover {
    background-image: linear-gradient( rgb(255, 255, 255), rgb(224, 224, 224));
    color:rgb(0, 0, 0);
    font-family: 'Oswald', sans-serif;
    text-shadow: 6px 6px 6px  rgba(0, 0, 0, 0.5) ;
  }


  .btn:active {
    transform: translateY(10px);
   
  }
  
  
  @media (min-width: 200px) {

    .backbtn { 
		margin-top: 82.5%;
		width: auto;
		display: flex;
	   position: fixed;
	   font-size: 1.2em;
	  
	  }
  
  
	  .btn {
	 display: flex;
	 position: absolute;
	 width: 100%;
	justify-content: center;
	  padding-top: 3%;
	  padding-bottom: 3%;
	font-size: 1em;
		  
	}
  
	  .container {
		  margin-top: 90%;
		  margin-left:19%;
		  margin-left: 19%;
		  position: absolute;
		  width: 65%;
	}
	iframe{
		width: 100%;
		height: 14vh;
		}
  
	video {
	  height: 50%;
	  width: 100%;
	  position: relative;
	
	}
  
	.pro {
	  margin-top: 23%;
	  font-size: 2.5em;	
	  width: 100%;
	  text-align: center;
	  text-transform: uppercase;
	  position: fixed;
	  
  }
  .QT{
	  font-size: 1.5em;
	  padding-top: 20px;
  }
    
  
  }


  
  @media (min-width:320px) {

	.backbtn { 
		margin-top: 53%;
		width: auto;
		display: flex;
	   position: fixed;
	   font-size: 1.3em;
	  
	  }
  
  
	  .btn {
	 display: flex;
	 position: absolute;
	 width: 100%;
	justify-content: center;
	  padding-top: 3%;
	  padding-bottom: 3%;
	
		  
	}
  
	  .container {
		  margin-top: 52%;
		  margin-left:19%;
		  margin-left: 19%;
		  position: absolute;
		  width: 65%;
	}
	
	iframe{
		width: 100%;
		height: 22vh;
		}

  
	video {
	  height: 50%;
	  width: 100%;
	  position: relative;
	
	}
  
	.pro {
	  margin-top: 10%;
	  font-size: 3.8em;	
	  width: 100%;
	  text-align: center;
	  text-transform: uppercase;
	  position: fixed;
	  
  }
    .QT{
		font-size: 2.5em;
		padding-top: 15px;
	}
  
  }
  
  
  @media (min-width:480px) {

	.backbtn { 
		margin-top: 36%;
		width: auto;
		display: flex;
	   position: fixed;
	   font-size: 1.7em;
	  
	  }
  
  
	  .btn {
	 display: flex;
	 position: absolute;
	 width: 100%;
	justify-content: center;
	  padding-top: 3%;
	  padding-bottom: 3%;
	
		  
	}
  
	  .container {
		  margin-top: 36%;
		  margin-left:19%;
		  margin-left: 19%;
		  position: absolute;
		  width: 65%;
	}
	iframe{
		width: 100%;
		height: 20vh;
		}

  
	video {
	  height: 50%;
	  width: 100%;
	  position: relative;
	
	}
  
	.pro {
	  margin-top: auto;
	  font-size: 6.2em;	
	  width: 100%;
	  text-align: center;
	  text-transform: uppercase;
	  position: fixed;
	  
  }
  
    
  }
  
  
  @media (min-width:540px ) {

	.backbtn { 
		margin-top: 33%;
		width: auto;
		display: flex;
	   position: fixed;
	   font-size: 1.7em;
	  
	  }
  
  
	  .btn {
	 display: flex;
	 position: absolute;
	 width: 100%;
	justify-content: center;
	  padding-top: 3%;
	  padding-bottom: 3%;
	}
  
	  .container {
		  margin-top: 34%;
		  margin-left:19%;
		  margin-left: 19%;
		  position: absolute;
		  width: 65%;
	}
	
	iframe{
		width: 100%;
		height: 27vh;
		}

  
  
	video {
	  height: 50%;
	  width: 100%;
	  position: relative;
	
	}
  
	.pro {
	  margin-top: auto;
	  font-size: 7em;	
	  width: 100%;
	  text-align: center;
	  text-transform: uppercase;
	  position: fixed;
	  
  }
    
    
}


@media (min-width:600px ) {

    .backbtn { 
		margin-top: 26.5%;
		width: auto;
		display: flex;
	   position: fixed;
	   font-size: 1.7em;
	  
	  }
  
  
	  .btn {
	 display: flex;
	 position: absolute;
	 width: 100%;
	justify-content: center;
	  padding-top: 3%;
	  padding-bottom: 3%;
	  font-size: 1.2em;
	
		  
	}
  
	  .container {
		  margin-top: 24%;
		  margin-left:19%;
		  margin-left: 19%;
		  position: absolute;
		  width: 65%;
	}
	iframe{
		width: 100%;
		height: 27vh;
		}
  
	video {
	  height: 50%;
	  width: 100%;
	  position: relative;
	
	}
  
	.pro {
	  margin-top: auto;
	  font-size: 8em;	
	  width: 100%;
	  text-align: center;
	  text-transform: uppercase;
	  position: fixed;
	  
  }


    
  }
  

  @media (min-width:768px ) {

	.backbtn { 
		margin-top: 20%;
		width: auto;
		display: flex;
	   position: fixed;
	   font-size: 1.7em;
	  
	  }
  
  
	  .btn {
	 display: flex;
	 position: absolute;
	 width: 100%;
	justify-content: center;
	  padding-top: 3%;
	  padding-bottom: 3%;
	  font-size: 1.5em;
	
		  
	}
  
	  .container {
		  margin-top: 19%;
		  margin-left:19%;
		  margin-left: 19%;
		  position: absolute;
		  width: 65%;
	}
	iframe{
		width: 100%;
		height: 50vh;
		}
  
	video {
	  height: 50%;
	  width: 100%;
	  position: relative;
	
	}
  
	.pro {
	  margin-top: auto;
	  font-size: 8em;	
	  width: 100%;
	  text-align: center;
	  text-transform: uppercase;
	  position: fixed;
	  
  }
    
  }
  

  @media screen and (min-width: 1024px) {

	.backbtn { 
		margin-top: 17%;
		width: auto;
		display: flex;
	   position: fixed;
	   font-size: 1.7em;
	  
	  }
  
  
	  .btn {
	 display: flex;
	 position: absolute;
	 width: 100%;
	justify-content: center;
	  padding-top: 3%;
	  padding-bottom: 3%;
	  font-size: 1.5em;
	
		  
	}
  
	  .container {
		  margin-top: 16%;
		  margin-left:19%;
		  margin-left: 19%;
		  position: absolute;
		  width: 65%;
	}
	iframe{
		width: 100%;
		height: 50vh;
		}
  
	video {
	  height: 50%;
	  width: 100%;
	  position: relative;
	
	}
  
	.pro {
	  margin-top: auto;
	  font-size: 8em;	
	  width: 100%;
	  text-align: center;
	  text-transform: uppercase;
	  position: fixed;
	  
  }
  
  }



  @media screen and (min-width: 1200px) {

	.backbtn { 
		margin-top: 14%;
		width: auto;
		display: flex;
	   position: fixed;
	   font-size: 1.7em;
	  
	  }
  
  
	  .btn {
	 display: flex;
	 position: absolute;
	 width: 100%;
	justify-content: center;
	  padding-top: 3%;
	  padding-bottom: 3%;
	  font-size: 2em;
	
		  
	}
  
	  .container {
		  margin-top: 13%;
		  margin-left:19%;
		  margin-left: 19%;
		  position: absolute;
		  width: 65%;
	}

	iframe{
		width: 100%;
		height: 50vh;
		}
  
  
	video {
	  height: 50%;
	  width: 100%;
	  position: relative;
	
	}
  
	.pro {
	  margin-top: auto;
	  font-size: 8em;	
	  width: 100%;
	  text-align: center;
	  text-transform: uppercase;
	  position: fixed;
	  
  }

  }


  @media screen and (min-width: 1400px) {

	.backbtn { 
		margin-top: 12.5%;
		width: auto;
		display: flex;
	   position: fixed;
	   font-size: 1.7em;
	  
	  }
  
  
	  .btn {
	 display: flex;
	 position: absolute;
	 width: 100%;
	justify-content: center;
	  padding-top: 3%;
	  padding-bottom: 3%;
	  font-size: 2em;
	
		  
	}
  
	  .container {
		  margin-top: 13.5%;
		  margin-left:19%;
		  margin-left: 19%;
		  position: absolute;
		  width: 65%;
	}

	iframe{
		width: 100%;
		height: 65vh;
		}
  
  
	video {
	  height: 50%;
	  width: 100%;
	  position: relative;
	
	}

	.pro {
	  margin-top: auto;
	  font-size: 8em;	
	  width: 100%;
	  text-align: center;
	  text-transform: uppercase;
	  position: fixed;
	  
  }
  }

  @media screen and (min-width: 1600px) {

	.backbtn { 
      margin-top: 12%;
      width: auto;
      display: flex;
     position: fixed;
	 font-size: 1.7em;
    
    }


    .btn {
   display: flex;
   position: absolute;
   width: 100%;
  justify-content: center;
    padding-top: 3%;
	padding-bottom: 3%;
	font-size: 2em;
  
        
  }

    .container {
		margin-top: 13%;
		margin-left:19%;
		margin-left: 19%;
		position: absolute;
		width: 65%;
  }
  iframe{
	width: 100%;
	height: 65vh;
	}

  video {
    height: 50%;
    width: 100%;
    position: relative;
  
  }

  .pro {
	margin-top: auto;
    font-size: 8em;	
    width: 100%;
    text-align: center;
    text-transform: uppercase;
	position: fixed;
    
}
  }