/* * {padding: 0; margin: 0} */

/* turn it off completely */
select:active, select:hover {
  outline: none
}
 
/* make it red instead (with with same width and style) */
select:active, select:hover {
  outline-color: red
}

header {
    background-color:#444;
}
 ::-webkit-scrollbar {
  -webkit-appearance: none;
  width: 17px;
    background-color:#000;  
    /* background-color:#160e54;  	 */
	
	
}
::-webkit-scrollbar-thumb {
  border-radius: 4px;
  
   /* background-color: rgba(99, 99, 120, .7); */
  /* -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, .7);  */
  
  /* background-color: #8BFF68; */
  /* -webkit-box-shadow: #8BFF68 */
  
    /* background-color: #888; */
  /* -webkit-box-shadow: #888; */
  
background: rgb(90,37,30);
background: linear-gradient(62deg, rgba(90,37,30,1) 7%, rgba(162,142,79,1) 42%, rgba(200,187,91,1) 54%, rgba(65,40,17,1) 94%);
}

    input:focus, textarea:focus, select:focus{
        outline: none;
    }

.noselect {
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Old versions of Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none;  
                             
}



.butt
{
padding:1px;
	border-radius:4px;
	border:solid #FF4400 3px;
	inline:block;
	display:inline-block;
	background-color:#222; 
	margin-bottom:5px;
	font-size:35px;
	
	
	
}


.butt:hover
{
	background:grey;

}



.store
{
	padding:2px;
	padding-left:5px;
	padding-right:5px;	
	border-radius:4px;
	border:solid beige 3px;
	
	inline:block;
	display:inline-block;
	background:rgba(20, 20, 20, 0.90);
	margin-bottom:5px;
	font-size:15px;
}

.store:hover
{
	
		background:grey;
	
}


.fill
{
	color:beige;
	font-size:25px;
	padding:2px;
	border-radius:4px;
	border:solid beige 3px;
	inline:block;
	display:inline-block;
	background-color:#000; 
	font-family:consolas;
	max-width:90%;
}

.fillchat
{
	color:beige;
	background-color:#000;  
	padding:1px;
	border-radius:4px;
	border:solid beige 3px;
	inline:block;
	display:inline-block;
	font-size:20px;
	
}

.fill:hover
{
	background:#222;

}

::-webkit-input-placeholder { /* Edge */
  color: #FF4400;
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color:#FF4400;
}

::placeholder {
  color:#FF4400;
}


.stt
{
	padding:2px;	
	padding-top:15px;
	background:black;
	color:beige;
	border-radius:4px;	
	text-align:center;
    
	 width:100%;
	 /* display: inline-block; */
   /* overflow-x:hidden; */
   	  /* height: 50px;   */
	  
	 display:inline-block;	 

	  height: 35px;  	  
	  

}


.xy
{
 
	background:#d3d3d3;
	 opacity: 0.7;  
	color:#444;
	border-radius:4px;	
 /* padding-left:8px; */
  /* padding-right:8px; */
 /* padding-bottom:6px; */
 
 margin:2px;
 border:solid black 5px;
 font-size:30px; 
 height:40px;
 font-weight:bold;
 padding:4px;
 
 display:none;
}

.xy:hover
{
	/* opacity:1.0; */
	color:black;
}

.selector
{
 
	/* padding:2px; */
	/* padding-left:0px; */
	/* padding-right:0px;	 */
 	

	/* inline:block; */
	/* display:inline-block; */
	 

	border-radius:4px;
	border:solid #FF4400 3px;	 
	background-color:#050505; 
	overflow-x:hidden;  
	
	font-family:consolas;  
	
	font-size:20px; 
	width:100%;
	max-width:343px;

 
height:50px;
color:#fff;
margin:5px;
margin-left:2px;

position:relative;
}

.selector:hover
{
	background:black;
}


