/**
 * Tempera Frontpage Stylesheet
 * Nivo Slider: theme-default skin + ribbon separator
 */

/* ============================================================
   Nivo Slider — theme-default
   ============================================================ */

.theme-default .nivoSlider {
    -moz-box-shadow:    0 1px 10px 0 #555;
    -webkit-box-shadow: 0 1px 10px 0 #555;
    box-shadow:         0 1px 10px 0 #555;
}

.theme-default .nivo-directionNav a {
    width:  30px;
    height: 30px;
    background: url('../images/nivoslider/arrows.png') no-repeat;
    cursor: pointer;
    top: 45%;
}

.theme-default a.nivo-prevNav {
    background-position: 0 0;
    left: 10px;
}

.theme-default a.nivo-nextNav {
    background-position: -30px 0;
    right: 10px;
}

.theme-default .nivo-controlNav {
    position: relative;
    top: -27px;
    right: 2px;
}

.theme-default .nivo-controlNav a {
    display:      inline-block;
    width:        22px;
    height:       22px;
    background:   url('../images/nivoslider/bullets.png') no-repeat;
    cursor:       pointer;
    text-indent:  -9999px;
}

.theme-default .nivo-controlNav a.active {
    background-position: 0 -22px;
}

/* Loading indicator */
.theme-default .nivo-loading {
    background: #fff url('../images/nivoslider/loading.gif') no-repeat 50% 50%;
}

/* ============================================================
   Ribbon — decorative separator between navigation and slider
   A thin gradient band that bridges the nav (#EAEAEA) into the
   dark slider shadow, using the site's existing accent teal.
   ============================================================ */

.ribbon {
    display: block;
    position: relative;
    width:  100%;
    height: 6px;
    margin: 0;
    padding: 0;
    z-index: 6;
    background: linear-gradient(
        to right,
        #1693A5 0%,
        #0e7a8a 30%,
        #1693A5 60%,
        #D6341D 100%
    );
    box-shadow: 0 1px 3px rgba(0,0,0,0.35);
}