Template:赛马娘人物简介/style.css

.umamusume-intro {
    border-radius: 10px;
    border: thick solid #F57D38;
    height: 550px;
    width: 550px;
    margin: 10px;
    text-align: center;
    vertical-align: middle;
    display: flex;
    flex-wrap: wrap;
    box-sizing: content-box;
}

/* bordered-box再见 */
.umamusume-intro * {
    box-sizing: content-box;
}

.umamusume-intro .uma-img {
    border-right: thick dashed #F57D38;
    width: 250px;
    display: flex;
    align-items: flex-end;
}

.umamusume-intro .uma-img img {
    position: relative;
    right: 25px;
}

.umamusume-intro .uma-img.uma-bg-img img {
    position: static;
}

.umamusume-intro .uma-detail {
    width: 295px;
    text-align: center;
}

.umamusume-intro .uma-detail .uma-basic {
    height: 200px;
}

.umamusume-intro .uma-detail .uma-basic .uma-name {
    height: 70px;
    text-align: center;
    vertical-align: middle;
    font-size: xx-large;
    font-weight: bold;
    color: #F57D38;
}

.umamusume-intro .uma-detail .uma-basic .uma-cv {
    height: 30px;
    text-align: center;
    vertical-align: middle;
    font-size: large;
    font-weight: bold;
    color: #F57D38;
    margin-top: -10px;
}

.umamusume-intro .uma-detail .uma-basic .uma-name span,
.umamusume-intro .uma-detail .uma-basic .uma-cv span {
    display: inline-block;
}

.umamusume-intro .uma-detail .uma-basic .uma-info .uma-info-table {
    color: #F57D38;
    width: 100% !important;
    font-weight: bold;
    padding: 0 10px 0 10px;
}

.umamusume-intro .uma-detail .uma-basic .uma-info .uma-info-table tr {
    text-align: center;
}

.umamusume-intro .uma-detail .uma-description {
    margin: 0 20px 0 20px;
    color: #F57D38;
    height: 320px;
    border-top: dashed medium #F57D38;
    padding-top: 10px;
    text-align: left;
    overflow: auto;
}

.umamusume-intro .uma-description p {
    text-indent: 2em;
}

@media screen and (max-width: 600px) {
    .umamusume-intro {
        width: 95%;
        height: auto;
    }
    .umamusume-intro .uma-img {
        border-right: none;
        border-bottom: thick solid #F57D38;
        width: 100%;
        display: initial;
    }
    .umamusume-intro .uma-img img {
        position: static;
    }
    .umamusume-intro .uma-detail {
        width: 100%;
    }
    .umamusume-intro .uma-detail .uma-basic {
        height: auto;
    }
    .umamusume-intro .uma-detail .uma-basic .uma-info {
        margin-top: -20px;
    }
    .umamusume-intro .uma-detail .uma-basic .uma-info-table > tbody > tr > td {
        width: 40vw;
    }
    .umamusume-intro .uma-detail .uma-description {
        height: auto;
        overflow: initial;
    }
}
/* [[Category:赛马娘 Pretty Derby模板CSS]] */