.buttv
{
    padding:2px;
	border-radius:4px;
	border:solid #FF4400 3px;
	background-color:#000; 
	font-size:30px;
    position:relative;
	top:-28px;
}

 
.avoice
{
	position:relative;
	color:black;
	text-align:center;
	 
	border-radius:5px;
	font-size:16px;
	 padding-left:1px;
	  padding-right:1px;
	  padding-bottom:10px;
	  padding-top:14px;	  
	margin:1px;
	font-weight:normal;
	font-family:impact;
	
	border:solid #FF4400 3px;
	
		text-Shadow:1px 1px 7px beige;
		display:block;
	margin-bottom:2px;
		 width:calc(100% - 10px);
		 height:40px;
		 
		 overflow-x:hidden;
		 overflow-y:hidden;
		 
		 
		/* background-image:url('images/wood-dark.jpg'); */
		/* background-repeat: no-repeat; */
		/* background-size: cover; */

		
}

.alltracks
{
	border:none;
	border-radius:3px;	
	font-familly:impact;
	font-size:25px; 
	border:solid beige 4px;	
	height:45px;
	width:10.5%;
	margin:0px;
	/* margin-bottom:1px; */
	display:inline-block;
	font-weight:bold;
	color:black;
	/* text-Shadow:0px 0px 3px white; */
	overflow-x:hidden;
	overflow-y:hidden;	
	
}

.alltracks:hover
{
	color:white;
}

@media only screen and (max-width: 600px) {
.alltracks {
	font-size:10px;
  }
}

.cbox
{
	display:inline-block;
    background:black;
	color:#38435E;
    border:solid #FF4400 2px;
    width:20px; 
    height:20px;
	margin:1px;
	border-radius:6px; 		
    position:relative;
	top:-72px;
	left:6px;
}



.sbox
{
	position:relative;
	top:-72px;
	right:1px;
	
	display:inline-block;
	background:#408BBD;
	color:#beige;
    border:solid #FF4400  2px;
  width:20px; 
  height:20px;
  margin:1px;
	 
	
 padding:0;
 font-size:15px;
	border-radius:6px; 		
	display:inline-block;
	
}


.dbox
{
    background:black;
	color:#38435E;
    border:solid #fff 3px;
    width:28px; 
    height:28px;
	margin:0px;
	border-radius:6px; 		
	display:inline-block;
}

.emb
{
	/* background:rgba(120, 120, 120, 0.05); */
	
	/* border:solid #fff 0px; */
	border-radius:4px; 	
	 padding:1px; 
	padding-top:2px;
	padding-bottom:2px;	
    display:inline-block;
	margin-bottom:2px;
	margin-top:5px;
	white-space:nowrap; overflow-x:auto;
    height:74px;
		 overflow-x:hidden;
		 overflow-y:hidden;
	width:calc(14%);
}

@media only screen and (max-width: 600px) {
#member 
  {
	max-width:160px;
		/* overflow-x:hidden; */
  }
}




.vl {
  border-left: 2px solid beige;
  height: 25px;
  text-align:center;
}


.lbl
{
   border-radius:5px;	
  background: #d3d3d3; 	
  text-align:center;
   font-size:40px;
   font-weight:bold;
  border:solid #222 3px;
  color:black
}

/* background: #7C7C7C; */
/* background: -moz-linear-gradient(45deg, #7C7C7C 0%, #C2C8C8 100%); */
/* background: -webkit-linear-gradient(45deg, #7C7C7C 0%, #C2C8C8 100%); */
/* background: linear-gradient(45deg, #7C7C7C 0%, #C2C8C8 100%); */


 
.fxsl{
 
  -webkit-appearance: none;   
  appearance: none;
 
  height: 45px;  
	background-color:rgba(0,0,0,0.05);
  outline: none;  
  opacity: 0.7;  
  -webkit-transition: .2s; 
  transition: opacity .2s;
  border-radius:5px;
  
  width:100%;
}
 
          
.fxsl:hover {
  opacity: 1;  
}

 
.fxsl::-webkit-slider-thumb {
  -webkit-appearance: none;  
  appearance: none;
  
  /* background: #111;  */
  cursor: pointer;  
  border-radius:40px;	
 
	
	  width: 40px;  
  height: 40px;  
  background: rgba(230 , 230 , 230 ,  0.85); 
    opacity:0.80;
	border:solid white 3px;  
	
}

