.testme {
    color: #A7A7A7;
    background: #D4D4D4;
    -ms-transform: perspective(800px) rotateX(46deg);
    -webkit-transform: perspective(800px) rotateX(46deg);
    transform: perspective(800px) rotateX(46deg);
}

.bookList > .is-active {
    background: white;
    -ms-transform: perspective(800px) rotateX(0deg) translateY(-15%);
    -webkit-transform: perspective(800px) rotateX(0deg) translateY(-15%);
    transform: perspective(800px) rotateX(0deg) translateY(-15%);
}

.bookList .is-active:first-of-type  {
    -ms-transform: perspective(800px) rotateX(0deg) translateY(0);
    -webkit-transform: perspective(800px) rotateX(0deg) translateY(0);
    transform: perspective(800px) rotateX(0deg) translateY(0);
}

.bookList > .is-active + .testme {
    -ms-transform: perspective(800px) rotateX(-46deg);
    -webkit-transform: perspective(800px) rotateX(-46deg);
    transform: perspective(800px) rotateX(-46deg);
}

.dataContainer {
    position: absolute;
    width: 100%;
    background: #D4D4D4;
}

.date-time {
    padding-right: 3vw;
    border-bottom: 0.1vw solid #333333;
}

.date-days {
    /*font: bold 2vw Open Sans Condensed, sans-serif;*/
    font-style: normal;
    font-variant-ligatures: normal;
    font-variant-caps: normal;
    font-variant-numeric: normal;
    font-variant-east-asian: normal;
    font-weight: 800;
    font-size: 2vw;
    line-height: 2vw;
    font-family: "Open Sans";
    display: flex;
    justify-content: center;
}

.date-month {
    font: 1.2vw/2.2vw "Open Sans";
    border-bottom: 0.1vw solid #333333;
}

.date-location {
    font-style: normal;
    font-variant-ligatures: normal;
    font-variant-caps: normal;
    font-variant-numeric: normal;
    font-variant-east-asian: normal;
    font-weight: 800;
    font-size: 2vw;
    line-height: 2vw;
    font-family: "Open Sans";
}

.testme > .date-days {
    font-size: 1.2vw;
}

    .testme > .date-days > .date-month {
        font-size: 0.8vw;
        border-color: #a7a7a7;
    }

.testme > .date-location {
    font-size: 0.8vw;
}

.testme > .date-days > .date-time {
    padding-right: 1vw;
    border-color: #a7a7a7;
}

.bookList > .is-active > .date-days > .date-time {
    padding-right: 3vw;
    border-color: #333333;
}

.bookList > .is-active > .date-days {
    font-size: 1.5vw;
    line-height: 2.3vw;
    color: #333333;
}

    .bookList > .is-active > .date-days > .date-month {
        font-size: 1.2vw;
        font-weight: 700;
        border-color: #333333;
    }

.bookList > .is-active > .date-location {
    font-size: 1.2vw;
    color: #333333;
}

.calendarMidSection {
    padding-top: 10%;
    padding-bottom: 10.7%;
    position: absolute;
    width: 108%;
    margin-top: 28.4%;
    background: white;
    border: 2px solid;
    margin-left: -4%;
    z-index: 1;
    background: rgb(255,255,255);
    background: -moz-linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 3.6%, rgba(255,255,255,0) 3.6%, rgba(255,255,255,0) 96.4%, rgba(255,255,255,1) 96.4%, rgba(255,255,255,1) 100%);
    background: -webkit-linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 3.6%, rgba(255,255,255,0) 3.6%, rgba(255,255,255,0) 96.4%, rgba(255,255,255,1) 96.4%, rgba(255,255,255,1) 100%);
    background: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 3.6%, rgba(255,255,255,0) 3.6%, rgba(255,255,255,0) 96.4%, rgba(255,255,255,1) 96.4%, rgba(255,255,255,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#ffffff",GradientType=1);
}
@media screen and (max-width: 680px) {
    .date-time {
        padding-right: 3vw;
        border-bottom: 0.1vw solid #333333;
    }

    .date-days {
        font-style: normal;
        font-variant-ligatures: normal;
        font-variant-caps: normal;
        font-variant-numeric: normal;
        font-variant-east-asian: normal;
        font-weight: 800;
        font-size: 8vw;
        line-height: 8.6vw;
        font-family: "Open Sans";
        display: flex;
        justify-content: center;
    }

    .date-month {
        font: 3vw/8.6vw "Open Sans";
    }

    .date-location {
        font-style: normal;
        font-variant-ligatures: normal;
        font-variant-caps: normal;
        font-variant-numeric: normal;
        font-variant-east-asian: normal;
        font-weight: 800;
        font-size: 8vw;
        line-height: 8vw;
        font-family: "Open Sans";
    }

    .testme > .date-days {
        font-size: 3vw;
    }

        .testme > .date-days > .date-month {
            font-size: 3vw;
            border-color: #a7a7a7;
        }

    .testme > .date-location {
        font-size: 2.8vw;
    }

    .testme > .date-days > .date-time {
        padding-right: 1vw;
        border-color: #a7a7a7;
    }

    .bookList > .is-active > .date-days > .date-time {
        padding-right: 9vw;
        border-color: #333333;
    }

    .bookList > .is-active > .date-days {
        font-size: 4.2vw;
        line-height: 9vw;
        color: #333333;
    }

        .bookList > .is-active > .date-days > .date-month {
            font-size: 3.9vw;
            border-color: #333333;
        }

    .bookList > .is-active > .date-location {
        font-size: 4.2vw;
        color: #333333;
    }

    .calendarMidSection {
        padding-top: 10%;
        padding-bottom: 10.7%;
        position: absolute;
        width: 108%;
        margin-top: 28.4%;
        background: white;
        border: 2px solid;
        margin-left: -4%;
        z-index: 1;
        background: rgb(255,255,255);
        background: -moz-linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 3.6%, rgba(255,255,255,0) 3.6%, rgba(255,255,255,0) 96.4%, rgba(255,255,255,1) 96.4%, rgba(255,255,255,1) 100%);
        background: -webkit-linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 3.6%, rgba(255,255,255,0) 3.6%, rgba(255,255,255,0) 96.4%, rgba(255,255,255,1) 96.4%, rgba(255,255,255,1) 100%);
        background: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 3.6%, rgba(255,255,255,0) 3.6%, rgba(255,255,255,0) 96.4%, rgba(255,255,255,1) 96.4%, rgba(255,255,255,1) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#ffffff",GradientType=1);
    }
}