.body{
width: 100%;
background: linear-gradient(-45deg, #ff512f, #666666, #f09819, #777);
background-size: 400% 400%;
animation: gradient 15s ease infinite; 
}
@keyframes gradient {
0% {
background-position: 0% 50%;
}
50% { 
background-position: 100% 50%; 
} 
100% { 
background-position: 0% 50%;  
}
}  
div *::selection{
background:#523f86;
color: #ffffff;
}  
.getanibtn{
background: linear-gradient(-45deg,#ff512f,#f09819);
color: #fff;    
}
.kodebtn{
background: #ff512f;
}
.icon_btns{
background: #f09819;
}    
.element{
text-transform: uppercase;
color: #000000;
font-family:'Poppins','Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
margin-bottom: 3%;
}
.mesh_box{
width: 85%;
height: auto;
background: #f9f9f9;
margin: auto;
padding: 2%;
padding-top: 0;
}
.color_p_value{
font-family: monospace;
margin-top: 15px;
font-size: 1em;
writing-mode: vertical-rl;
text-orientation: upright;
margin-left: 45%;
display: none;
}
.palette{
height: 160px;
cursor: pointer;
}
.palette:hover .color_p_value{
display: block;
transform: scaleX(1);
}
.downloadbtn{
width: 40px;
height: 40px;
border: 1px solid #f1f1f1;
outline: none;
background: #ffffff;
color: #000000;
float: right;
margin-right: 10px;
margin-top: 10px;
margin-bottom: 10px;
cursor: pointer;
border-radius: 5px;
}
.downloadbtn:hover{
background: #f1f1f1;
}
.likes{
color: #000000;
font-family: monospace;
margin-top: 20px;
text-align: left;
margin-left: 20px;
}
.palette_first{
border-top-left-radius: 10px;
}
.palette_last{
border-top-right-radius: 10px;
}
.create,.createsolid,.createlinear,.createradial,.createconic,.createpatterns{
width:15%;
height:auto;
background: #333333;
color: #ddd;
position:fixed;
top:55px;
left:50%;
display:none;
border: 1px solid #474747;
border-top:0;
padding: 1%;
z-index: 4;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
max-height:500px;
}
.opbox::-webkit-scrollbar{
width: 5px;
height: 5px;
}
.opbox::-webkit-scrollbar-thumb{
background: #5b5b5b;
}
.createsolid,.createlinear,.createradial,.createconic,.createpatterns{
left:29%;
}
.create a,.createsolid a,.createlinear a,.createradial a,.createconic a,.createpatterns a{
text-decoration: none;
color: #000;
}
.create .bottombar,.createsolid .bottombar,.createlinear .bottombar,.createradial .bottombar,.createconic .bottombar,.createpatterns .bottombar{
color: #ddd;
}
.createlinear{
left: 34%;
}
.createradial{
left: 39%;
}
.createconic{
left: 44%;
}
.createpatterns{
left: 52%;
}
.times3,.timessolid,.timeslinear,.timesradial,.timesconic,.timespatterns{
width: 25px;
height: 25px;
outline: none;
background: #ff0000;
color: #fff;
border: 1px solid #474747;
position: fixed;
top: 0px;
left: 100%;
cursor: pointer;
}
.boxtitle{
margin-bottom: 10%;
text-transform: uppercase;
text-align: center;
font-size: 10px;
color: #ddd;
letter-spacing: 2px;
}
.w3-ddd{
color: #ddd;
}
.w3-ddd:hover{
color: #fff;
}
.w3-mt-5_per{
margin-top: 13%;
}
.mt-50{
margin-top: 50px;
}
.web_btn{
width:150px;
height:50px; 
border:none;
outline:5px solid #62dddf;
background:linear-gradient(#00fbff,#19a9a6);
color: #fff;
border-radius: 100px;
font-size: 15px;
font-family: Courier;
letter-spacing: 1px;
}
.ang_down{
float: right;margin-right:30%;
}
.sub_btn_div{
margin-bottom:2%;
}
.createpatbtn{
width:70%;
height: 45px;
border: none;
outline: none;
font-family: 'Poppins','Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
font-size:13px;
cursor: pointer;
border-radius: 5px;
background: #edf2f7;
color: #000000;
padding: 0;
margin-top:15px;
float: none;
}
.createpatbtn:hover{
border: none;
background: linear-gradient(-45deg,#ff512f,#f09819);
color: #fff;
}
.createpatbtn:focus{
border: none;
background:#f09819;
color: #fff;
}
#display_basic,#display_border,#display_brad,#display_color,#display_font,#display_outline,#display_text,
#display_tshad,#display_bshad{
cursor: pointer;
}
.righttopbar{
background: #edf2f7;
border-bottom: 1px solid #f1f1f1;
cursor: pointer;
}
.colorvalue2{
border-radius: 0px;
}
.edited_box{
width: 200px;
height: 200px;
border: 5px solid #19a9a6;
color: #000000;
}
#Filter{
text-align: left;
}  
.web_img{
width: 200px;
height: 200px;
}
.web_search{
width:200px;
height:40px;
background: #fff; 
color: #000;
border: 2px solid #19a9a6;
outline: none;
padding-left: 10px;
}     
.submit2{
width: 60px;
height: 40px;
color:#fff;        
background:#19a9a6;
border: 2px solid #19a9a6;
outline: none;
}
.Texttxtbox,.showfamily{
display: none;
}
#space{display: none;}
#input_view,
#btn_view,
#help_view{
display: none;
}
.web_textarea{
width: 300px;
height: 150px;
outline: none;
margin-top: 50px;
background: #ffffff;
color:#000000;
outline: none;
border: 2px solid #19a9a6;
}
.PBar{
outline: none;
background:#f1f1f1;
width:100%;
height:20px;
margin:auto;
margin-top:100px;
}
.Prog{
outline: none;
background:#19a9a6;
width:50%;
height:20px;
}
#iconBtn1,#iconBtn2,#iconBtn3,#iconBtn4,#iconBtn5{
color: #000;
}    
.icons_class{
width: 40px;
height: 40px;
border: 2px solid #19a9a6;
outline: none;
margin-top:50px;
background: #f1f1f1;
}
#EditedTable {
width: 50%;
border-collapse: collapse;
text-align: left;
}
td,th{
border: 2px solid #19a9a6;
color: #000000;
text-align: left;
background: #ffffff;
}        
.web_form_log{
width: 240px;
height: 250px;      
border: 2px solid #19a9a6;
background:#ffffff;      
color: #000000;      
}        
.web_form_log input[type="text"],.web_form_log input[type="password"]{
width: 90%;
height: 40px;
border: 1px solid #19a9a6;
outline: none;
background: #ffffff;
color: #000000;
margin-top: 10px;
padding-left: 5%;
}
.web_form_log input[type="button"]{
width: 40%;
height: 40px;
border: none;
outline: none;
background: #19a9a6;
color: #000000;
margin-top: 10px;
}
.loginFont{
margin-top:20px;
color:#000000;
}
.border-top-1{
border-top: 1px solid #ffffff;
}