/**
 * @author: Procurios (Peter Slagter)
 * @about:  pc-article-gallery.css - General layout and grid settings of article gallery snippet
 */

/**
 * Defaults, resets
 */

/** Hidden to users, visible to screen readers */
.ag-article-offscreen {
    position: absolute;
    left: -9999em;
    top: -9999em;
}

/**
 * Layout without Javascript
 */

.ag-article {
    margin-bottom: 1.5em;
    padding-bottom: 1.5em;
    border-bottom: 1px solid #ccc;
}

.ag-art-last {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: 0;
}

/**
 * Layout with Js
 */

.has-js .pc-article-gallery {
    position: relative;
    overflow: hidden;
}

.has-js .ag-article {
    width: 100%;
    height: 100%;
    overflow: hidden;
    margin-bottom: 0;
    padding-bottom: 0;
    border: 0;
}

/**
 * Default layout of gallery navigation
 */

.ag-nav-container {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 3px 0;
    text-align: center;
    background-color: rgba(255, 255, 255, .7);
    z-index: 10000;
}

.ie8 .ag-nav-container, .ie7 .ag-nav-container, .ie6 .ag-nav-container {
    background-color: #fff;
}

.ag-nav {
    display: inline;
    margin: 0;
    padding: 0;
    list-style: none;
}

.ag-nav li,
.ag-nav-container span {
    display: inline-block;
    *display: inline; /** FIX - Convert "inline-block" to "inline" for IE6 & IE7 */
    *zoom: 1; /** Set hasLayout to true to apply width & height values */
    width: 20px;
    height: 20px;
    line-height: 20px;
    margin: 1px 3px 1px 0;
    border: 1px solid #444;
    border-radius: 2px;
    color: #ccc;
    background-color: rgba(0, 0, 0, 0.6);
    *background-color: rgb(150, 150, 150);
    cursor: pointer;
}

.ag-nav li:hover,
.ag-nav .ag-nav-active,
.ag-nav-container span:hover {
    text-shadow: none;
    color: #fff;
    background: #666; /* Old browsers */
    background: -moz-linear-gradient(top, #444444 0%, #0a0a0a 100%); /** FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#444444), color-stop(100%,#0a0a0a)); /** Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #444444 0%,#0a0a0a 100%); /** Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #444444 0%,#0a0a0a 100%); /** Opera 11.10+ */
    background: -ms-linear-gradient(top, #444444 0%,#0a0a0a 100%); /** IE10+ */
    background: linear-gradient(to bottom, #444444 0%,#0a0a0a 100%); /** W3C */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#444444', endColorstr='#0a0a0a',GradientType=0); /** IE6-9 */
}