/*第一套爱心*/
.heart {
	background-color: #da3848;
	display: inline-block;
	height: 30px;
	position: relative;
	top: 0;
	transform: rotate(-45deg);
	width: 30px;
}

.heart {
	animation: heartbeat 1s infinite;
}

.heart:before, .heart:after {
	content: "";
	background-color: #da3848;
	border-radius: 50%;
	height: 30px;
	position: absolute;
	width: 30px;
}

.heart:before {
	top: -15px;
	left: 0;
}

.heart:after {
	left: 15px;
	top: 0;
}

/*第二套爱心*/
.heart2{
    position: relative;
    display: flex;
    height: 20px;
}
.heart2 span{
    width: 2px;
    height: 2px;
    border-radius: 2px;
    margin: 0 .4px;
}
.heart2 span:nth-child(1){
    background-color: red;
    animation: love1 3.2s 0s infinite;
}
.heart2 span:nth-child(2){
    background-color: darkturquoise;
    animation: love2 3.2s 0.2s infinite;
}
.heart2 span:nth-child(3){
    background-color: darksalmon;
    animation: love3 3.2s 0.4s infinite;
}
.heart2 span:nth-child(4){
    background-color: deeppink;
    animation: love4 3.2s 0.6s infinite;
}
.heart2 span:nth-child(5){
    background-color: yellow;
    animation: love5 3.2s 0.8s infinite;
}
.heart2 span:nth-child(6){
    background-color: deeppink;
    animation: love4 3.2s 1s infinite;
}

.heart2 span:nth-child(7) {
    background-color: darksalmon;
    animation: love3 3.2s 1.2s infinite;
}

.heart2 span:nth-child(8) {
    background-color: darkturquoise;
    animation: love2 3.2s 1.4s infinite;
}

.heart2 span:nth-child(9) {
    background-color: red;
    animation: love1 3.2s 1.6s infinite;
}
/* 下面定义动画 */
@keyframes love1{
    30%,50%{
        height: 5px;
        transform: translateY(-2.3px);
    }
    70%,100%{
        height: 2px;
        transform: translateY(0);
    }
}

@keyframes love2 {

    30%,
    50% {
        height: 10.4px;
        transform: translateY(-5px);
    }

    70%,
    100% {
        height: 2px;
        transform: translateY(0);
    }
}

@keyframes love3 {

    30%,
    50% {
        height: 13.3px;
        transform: translateY(-6.25px);
    }

    70%,
    100% {
        height: 2px;
        transform: translateY(0);
    }
}

@keyframes love4 {

    30%,
    50% {
        height: 15px;
        transform: translateY(-5px);
    }

    70%,
    100% {
        height: 2px;
        transform: translateY(0);
    }
}

@keyframes love5 {

    30%,
    50% {
        height: 16.7px;
        transform: translateY(-3.75px);
    }

    70%,
    100% {
        height: 2px;
        transform: translateY(0);
    }
}
/*动态彩虹字体*/
.rainbow-text {
    background-image: linear-gradient(to left, orangered, orange, gold, lightgreen, cyan, dodgerblue, mediumpurple, hotpink, orangered);
    background-size: 110vw;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-animation:rainbow 60s linear infinite;
    animation: rainbow 60s linear infinite;
}

@keyframes rainbow {
	100% {
    background-position: -2000vw;
}
}

.home-card{
    border-radius: 8px !important; 
    box-shadow: 1px 4px 15px rgb(125 147 178 / 30%);
    border:1px solid rgba(208,206,206,.4)!important;
    margin:10px;
}

/*高亮文字*/
.highlight{
  border-radius:2px;
  background-color: #FDCD87;
  padding: 2px 4px;
  margin: 0 2px;
}

@-webkit-keyframes rainbow {
    to {
        background-position: -2000vw;
    }
}

@keyframes heartbeat {
	0% {
		transform: scale( 1) rotate(-45deg);
	}
	20% {
		transform: scale( 1.2) rotate(-45deg);
	}
	40% {
		transform: scale( 1.3) rotate(-45deg);
	}
}