body{
margin:0 !important;
background-color:#000;
font-size:20px;
font-weight:bold;
color:#fff;
letter-spacing:1px;
text-shadow:1px 1px #000, 2px 2px #000;
transition:all .3s ease-in-out;	
}
body a{	
text-decoration:none;
color:#ccc;
transition:all .3s ease-in-out;	
}
div{
transition:all .3s ease-in-out;	
}
#container{
display:flex;
align-items:center;
justify-content:center;
flex-wrap:wrap;
margin-left:auto;
margin-right:auto;
width:1250px;
}
.saveback{
width:100%;
height:300px;
}
input.mess{
background-color:#000;
border:solid 5px #555;
padding:10px;
width:90%;
font-size:28px;
color:#ccc;
box-shadow:0 0 20px #000;
border-radius:15px;
letter-spacing:1px;
text-shadow:1px 1px #000, 2px 2px #000;
}
textarea.mess2{	
overflow:auto;
min-height:150px;
width:90%;	
max-height:500px;
background-color:#000;
border:solid 5px #555;
padding:10px;
font-size:28px;
color:#fff;
box-shadow:0 0 20px #000;
border-radius:15px;
letter-spacing:1px;
text-shadow:1px 1px #000, 2px 2px #000;
}
textarea.messavatar{
padding:10px 10px 10px 50px;
color:#db7ff9;
background:url("../img/dj.png") 8px no-repeat;
background-size:30px 30px;	
}	
textarea.savemess{
padding:10px 10px 10px 50px;
color:orange;
background:url("../img/description.png") 8px no-repeat;
background-size:30px 30px;	
}	
.language{
display:flex;
align-items:center;
justify-content:center;
width:100%;
height:50px;
}
#save{
display:flex;
align-items:center;
justify-content:center;
width:100%;
height:100px;
}
input.save{
text-transform:uppercase;
text-decoration:none;
font-weight:bold;
cursor:pointer;
padding:5px 10px 5px 12px;
border:3px solid #999;
color:#ccc;
font-size:16px;
letter-spacing:2px;
border-radius:15px;
background-image:radial-gradient(ellipse at bottom, #666 10%, #000 130%);
box-shadow:0 0px 10px 0px #666 inset;
text-shadow:1px 1px #222,  2px 2px #222, 3px 3px #222;
transition:all .3s ease-in-out;
}
input.save:hover{
font-size:18px;
border:4px solid #ccc;
background-image:radial-gradient(ellipse at bottom, #3a9bc1 10%, #111 130%);
box-shadow:0 0px 20px 0px #3a9bc1 inset;
text-shadow:1px 1px #333, 2px 2px #333, 3px 3px #333, 4px 4px #333;
}
a.save{
text-transform:uppercase;
text-decoration:none;
font-weight:bold;
padding:5px 10px 5px 12px;
border:3px solid #999;
color:#ccc;
font-size:16px;
letter-spacing:2px;
border-radius:15px;
background-image:radial-gradient(ellipse at bottom, #666 10%, #000 130%);
box-shadow:0 0px 10px 0px #666 inset;
text-shadow:1px 1px #222,  2px 2px #222, 3px 3px #222;
transition:all .3s ease-in-out;
}
a.save:hover{
font-size:18px;
border:4px solid #ccc;
background-image:radial-gradient(ellipse at bottom, #3a9bc1 10%, #111 130%);
box-shadow:0 0px 20px 0px #3a9bc1 inset;
text-shadow:1px 1px #333, 2px 2px #333, 3px 3px #333, 4px 4px #333;
}

.box{
display:flex;
align-items:center;
justify-content:center;
flex-wrap:wrap;
width:100%;
height:100px;
}
.old{
color:orange;	
}
.djdatabox{
height:120px;
}
.status{	
display:flex;	
align-items:center;	
justify-content:center;
cursor:default;	
height:35px;
margin-right:10px;
border:2px solid #999;
padding:0px 10px 0px 10px;
margin-top:10px;
border-radius:10px;
}
.djname{
justify-content:flex-end;	
padding:0px 10px 0px 40px;
color:#db7ff9;
background:url("../img/dj.png") 8px no-repeat;
background-size:25px 25px;
transition:all .3s ease-in-out;
}
.djname a{
color:#db7ff9;
}
.djname:hover{	
color:#e599ff;
}
.djname:hover a{
color:orange;
}
.djname a:hover{
color:#33CC00;
}
.djavatarbox{
display:flex;
align-items:center;	
justify-content:center;	
width:110px;
height:110px;
}
.djnamebox{
display:flex;
align-items:center;	
justify-content:flex-start;	
width:500px;
height:110px;
}
.avatar{
display:flex;	
align-items:center;	
justify-content:center;	
width:90px;	
height:90px;
border:2px solid #999;
border-radius:10px;
}
.avatar img{	
display:block;
max-height:90px;
max-width:100%;		
border-radius:8px;
}
.cdbox{
display:flex;
align-items:center;
justify-content:center;
flex-wrap:wrap;
width:100%;
margin-bottom:10px;
}
.textgobox{	
display:flex;	
align-items:center;	
justify-content:center;	
width:100%;
height:50px;
}
.textgobox div{	
display:flex;
align-items:center;	
position:relative;
overflow:hidden;
width:1000px;
height:40px;
margin:0px 5px 0px 5px;
color:#fff;
border:2px solid #ccc;
background-color:#333;
box-shadow:0 20px 30px 0px #000 inset;
border-radius:10px;
letter-spacing:2px;
padding-left:2px;
transition:all .3s ease-in-out;
}
.djgo div{
width:840px;	
color:#db7ff9;	
}	
.textgobox span{	
color:red;
font-size:22px;
}
.textgobox span a{	
color:red;
}
.djgo a{
color:orange;
}
.djgo:hover div{	
color:#e599ff;
}
.textgobox:hover div a{	
color:orange;
}
.textgobox div a:hover{	
color:#33CC00;
}
.textgobox div img{
align:center;
vertical-align:middle;	
max-height:36px;
}
.textgobox a:hover img{
-webkit-filter:brightness(130%); 
filter:brightness(130%);
}
.blink a{
animation: blinkingText 2s infinite;
}
.blink span{
animation: blinkingText 2s infinite;
}
.blink a:hover{
animation:stop;
}
.blink{
animation: blinkingText 2s infinite;
transition:all .5s ease-in-out;	
}
.textgobox:hover .blink a{
animation:stop;
transition:all .3s ease-in-out;	
}
@keyframes blinkingText{
0%{ color: #15e61e;}
25%{ color: #ff38f5;}
50%{ color: red;}
75%{ color: #33CC00;}
100%{ color: #05b9f5;}
}
.textgobox div p{
margin:0px;
white-space:nowrap;
animation:przesun 50s linear infinite;
-webkit-animation:przesun 50s linear infinite; 
}
.djgo div p{
margin:0px;
white-space:nowrap;
animation:przesun 30s linear infinite;
-webkit-animation:przesun 30s linear infinite; 
}
.textgobox div:hover p{
animation-play-state:paused;
-webkit-animation-play-state:paused;
}
@keyframes przesun{
0%{ transform:translateX(0); padding-left:110%;}
100%{ transform:translateX(-100%); padding-left:200%;}
}
@-webkit-keyframes przesun{
0%{ -webkit-transform:translateX(0); padding-left:110%;}
100%{ -webkit-transform:translateX(-100%); padding-left:110%;}
}  
/* ▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲ TOOLTIP UP ▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲ */ 
.tpboxu{
display:flex;
align-items:center;
justify-content:center;
width:300px;
left:50%;
border-radius:10px;
color:#fff;
}
.tpboxuall{
display:flex;
align-items:center;
justify-content:center;	
flex-wrap:wrap;
width:300px;
padding:0px 0px 10px 0px;
border:2px solid #ccc;
border-radius:5px;
background-image:radial-gradient(ellipse at bottom, #444 10%, #000 130%);
box-shadow:0 0px 10px 0px #000 inset;
}
.tptu{
display:flex;
align-items:center;
justify-content:center;	
text-align:center;
width:100%;	
padding:5px 0px 0px 0px;	
color:#cc7fe5;
font-size:20px;	
letter-spacing:1px;	
}
.tpboxu a{
color:orange;
}
.tptuc a:hover{
color:#33CC00;
}
.tptuc:hover .blink a{
animation:stop;
transition:all .3s ease-in-out;	
}
.tptuc{
font-size:18px;		
width:100%;	
padding:10px 10px 0px 10px;
}
.tptuc span{	
color:red;
font-size:22px;
}
.tptuc span a{	
color:red;
font-size:22px;
}
.tptuc img{
align:center;
vertical-align:middle;	
max-width:120px;
transition:all .0s ease-in-out;	
}
.tptuc img:first-child{
margin-right:10px;
border-radius:5px;	
float:left;	
}
.tptuc a:hover img{ 	
-webkit-filter:brightness(110%); 
filter:brightness(110%); 
}
#codeiframe{
width:1200px;
height:3000px;
}	
#containeriframe{
display:flex;
align-items:center;
justify-content:center;
flex-wrap:wrap;
margin-left:auto;
margin-right:auto;
width:1180px;
}
#codebox{
display:flex;
align-items:center;
justify-content:center;	
flex-wrap:wrap;
width:100%;
width:1000px;
border:2px solid red;
border-radius:15px;
background-color:#000;
box-shadow:0 0px 20px 5px red inset;
padding:0px 10px 20px 10px;
}
#code{
display:flex;
align-items:center;
justify-content:center;	
text-transform:uppercase;
color:red;
font-size:30px;
width:100%;
margin:20px 0px 10px 0px;
}
.buttonbox{
display:flex;
align-items:center;
justify-content:center;
text-align:center;		
width:50%;
height:60px;
}
.codebox{
display:flex;
align-items:center;
justify-content:center;
text-align:center;
flex-direction:column;	
width:100%;		
}
.dcodebox{
display:flex;
align-items:center;
justify-content:center;
text-align:center;
flex-direction:column;	
width:100%;		
}	
.dcode{
display:flex;
align-items:center;
justify-content:center;
text-align:center;		
width:90%;
height:40px;
color:#fff;
font-size:30px;
}
.redtext{
color:red;
}
.max{	
width:100%;
}
.dcodebox:hover .button{
border:3px solid #eee;	
background-image:radial-gradient(ellipse at bottom, orange 10%, #000 130%);
box-shadow:0 0px 10px 0px orange inset;	
}
.sdata:hover .button{
color:#eee;	
border:3px solid #eee;	
background-image:radial-gradient(ellipse at bottom, orange 10%, #000 130%);
box-shadow:0 0px 10px 0px orange inset;	
}
.sdata:hover .smileys img{
-webkit-filter:brightness(120%); 
filter:brightness(120%); 
}
.button{
cursor:pointer;	
text-transform:uppercase;
text-decoration:none;
font-weight:bold;
padding:5px 10px 5px 13px;
border:3px solid #ccc;
color:#ccc;
font-size:18px;
letter-spacing:3px;
border-radius:5px;
background-image:radial-gradient(ellipse at bottom, #666 10%, #000 130%);
box-shadow:0 0px 10px 0px #666 inset;	
text-shadow:1px 1px #222,  2px 2px #222, 3px 3px #222;
transition:all .3s ease-in-out;
}
.codebox:hover .mess{
color:#fff;
}
.dcodebox:hover .mess{
color:#e599ff;
}
.dcodebox .button{
color:#db7ff9;
}
.dcodebox .buttonbox:hover .button{
color:#e599ff;
}
.dcodebox .buttonbox:hover .button:active{
color:#e599ff;
}
.dcodebox .tpt{
color:#db7ff9;
}
.dcodebox .mess{
padding:10px 10px 10px 50px;
color:#db7ff9;
background:url("../img/dj.png") 8px no-repeat;
background-size:30px 30px;	
}
.buttonbox:hover .button{
color:#eee;	
border:3px solid #eee;	
background-image:radial-gradient(ellipse at bottom, orange 10%, #000 130%);
box-shadow:0 0px 10px 0px orange inset;	
}
.buttonbox .button:hover{
color:#fff;
font-size:20px;
border:4px solid #fff;
background-image:radial-gradient(ellipse at bottom, #33CC00 10%, #111 130%);
box-shadow:0 0px 20px 0px #33CC00 inset;
}
.buttonbox .button:active{
color:#fff;
font-size:22px;
padding:7px 12px 7px 15px;
border:5px solid #fff;
background-image:radial-gradient(ellipse at bottom, #175c00 10%, #111 130%);
box-shadow:0 0px 20px 0px #175c00 inset;
}
.tp:hover{
position:relative;
display:inline-block;
}
.tp .ctpbox{
visibility:hidden;
display:flex;
align-items:center;
justify-content:center;
z-index:1;
width:300px;
padding:1px;
position:absolute;
bottom:120%;
left:50%;
margin-left:-150px;
}
.tp:hover .ctpbox{
visibility:visible;
}
.tpt{
display:flex;
align-items:center;
justify-content:center;	
flex-wrap:wrap;
letter-spacing:3px;	
text-transform:none;
color:#fff;	
font-size:18px;
text-align:center;
padding:10px;
border-radius:5px;
border:2px solid #ccc;
background-image:radial-gradient(ellipse at bottom, #444 10%, #000 130%);
box-shadow:0 0px 10px 0px #000 inset;
}
.tpt iframe{
margin-top:5px;
}
.tpt a{
color:orange;	
}
.tpt span{
color:red;
}	
.tpt span a{
color:red;
}	
.tpt img{
display:block;
height:auto;
max-height:200px;
max-width:100%;	
border-radius:5px;
}
.s{
flex-direction:column;	
}
.s img{
width:60%;	
padding:5px 0px 0px 0px; 
}
.atpt{
flex-direction:column;		
}
.atpt img{
display:block;
max-height:70px;
max-width:100%;	
margin-top:10px;
}
input.delete{
margin-right:-100px;	
width:100px;
z-index:-1;
}
.tpboxs{
box-shadow:0 0px 30px 0px #000;
border-radius:5px;
}
#sbox{
display:flex;
align-items:start;
justify-content:center;	
flex-wrap:wrap;
width:100%;
}
.sbox{
display:flex;
align-items:center;
justify-content:center;	
flex-wrap:wrap;
width:33%;
margin-bottom:20px;
}
.sdata{
display:flex;
align-items:center;
justify-content:center;
width:96%;
border:2px solid #999;		
margin-top:5px;
height:70px;
}
.adata{
height:80px;
margin-bottom:10px;
}
.avatarbox{
display:flex;
align-items:center;	
justify-content:center;		
width:50%;
}
.adata:hover .avatarbox img{
-webkit-filter:brightness(110%); 
filter:brightness(110%); 
}
.sdatax{
border:2px solid transparent;		
}
.smileys{
display:flex;
align-items:center;
justify-content:center;
flex-direction:column;	
width:50%;	
}
.smileys img{
width:40%;	
padding:5px 0px 0px 0px; 
}
.sb img{
width:35%;	
}
.sw img{
width:60%;	
}
.savatar {
width:70px;	
height:70px;
}
.savatar img{	
display:block;
max-height:70px;
max-width:100%;		
}
.copysmileys{
display:flex;
align-items:center;
justify-content:center;
height:70px;
width:50%;
}
.acopysmileys{
height:80px;
width:50%;
}
