.my-a:hover{
    color:white;
}
.my-a{
    color:#666666;
}
.active{
    color:#abffca;
}

.card{
    background : linear-gradient(180deg,#444444,#CCCCCC,#555555);
    border-style : solid;
    border-width : 4px;
    border-color : linear-gradient(145deg,#555555,#CCCCCC,#DDDDDD,#CCCCCC,#666666);
}

.floating{
	position:fixed;
	width: 60px;
	height:60px;
	bottom:0px;
	right:0px;
	color:#FFF;
	text-align:right;
       font-size:30px;
	/* box-shadow: 2px 2px 3px #999; */
  z-index:100;
}

.float-button{
	margin-top:16px;
}

.my-div {
	width: auto;
	height: auto;
	position: relative;
	animation-name: animate;
	animation-duration: 1s;
	animation-direction: reverse;
	animation-fill-mode: both;
	
}

@keyframes animate{
	from{top:250px;}
	to{top:550px;}
}

.my-div2 {
	width: auto;
	height: auto;
	position: relative;
	animation-name: animate2;
	animation-duration: 1s;
	animation-delay: 1s;
	animation-timing-function: ease-in-out;
	animation-fill-mode: both;
}

@keyframes animate2{
	from{left: 0px;top:270px;color:#00000000;}
	to{left: 0px;top:305px;color:#FFFFFF;}
}
