/*General Accordion****************************************************************************/
    /*Set style of open slide*/
    .accordion section:target {
        padding: 1em;
        background: var(--bg-color-light)
    }

    .accordion section:target:hover {
        background: var(--bg-color-light)
    }

    .accordion section:target h2 {
        width: 100%;
    }

    .accordion section:target h2 a {
        padding: 0;
        color: #eee;
    }

    .accordion section:target p {
        display: block;
    }

    .accordion section:target .butinfo {
        display: inline-block;
        margin: 0 .5em 0 0;
        border-radius: 0
    }

    .accordion section h2 a {
        display: block;
        padding: 8px 10px;
        font-weight: normal;
        color: #eee;
        text-decoration: none;
    }

    @media screen and (min-width: 1000px) {
        .accordion section:target {
            padding: 10px;
        }

        .accordion section h2 a {
            padding: 8px 10px;
        }
    }

    .horizontal section:target h2 img {
        display: inline-block;
    }

    /*set style of closed slide*/
    .accordion section {
        float: left;
        overflow: hidden;
        margin: 3px;
        color: #eee;
        background: var(--bg-color-dark);
        cursor: pointer;
    }

    .accordion section:hover {
        background: var(--bg-color-light)
    }

    .accordion section p {
        display: none;
    }

    .accordion section .butinfo {
        display: none;
    }

    .horizontal section h2 img {
        display: none;
    }

    .accordion section:after {
        position: relative;
        font-weight: bold;
        color: #000;
    }

    /*End General Accordion****************************************************************************/

    /*Horizontal Accordion *********************************************************************/
    .horizontal section {
        width: 99%;
    }

    @media screen and (min-width: 1000px) {
        .horizontal section {
            width: 5%;
            height: 330px;
            -webkit-transition: width 0.2s ease-out;
            -o-transition: width 0.2s ease-out;
            transition: width 0.2s ease-out;
        }
    }

    /*Position the number of the slide*/
    .horizontal section:after {
        top: 4px;
        left: 15px;
    }

    @media screen and (min-width: 1000px) {
        .horizontal section:after {
            top: 140px;
            left: 15px;
        }
    }

    /*Header of closed slide*/
    .horizontal section h2 {
        position: relative;
        left: 0;
        top: 0;
        width: 100%;
        margin: 0;
        -webkit-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    @media screen and (min-width: 1000px) {
        .horizontal section h2 {
            position: relative;
            left: -96px;
            top: 85px;
            width: 240px;
            padding-left: 10px;
            -webkit-transform: rotate(90deg);
            -ms-transform: rotate(90deg);
            transform: rotate(90deg);
        }
    }

    /*On mouse over open slide*/
    .horizontal :target {
        width: 99%;
        height: 100%;
    }

    @media screen and (min-width: 1000px) {
        .horizontal :target {
            width: 43%;
            height: 100%;
        }
    }

    .horizontal :target h2 {
        top: 0px;
        left: 0;
        -webkit-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    .horizontal p span {
        display: inline-block;
        margin-right: 1em;
        font-size: 0.9rem;
    }

    @media print {
        .accordion section {
            overflow: inherit;
            color: black;
            background: white;
        }

        .accordion section .butinfo,
        .accordion section:target .butinfo,
        .accordion section::after {
            display: none;
        }

        .accordion section p,
        .horizontal section h2 img {
            display: block;
        }

        .accordion section:target {
            background: white !important;
        }

        .accordion section h2 a,
        .accordion section:target h2 a {
            color: black;
        }

    }