.body{
width: 100%;
background: linear-gradient(-45deg, #FFA751, #666666, #FA8072, #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,#FFA751,#FA8072);
color: #fff;    
}
.kodebtn{
background: #FFA751;
}
.icon_btns{
background: #FA8072;
}    
.font-size-large{
font-size: 1.7em;
background: #FFA751;
color: #fff;
}
.font-size-large:hover{
background: #FFA751;
color: #000000;
}
.change-color{
height: 60px;
background: #FFA751;
color: #ffffff;
}
.change-txt{
font-family: 'Poppins','Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}
.padding-2-per{
padding: 2%;
background: #ffffff;
}
.timerform{
width: 100%;
height: auto;
padding: 3%;
}
.timerform input{
width: 100%;
height: 45px;
border: 2px solid #f1f1f1;
background: #ffffff;
color: #000000;
outline: none;
border-radius: 5px;
margin-top: 10px;
padding-left: 5%;
padding-right: 5%;
font-family: monospace;
}
.timerform input:focus{
border: 2px solid #FFA751;
}
.timerform input[type="submit"]{
width: 40%;
padding:0;
cursor: pointer;
}
.timerform input[type="submit"]:hover{
background: #FFA751;
color: #ffffff;
}
.timerform input[type="submit"]:focus{
border: 1px solid #f1f1f1;
}
.code_btn_shape{
width: auto;
height: 40px;
padding-left: 5%;
padding-right: 5%;
border: 1px solid #f1f1f1;
outline: none;
background: linear-gradient(-45deg,#FFA751,#FA8072);
color: #ffffff;
border-radius: 5px;
margin-top: 10px;
float: right;
margin-right: 10px;
cursor: pointer;
font-family: monospace;
}
.code_btn_shape:hover{
background: #CD5C5C;
}
.timer_box{
width: 100%;
height: auto;
padding: 2%;
margin-top: 80px;
color: #000000;
margin-bottom: 10px;
}
.timer_box span{
font-size: 2.5em;
}
.timer_name{
width: 215px;
text-align:center;
font-family: 'Poppins',monospace;
color: #000000;
font-size: 1.2em;
word-wrap: break-word;
overflow-y: hidden;
text-overflow: ellipsis;  
}
.shape_box_view{
width: 90%;
height: 250px;
background: #ffffff;
border: 1px solid #f1f1f1;
border-radius: 5px;
overflow-y: hidden;
}
.view_time{
font-size: 5em;
font-family: monospace;
color: #000000;
}
.start_btn,.stop_btn{
width: auto;
height: 40px;
padding-left: 3%;
padding-right: 3%;
border: 1px solid #f1f1f1;
background: #ffffff;
outline: none;
color: #000000;
font-family: monospace;
margin-top: 5%;
cursor: pointer;
}
.start_btn:hover,.stop_btn:hover{
background: #FFA751;
color: #ffffff;
}
.margin_auto{
margin: auto;
}
.element{
color: #000;
font-family:'Poppins','Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
text-align: center;
}
.convert_box{
width: 100%;
height:auto;
border-radius: 5px;
border: 1px solid #f1f1f1;
background-color: #ffffff;
margin: auto;
padding: 4%;
padding-bottom: 5%;
overflow-y: hidden;
}
.increase-height:hover{
height: 60px !important;
background: #777 !important;
color: #ffffff !important;
}
