﻿
#featured-content-container
{
    display:inline-block;
    width:100%;
    margin:15px 0 25px 0;
}

#featured-content-container h2
{
    color:white;
    font-size:36px;
    font-weight:normal;
    text-shadow:1px 2px 4px black;
}

.featured-content-wrapper
{
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center bottom;
    padding-top:100%;
    display:block;
}

.featured-item-wrapper
{
    margin:0 15px 15px 15px;
}

.featured-content-wrapper
{
    margin-top:10px;
    display:block;
    border:4px solid black;
}

.featured-image-background
{
    background-color:darkgray;
    position:relative;
}

.featured-arrow
{
    margin:5px auto 0 auto;
    max-width:25px;
}

#announcements 
{
    background-image: url(../../../Content/SiteImages/CalendarofEventsPhoto.jpg);
}

#trail-of-the-year
{
    background-image: url(../../../Content/SiteImages/ribbon-cutting.jpg);
}

#featured-trail
{
    background-image: url(../../../Content/SiteImages/featured-trail.jpg);
}

#featured-content-container h1
{
    text-shadow:1px 2px 4px black;
    font-size:3vw;
}

.featured-content-wrapper:hover
{
    cursor:pointer;
    opacity:.5;
}

.featured-text
{
    top:75%;
    position:absolute;
    width: -webkit-calc(100% - 8px);
    width: -moz-calc(100% - 8px);
    width:calc(100% - 8px);
    padding-top:5px;
    padding-bottom:5px;
}

.featured-text-background 
{
    top: 75%;
    position: absolute;
    width: -webkit-calc(100% - 8px);
    width: -moz-calc(100% - 8px);
    width:calc(100% - 8px);
    opacity:.7;
    padding-top:5px;
    padding-bottom:5px;
}

@media(max-width:991px)
{
    .featured-item-wrapper
    {
        max-width:600px;
        margin:0 auto;
    }
}

@media(max-width:631px)
{
    .featured-item-wrapper
    {
        max-width:500px;
    }
}

@media(max-width:531px)
{
    .featured-item-wrapper
    {
        max-width:100%;
        margin:0 15px 15px 15px;
    }
}