/* SVN FILE: $Id: _indexVideos.css 198 2016-11-23 16:14:49Z Wolff $ */
/**
 * @lastChangedBy       $LastChangedBy: Wolff $
 * @copyright           ARZA STUDIO
 * @version             $Revision: 198 $
 * @date                $Date: 2016-11-23 17:14:49 +0100 (mer., 23 nov. 2016) $
 * @license             LICENSE.TXT
 * @filesource          $URL: https://svn.arza-studio.com/ikos/trunk/protected/modules/media/assets/media/index/_indexVideos.css $
 */

#indexHistory {
    height: 600px;
    width: 100vw;
    background: white;
    z-index: 1;
    overflow: hidden;
    padding: 0 0 150px 0;
    background: #f8f8f8;
}
@media (min-width: 768px)
{
    #indexHistory {
        height: 650px;
    }
}
@media (min-width: 992px)
{
    #indexHistory {
        height: 700px;
    }
}
@media (min-width: 1200px)
{
    #indexHistory {
        height: 750px;
    }
}
    #indexHistory .scroller {
        width: 100%;
        height: 100%;
        overflow-x: scroll;
        padding-bottom: 12px;
        padding-left: 15px;
    }
    @media (min-width: 768px)
    {
        #indexHistory .scroller {
            padding-left: 169px;
        }
    }
    @media (min-width: 992px)
    {
        #indexHistory .scroller {
            padding-left: 207.66px;
        }
    }
    @media (min-width: 1200px)
    {
        #indexHistory .scroller {
            padding-left: 346.5px;
        }
    }
        #indexHistory img {
            width: auto !important;
            max-height: 100%;
        }
    #indexHistory .arrowLeft,
    #indexHistory .arrowRight {
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        text-align: center;
        font-size: 50px;
        margin-top: 20px;
        cursor: pointer;
        color:rgb(111, 111, 110);
        background: transparent;
        border: none;
    }
    #indexHistory .arrowLeft.disabled,
    #indexHistory .arrowRight.disabled {
        pointer-events: none;
        opacity: 0.2;
    }
    #indexHistory .arrowLeft {
        margin-left: -100px;
    }
    #indexHistory .arrowRight {
        margin-left: 100px;
    }