body,td,th {
font-family: 'Lato', sans-serif;
    font-size: 14px;
    color: #666;
}

a:link {
    color: #00b7c6;
    text-decoration: none;
}
a:visited {
    color: #00b7c6;
    text-decoration: none;
}
a:hover {
    color: #00b7c6;
    text-decoration: underline;
}
body {
    background-color: #FFF;
}
.brownheader
{
    font-size:28px;
    color: #dd7500;
    font-weight:bold;
font-family: 'Lato', sans-serif;
font-weight:400;
line-height:normal;

}
    
    button.bpt_bigorangebutton {
    border: 1px solid #d97e36; 
    background: #dd7727; 
    color: #ffffff; 
    background-image: url('/g/6/BPT_button_bottom.png'); 
    background-repeat: repeat-x; 
    background-position: center top ;
    background-size: 50% 50%;
font-family: 'Lato', sans-serif;
    font-size: 16px; 
    font-weight: bold;
    padding: 8px 22px 6px 22px;
    cursor: pointer;
    -moz-box-shadow: 1px 1px 2px #b8b8b8;
    -webkit-box-shadow: 1px 1px 2px #b8b8b8;
    box-shadow: 1px 1px 2px #b8b8b8;
    border-radius: 8px; 
    -moz-border-radius: 8px; 
    -webkit-border-radius: 8px;
}

button:hover.bpt_bigorangebutton {
    border: 1px solid #d97e36; 
    background: #ef7d21; 
    color: #ffffff; 
    background-image: url('/g/6/BPT_button_bottom_rollover.png'); 
    background-repeat: repeat-x; 
    background-position: center top ;
    background-size: 50% 50%;
font-family: 'Lato', sans-serif;
    font-size: 16px; 
    font-weight: bold;
    padding: 8px 22px 6px 22px;
    cursor: pointer;
    -moz-box-shadow: 3px 1px 2px #b8b8b8;
    -webkit-box-shadow: 3px 1px 2px #b8b8b8;
    box-shadow: 3px 1px 2px #b8b8b8;
    border-radius: 8px; 
    -moz-border-radius: 8px; 
    -webkit-border-radius: 8px;
}
    
a:active {
    text-decoration: none;
    color: #00b7c6;
}
/* EVENT LIST STYLING */
/* removes margins and padding of the ul container */
ul#event-list {
    margin: 0px;
    margin-top: 10px;
    margin-left: 15px;
    margin-bottom: 10px;
    list-style-type: none;
    height: 330px; /* set the height of the ul, that way we can use the overflow property */
    padding: 0 5px;
    overflow: scroll; /* this says to scroll any content that overflows outside of the height, its set to scroll */
    overflow-x: hidden;
    float: left;
    width: 280px;
}
    /* this styles the li element within the ul tagged with the ID "event-list" */
    ul#event-list li a {
        text-decoration: none; /* removes the underlines of links, which in this case is everything */
        width: 95%; /* sets the link to a width of 450px */
        display: block; /* links are inline elements. we need to change it to block. which means it lives on one line of "text". we change it to block so it will render outside of it's line"*/
        float: left; /* floats the element as far to the left as possible */
        padding: 10px; /* creates a 10px padding within the boundries of the box */
        background: #666; /* applies the grey background */
        margin-bottom: 5px; /* adds a margin of 5px. margin is different from padding since it applies to the outside of the box */
        list-style-type: none; /* removes the bullet point of the li */

    }
    ul#event-list li a:hover {
        background: #777;
    }
        /* commented out. no images.
        #event-list div.event-image {
            float: left;
            width: 100px;
            height: 100px;
            overflow: hidden;
        }
            .event-image img {

            }
        */
        #event-list div.event-data {
            float: left;
            width: 100%;
        }

    /* this will style the span with the class "title" located within the li */
    ul#event-list li span.event-title {
        display: block;
        color: #00b7c6;
        font-weight: bold;
        clear: both;
        float: left;
        text-transform: uppercase; /* makes all text uppercase */
        max-width: 250px; /* gives the link set width so it doesnt take up the entire width of the li */
    }

    /* this styles the span located within the li with the class "location" */
    span.event-location {
        display: block;
        float: left;
        clear: both;
        color: #fff;
        margin-top: 3px; /* adds a slight margin to the top of the location to space it out from the event's link */
    }

    /* this is the date styling, it targets the ul with the class "date" */
    ul.date-list {
        float: right;
    }
    ul.date-list li.date {
        display: none;
        list-style-type: none;
        padding: 5px; 
        background: #b9a632;
        color: #fff;
        width: 130px;
        float: right; /* this will force block elements to move as far to the right as possible*/
        text-align: center;
        clear: both;
    }
    ul.date-list li.date:first-child{
        display: block;
    }

    ul.date-list li.sold_out {
        width: 200px;
    }

    /**
     * Vet Tix Styling 
     */
    
    .vet-tix-image {
        margin-bottom: 15px;
    }

    .header-link {
        float: left;
    }

/*    .vet-tix-description {
        font-family: lato;
        font-size: 18px;
        line-height: 32px;
    }*/


    .hidden {
        display: none;
    }

    div.event-list-loading {
        text-align: center;
    }

    a.vettix-link {
        width: 100%:;
        margin: 0px;
        margin-top: 10px;
        margin-left: 15px;
        margin-bottom: 10px;
    }