﻿.timercontent {
    text-align: center;
    border: 6px solid black;
    border-top: none;
    width: 720px;
    position: relative;
    top: -56px;
    color: black;
}

.top {
    width: 736px;
    height: 100px;
    background-image: url(/2019/timer/images/top.png);
    background-repeat: no-repeat;
    position: relative;
}

.toptimer {
    height: 168px;
    background-image: url(/2019/timer/images/timerhead.png);
    background-repeat: no-repeat;
    position: relative;
    top: 58px;
    left: 5px;
}

.toptext {
    cursor: default;
    user-select: auto;
    padding: 0.25rem;
    width: 317px;
    height: 100px;
    word-break: break-all;
    font-size: 16px;
    writing-mode: horizontal-tb;
    min-height: inherit;
    letter-spacing: 0.02em;
    background-color: black;
    position: relative;
    top: 55px;
    left: 206px;
}

    .toptext span {
        display: block;
        margin-top: 5px;
        margin-bottom: 0px;
        color: rgb(240, 182, 0);
        word-break: break-all;
        text-indent: 0em;
        user-select: auto;
        font-size: 100%;
        padding-top: 10px;
    }

.midtext {
    cursor: default;
    user-select: auto;
    padding: 0.25rem;
    width: 100%;
    height: 100%;
    word-break: break-all;
    font-size: 28.8px;
    writing-mode: horizontal-tb;
    min-height: inherit;
    letter-spacing: 0em;
    position: relative;
    top: 80px;
    padding-bottom: 60px;
}

    .midtext span {
        display: block;
        margin-top: 0px;
        margin-bottom: 0px;
        color: inherit;
        word-break: break-all;
        text-indent: 0em;
        user-select: auto;
        font-size: 100%;
    }

.right {
    width: 210px;
    height: 64px;
    background-color: rgb(240, 182, 0);
    position: relative;
    left: -80px;
}

.left {
    width: 210px;
    height: 64px;
    background-color: rgb(240, 182, 0);
    position: relative;
    left: 80px;
    top: 60px;
    text-align: center;
    z-index: 200;
}

.meta-details span {
    cursor: default;
    user-select: auto;
    padding: 1.25rem;
    width: 100%;
    height: 100%;
    word-break: break-all;
    font-family: "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 24px;
    writing-mode: horizontal-tb;
    min-height: inherit;
    letter-spacing: 0em;
    display: block;
    margin-top: 0px;
    margin-bottom: 0px;
    color: black;
    word-break: break-all;
    text-indent: 0em;
    user-select: auto;
    font-weight: 600;
}

.content-details {
    position: relative;
    top: 80px;
}

    .content-details div {
        cursor: default;
        user-select: auto;
        padding: 0.25rem;
        width: 315px;
        height: 100%;
        word-break: break-all;
        font-family: "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
        font-size: 18px;
        writing-mode: horizontal-tb;
        min-height: inherit;
        letter-spacing: 0em;
    }

#img1 {
    display: block;
    filter: brightness(1) contrast(100%) saturate(100%) hue-rotate(0deg) blur(0px);
    width: 268.8px;
    height: 179.413px;
    margin-top: -12.9064px;
    margin-left: -60px;
    max-width: 200%;
}

#img2 {
    display: block;
    filter: brightness(1) contrast(100%) saturate(100%) hue-rotate(0deg) blur(0px);
    width: 268.8px;
    height: 179.413px;
    margin-top: -12.9064px;
    max-width: 200%;
}

#img3, #img5, #img7, #img9 {
    display: block;
    filter: brightness(1) contrast(100%) saturate(100%) hue-rotate(0deg) blur(0px);
    width: 268.8px;
    height: 179.413px;
    margin-top: -12.9064px;
    max-width: 200%;
    position: relative;
    left: -55px;
}

