/*

Stylesheet for slidorion

 */

#slidorion1 {
    width: 90vw; /* Set to slidorion width. Is equal to #slider + #accordion width */
    height: 33.3vw; /* Set to slidorion height. Is equal to #slider and #accordion height */
    position: relative;
    left: 50%;
    margin-left: -45vw;
    /*padding: 10px;
            background: #cbcbcb;
            border: 1px solid #bbb;
            -webkit-box-shadow: 0 0 34px #bbb;
            -moz-box-shadow: 0 0 34px #bbb;
            box-shadow: 0 0 34px #bbb;*/
}

#slidorion {
    width: 90vw; /* Set to slidorion width. Is equal to #slider + #accordion width */
    height: 33.3vw; /* Set to slidorion height. Is equal to #slider and #accordion height */
    position: relative;
    left: 50%;
    margin-left: -42vw;
    padding: 10px;
    background: #cbcbcb;
    border: 1px solid #bbb;
    -webkit-box-shadow: 0 0 34px #bbb;
    -moz-box-shadow: 0 0 34px #bbb;
    box-shadow: 0 0 34px #bbb;
}

#slider {
    width: 60vw; /* Set to slider width */
    height: 33.3vw; /* Set to slider height */
    position: relative;
    float: left;
    overflow: hidden; /* Hides the animations */
}

.slider-image {
    position: relative;
}

.headerLeftOn {
 border-left: 4px solid #878787;
}

.headerLeftOut {
 border-left: 4px solid #ccc;
}

#accordion {
    width: 29vw; /* Set to accordion width */
    height: 33.3vw; /* Set to image height */
    font-family: Verdana;
    position: relative;
    z-index: 9;
    float: left;
}

    #accordion .header {
        width: 18vw;
        line-height: 4vw;
        border: none;
        border-top: 0px solid #fff;
        background-color: white;
        border-left: 0px solid #bbb;
    }

        #accordion .header.active {
            border-left: 3px solid #acacac;
        }

        #accordion .header a {
            background: none;
            text-decoration: none;
            font-size: 1vw;
            display: block;
            padding-left: 2vw;
            border-left: 4px solid #ccc;
            color: #b4b4b4;
        }

            #accordion .header a:hover {
                cursor: pointer;
                padding-left: 2vw;
            }


            #accordion .header a.active {
                border-bottom: none;
                font-weight: bold;
                padding-left: 2vw;
                border-left: 4px solid #878787;
                color: #333;
            }

    #accordion .content {
        width: 18vw;
        height: 15vw;
        font-size: 0.8vw;
        margin: 0;
        padding-left: 2vw;
        padding-top: 0.5vw;
        padding-bottom: 0.5vw;
        border: none;
        background-color: white;
        color: #4e4e4e;
        border-left: 4px solid #878787;
        overflow: auto;
        line-height:1.3vw;
    }