.fxsl::-moz-range-thumb {
  width: 50px;  
  height: 40px;  
  background: #111; 
  cursor: pointer;  
  border-radius:4px;	
    opacity:0.8;
}


.sliderdrum
{
	
  -webkit-appearance: none;   
  appearance: none;
 
  height:45px;  
background: #7C7C7C;
background: -moz-linear-gradient(45deg, #7C7C7C 0%, #C2C8C8 100%);
background: -webkit-linear-gradient(45deg, #7C7C7C 0%, #C2C8C8 100%);
background: linear-gradient(45deg, #7C7C7C 0%, #C2C8C8 100%);
  outline: none;  
  opacity: 0.7;  
  -webkit-transition: .2s; 
  transition: opacity .2s;
  border-radius:5px;
	
 width:180px;


}

.sliderdrum:hover {
  opacity: 1;  
}


.sliderdrum::-webkit-slider-thumb {
  -webkit-appearance: none;  
  appearance: none;
  width: 35px;  
  height: 50px;  
  background: #111; 
  cursor: pointer;  
  border-radius:4px;	
 
}

.sliderdrum::-moz-range-thumb {
  width: 35px;  
  height: 30px;  
  background: #111; 
  cursor: pointer;  
  border-radius:4px;	
 
}

.emb2
{
	/* background:rgba(120, 120, 120, 0.95);	 */
	
 
	
	/* background:#8BFF68; */
/* background: linear-gradient(180deg, #8BFF68 7%, #EEB665 36%, #F37253 59%, #EEB665  90%); */
	
	/* padding:1px; */
	/* border-radius:4px; 	 */
	/* margin:2px;	 */
	text-align:center;

}

#embvol
{
	/* background:rgba(120, 120, 120, 0.95);	 */
	
	/* background: rgb(65,36,112); */
/* background: linear-gradient(180deg, rgba(65,36,112,1) 7%, rgba(96,25,55,1) 36%, rgba(89,58,85,1) 59%, rgba(171,154,41,1) 90%); */
		
		
			/* background:#8BFF68; */
/* background: linear-gradient(180deg, #8BFF68 7%, #EEB665 36%, #F37253 59%, #EEB665  90%); */
	
	padding:1px;
	border-radius:4px; 	
	margin:0px;	
	text-align:center;
	/* position:relative; */
	/* top:-40px; */
}

.slidermaster
{

  -webkit-appearance: none;   
  appearance: none;

background: #7C7C7C;
background: -moz-linear-gradient(45deg, #7C7C7C 0%, #C2C8C8 100%);
background: -webkit-linear-gradient(45deg, #7C7C7C 0%, #C2C8C8 100%);
background: linear-gradient(45deg, #7C7C7C 0%, #C2C8C8 100%);
  /* outline: none;   */
  opacity: 0.98;  
  -webkit-transition: .2s; 
  transition: opacity .2s;
  border-radius:5px;
                 
 width:280px;
 
  height : 50px;   
  
 position:relative;
 top:-10px;
 
 
  
}

.slidermaster:hover {
  opacity: 1;  
}


.slidermaster::-webkit-slider-thumb {
  -webkit-appearance: none;  
  appearance: none;
  width: 30px;  
  height: 30px;  
  background: rgba(230 , 230 , 230 ,  0.85); 
    opacity:0.99;
	border:solid white 3px;  
  
  
  cursor: pointer;  
  border-radius:15px;	

}

.slidermaster::-moz-range-thumb {
  width: 30px;  
  height: 40px;  
  background: rgba(30 , 30 , 30 ,  0.5); 
  cursor: pointer;  
  border-radius:4px;	
  opacity:0.99;
  border:solid white 3px;
}






.fxlabel
{
	 display:inline-block;	 

	  height: 51px;  
	  width:20%;
	 
 
	  
	/* width:10%;  */
	/* min-width:120px; */
	/* overflow-x:hidden; */

}

#touchP
{
	
    width:calc(100% - 8px);
	max-width:800px;
	height:550px;
	border-radius:4px;

	border:solid #aaa 1px;
	
	background: #B8B8B8;
	background: -moz-radial-gradient(center, #B8B8B8 0%, #5C5C5C 100%);
	background: -webkit-radial-gradient(center, #B8B8B8 0%, #5C5C5C 100%);
	background: radial-gradient(ellipse at center, #B8B8B8 0%, #5C5C5C 100%);	
	
}


#pad
{
	
    width:calc(100% - 8px);
	max-width:800px;
	height:550px;
	border-radius:4px;

	border:solid #aaa 0px;
	
	/* background: #B8B8B8; */
	/* background: -moz-radial-gradient(center, #B8B8B8 0%, #5C5C5C 100%); */
	/* background: -webkit-radial-gradient(center, #B8B8B8 0%, #5C5C5C 100%); */
	/* background: radial-gradient(ellipse at center, #B8B8B8 0%, #5C5C5C 100%);	 */
	
}

.onepad
{

 margin:5px;
 width:calc(25% - 25px);
 height:calc(25% - 25px);
 border-radius:6px;
 text-align:center;
 font-weight:bold;
 font-size:20px;
 
 border-top: 4px solid rgba(23,23,23,0.65);
 border-left: 4px solid rgba(23,23,23,0.65); 
 
 border-bottom: 10px groove rgba(21,22,23,0.65);
 border-right: 10px groove rgba(21,22,23,0.65);
 
 min-height:50px;
 
 
 
/* background: rgb(44,44,99); */
/* background: radial-gradient(circle, rgba(44,44,99,0.5) 0%, rgba(0,212,255,0.5) 100%);	 */
	
background:beige;
	
	
	color:#225;
flex-direction:row;	
float:left;

		/* background-image:url('images/wood.png'); */
		/* background-repeat: no-repeat; */
		/* background-size: cover; */
		display: inline-block;
overflow-Y:hidden;
overflow-X:hidden;	
	
}


.onepad:active
{

 border-top: 7px solid rgba(23,23,23,0.85);
 border-left: 7px solid rgba(23,23,23,0.85); 
 
 border-bottom: 7px groove rgba(21,22,23,0.85);
 border-right: 7px groove rgba(21,22,23,0.85);

-webkit-box-shadow: 1px 7px 13px 6px rgba(231,134,57,0.35); 
box-shadow: 1px 7px 13px 6px rgba(231,134,57,0.35);

}


#fp
{
	
	position:absolute;
	width:4%;
	
	
	
}

.minixy
{
	
	border-radius:4px;
padding:1px;
color:beige;
background:black;	
 
	
}

.lost
{
	
	color:#AAA; font-size:20px; font-weight:bold;
	
}
.lost:hover
{
	
	color:#FF4400;
	
}

.mn
{
	/* background:rgba(120, 120, 120, 0.05); */
	
	/* border:solid #fff 0px; */
	border-radius:8px; 	
	 padding:2px; 
	margin:4px;
	overflow-Y:auto;
	width:100%;
	max-width:400px;
	font-size:25px;
	background:#bbb;
	color:black;
	
	 
	background-color: rgba(220, 220,220, .80); 
}

.selMidi
{
	
	background:grey;
	padding-left:5px;
	border-radius:5px;
	border:solid black 2px;
	
}

.selMidi:hover
{
	
	background:beige;
	
}


.surf{
 background:#302313;
  -webkit-transition: background-color 2s ease-out;
  -moz-transition: background-color 2s ease-out;
  -o-transition: background-color 2s ease-out;
  transition: background-color 2s ease-out;
  
  border:solid rgba(15 , 15 , 200 , 0.9) 12px;
-webkit-box-shadow: 6px 3px 75px 10px rgba(134,80,202,1);
-moz-box-shadow: 6px 3px 75px 10px rgba(134,80,202,1);
box-shadow: 6px 3px 75px 10px rgba(134,80,202,1);  
  
  /* box-shadow : 0px 0px 30px 30px rgba(150,0,255,.72); */
 
  
  color:#218196;
}

.surf:hover {
  background-color:#806839;
  cursor: pointer;
  
  color:#FF8844;
}


#rendFull
{
	
 filter:blur(0px); 	
	
}

#didLoad
{
	
	
	
 filter:blur(0px); 	
	
}

.online
{
	
	border-radius:5px;
	padding:2px;
	font-size:16px;
	border:solid beige 2px;
	
	
}

.minipd
{
	
	background:#aa8;
	color:#111;
	font-size:15px;
	font-family:impact;
	padding:5px;
	margin:4px;
	width:calc(100% - 75% - 26px);
 
	height:50px;
	float:left;
	border-radius:8px;
	border:solid #fff 4px;
	word-break: break-word;
	overflow-x:hidden;
	overflow-y:hidden;	
	text-align:center;
}

.minipd:hover
{
	
		background:#a88;
	
}

.mininum
{
	
	position:absolute;
	top:25px;
	z-index:50000000;
	/* margin-top:6px; */
	color:#eee;
		font-size:22px;
	font-family:impact;
	border-radius:8px;
		
}

.minibutt
{
	

	margin:8px;
	padding:4px; 
	color:beige;
	background:#333;
		font-size:25px;
 
		border-radius:8px;	
	
}

.minibutt:hover
{

	background:#080808;
	
}


.minibutt2
{

	margin:8px;
	padding:4px; 
	color:#ff4400;
	background:#555;
	font-size:25px;
	border-radius:8px;	
	
}


.minibutt2:hover
{

	background:#ff4400;
	color:black;
	
}


.donate
{
	
	 background-color:#003;

	
}

.donate:hover
{
	
	 background-color:#667;
	
}

.okselect
{
	
		 
	   -webkit-touch-callout: all; /* iOS Safari */
    -webkit-user-select: all; /* Safari */
     -khtml-user-select: all; /* Konqueror HTML */
       -moz-user-select: all; /* Old versions of Firefox */
        -ms-user-select: all; /* Internet Explorer/Edge */
            user-select: all;  
	
}


.okselect::-moz-selection { background: #ff4400; }
.okselect::selection { background: #ff4400; }
 
 

#triangle {
  width: 0; 
  height: 150px; 
  border-left: 70px solid transparent;
  border-right: 250px solid transparent;
      /* filter: alpha(opacity= 190); */
	  /* opacity: 1.9;  */
  border-bottom: 210px solid #bf3300;
 
  position:absolute; 
  bottom : 0px;
  left : 0px;
  z-index : -1000;
}


#triangle2 {
  width: 0; 
  height: 150px; 
  border-left: 0px solid transparent;
  border-right: 250px solid transparent;
      /* filter: alpha(opacity= 190); */
	  /* opacity: 1.9;  */
  border-bottom: 210px solid #8f3300;
 
  position:absolute; 
  bottom : 0px;
  left : 0px;
  z-index : -1000;
}


#rect {
	
  width: 178px; 
  height: 80px; 
 
  /* border-left: 250px solid transparent; */
  /* border-right: 0px solid transparent; */
  /* border-bottom: 90px solid #bf3300; */
 
  /* background:#bf3300; */
  
  /* background:rgba(220, 220 , 220 , 0.30); */
  background:#8f3300;  
  

  /* border-top:solid #bf3300 4px; */
  /* border-right:solid #bf3300 4px;   */
 
  position:absolute; 
  bottom : 0px;
  left: 70px;
  z-index : -1000;
  
}
 
.instru
{
	
	position:absolute;
	border-radius:5px;
	text-align:center;
	width:80%;
	left:10%;
	
} 

 
#right
{
	
	-webkit-box-shadow: 1px 7px 13px 6px rgba(231,134,57,0.0); 
	box-shadow: 1px 7px 13px 6px rgba(231,134,57,0.0);
		
	
} 
 
#right:hover
{
	
	-webkit-box-shadow: 1px 7px 13px 6px rgba(231,134,57,0.45); 
	box-shadow: 1px 7px 13px 6px rgba(231,134,57,0.45);
		
	
}  



.blinking{
    animation:blinkingText 1.2s infinite;
}
@keyframes blinkingText{
    0%{     color: #FF4400;    }
    49%{    color: #FF4400;  }
    60%{    color: yellow; }
    99%{    color:transparent;  }
    100%{   color: #FF4400;     }
}
 
.mnl
{
	
	color:white;
	margin-left:5px;
	margin-right:5px;	
	
}

.mnl:hover
{
	
	color:#FF4400;
	
}