#img4, #img6, #img8, #img10 {
    display: block;
    filter: brightness(1) contrast(100%) saturate(100%) hue-rotate(0deg) blur(0px);
    width: 268.8px;
    height: 179.413px;
    margin-top: -12.9064px;
    max-width: 200%;
    position: relative;
    left: -15px;
}

#svg {
    position: relative;
    left: 120px;
}

#svg1, #svg4, #svg6, #svg8 {
    height: 100%;
    transform: rotateY(180deg);
    position: relative;
    left: -205px;
}

#svg2 {
    position: relative;
    left: 120px;
}

#svg3, #svg5, #svg7, #svg9 {
    position: relative;
    left: 93px;
}

.element-box-contents {
    width: 25%;
    position: relative;
    left: 245px;
}

.vertical {
    border-left: 4px dashed rgb(240, 182, 0);
    height: 590px;
    position: absolute;
    left: 310px;
    bottom: -82px;
}

.rightvertical {
    border-left: 4px dashed rgb(240, 182, 0);
    height: 250px;
    position: absolute;
    left: -48px;
    top: 170px;
}

.rightvertical2016 {
    border-left: 4px dashed rgb(240, 182, 0);
    height: 245px;
    position: absolute;
    left: -48px;
    top: 170px;
}


.rightvertical2020 {
    border-left: 4px dashed rgb(240, 182, 0);
    height: 280px;
    position: absolute;
    left: -48px;
    top: 170px;
}

.leftvertical {
    border-left: 4px dashed rgb(240, 182, 0);
    height: 242px;
    position: absolute;
    left: 308px;
    top: 170px;
}

.leftvertical2018 {
    border-left: 4px dashed rgb(240, 182, 0);
    height: 307px;
    position: absolute;
    left: 308px;
    top: 170px;
}

.leftvertical2021 {
    border-left: 4px dashed rgb(240, 182, 0);
    height: 255px;
    position: absolute;
    left: 308px;
    top: 170px;
}

.detailsleft {
    position: relative;
    top: 200px;
    left: -380px;
    z-index: 100;
    width: 300px;
    text-align: left;
    font-family: "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 17px;
}

.detailsright {
    position: relative;
    top: 159px;
    left: 350px;
    z-index: 100;
    text-align: left;
    font-family: "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 17px;
}

.new-text {
    text-align: left;
    width: 260px;
    font-size: 18px;
}

.new-text-right {
    text-align: left;
    width: 260px;
}

.leftcontent {
    top: -40px;
}

.leftcontent55 {
    top: -55px;
}

.leftcontent25 {
    top: -25px;
}

.rightcontent {
    top: 15px;
}

.rightcontent45 {
    top: 45px;
}

.spanleft {
    position: relative;
    left: -30px;
}

.spanleftzt {
    font-family: "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 17px;
}

.movetop {
    position: relative;
    top: -70px;
}

.leftContext {
    margin-left: 20px;
}

.end {
    cursor: default;
    user-select: auto;
    padding: 0.25rem;
    width: 100%;
    height: 100%;
    word-break: break-all;
    font-family: "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 18px;
    writing-mode: horizontal-tb;
    min-height: inherit;
    letter-spacing: 0em;
}

.endspan {
    background-color: rgb(240, 182, 0);
    width: 210px;
    height: 65px;
    position: relative;
    left: 250px;
    top: -60px;
    font-weight: 600;
    font-size: 24px;
}

.enddiv {
    position: relative;
    top: -60px;
}

    .enddiv div {
        width: 50%;
        padding-left: 25%;
    }

.endlogo {
    height: 100px;
    background-image: url(/2019/timer/images/11.png);
    background-repeat: no-repeat;
    position: relative;
}

    .endlogo h4 {
        margin-right: 30%;
        padding-top: 3%;
    }

.foot {
    background-image: url(/2019/timer/images/12.jpg);
    background-repeat: no-repeat;
    height: 2808px;
}

.weixin {
    background-image: url(/2019/timer/images/13.png);
    background-repeat: no-repeat;
    height: 325px;
    position: relative;
    left: 53px;
}
