/* * { 
margin: 0;
padding: 0;
box-sizing: border-box; 
font-family: 'Poppins', sans-serif;
}*/
.cards-div { 
    display: flex; 
    justify-content: center; 
    align-items: center;
    min-height: 100vh;
    background-color: #000;
    overflow: hidden;
    position: fixed;
    top:0px;
    left:0px;
    width:100%;
    height:100%;
    z-index:1000;
}
.cards-container {
    position: relative;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    }
.cards-div .close-div {
    position: absolute;
    right :0px; 
    top :0px; 
    bottom: 10%;
    padding:20px;
}
.cards-div .close-div a{
    color:#fff;
    font-size:2em;
}
.cards-container .card {
    /* 设置卡片的位置、大小、背景颜色、边框、过渡效果、旋转原点、颜色、字体大小、字体粗细、阴影*/
    position: absolute;
    width: 240px;
    height: 360px;
    background-color: #993333;
    border-radius: 8px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: rgba(0, 0, 0, 0);
    font-size: 8em;
    font-weight: 700;
    border: 10px solid rgba(0, 0, 0, .1);
    transition: .5s;
    transform-origin: 50% 100%;
    box-shadow: 0 15px 50px rgba(0, 0, 0, .1);
    background-repeat: no-repeat;
    background-position: left top, right bottom, center center;
    background-size: 100% 100%;
    }
.cards-container .cbg1 {
    background-image: url("/image/972711_0.jpg");
}
.cards-container .cbg2 {
    background-image: url("/image/972712_0.jpg");
}
.cards-container .cbg3 {
    background-image: url("/image/972713_0.jpg");
}
.cards-container .cbg4 {
    background-image: url("/image/972714_0.jpg");
}
.cards-container .cbg5 {
    background-image: url("/image/972715_0.jpg");
}
.cards-container:hover .card {
    /* 设置鼠标悬停时的卡片旋转、平移、阴影、颜色、光标样式 */
    transform: rotate(calc(var(--i)*5deg)) translate(calc(var(--i)*120px), -50px);
    box-shadow: 0 15px 50px rgba(0, 0, 0, .25);
    color: rgba(0, 0, 0, .25);
    cursor: pointer;
}
@media (max-width: 991px) {
    .cards-container:hover .card {
    /* 设置鼠标悬停时的卡片旋转、平移、阴影、颜色、光标样式 */
    transform: rotate(calc(var(--i)*5deg)) translate(calc(var(--i)*40px), -50px);
    }
    .cards-container .card {
    /* 设置卡片的位置、大小、背景颜色、边框、过渡效果、旋转原点、颜色、字体大小、字体粗细、阴影*/
    position: absolute;
    width: 160px;
    height: 240px;
    }

}
.cards-container:hover .card:not(:hover) {
    /* 设置鼠标按下时的卡片背景颜色 */
    background-color: #333;
}
.cards-container .card:hover{
    /* 设置鼠标按下时的卡片平移、层级 */
    translate: calc(var(--i)*20px) -25px;
    z-index: 999;
}


.btn-div {
    padding-top:100px;
}

.result-container {
    
}

.result-container .result-div {
    padding:30px;
    border-radius:25px;
    color: #eee;
    font-size:2.6em;
    background-color:#9c0f2a;
}

.verse-text {

}

.row-same-height {
    display: table;
    width: 100%;
}

.row-same-height [class^=col-] {
    display: table-cell;
    float: none;
    vertical-align: middle;
}