@import url(http://fonts.googleapis.com/css?family=Dancing+Script|Open+Sans+Condensed:700);

body {
    height: 100%;
}

h1, h2, h3 {
    margin-top: 10px;
    margin-bottom: 20px;
}

h1 {
    color: #9acb54;
    font-family: 'Open Sans Condensed', cursive;
    line-height: 30px;
    font-size: 22pt;
    text-transform: uppercase;
}

h2 {
    color: #555555;
    font-family: 'Dancing Script', cursive;
    font-size: 18pt;
    font-weight: bold;
    line-height: 24px;
    margin-bottom: .5em;
}

h3 {
    font-family: 'Dancing Script', cursive;
    line-height: 22px;
    font-size: 14pt;
    color: #555555;
    margin-bottom: .5em;
}

h4 {
    font-family: Century Gothic, Helvetica, sans-serif;
    line-height: 22px;
    font-size: 12pt;
    color: #555555;
    margin-bottom: .5em;
}

#main p a {
    color: #6f933d;
    font-weight: bold;
    text-decoration: none;
    border-bottom: dotted 1px #6f933d;
}

    #main p a:hover {
        color: #6f933d;
        font-weight: bold;
        text-decoration: none;
        border-bottom: solid 1px #6f933d;
    }

    #main p a:visited {
        color: #6f933d;
        font-weight: bold;
        text-decoration: none;
        border-bottom: dotted 1px #6f933d;
    }

    #main p a:focus {
        color: #6f933d;
        font-weight: bold;
        text-decoration: none;
        border-bottom: dotted 1px #6f933d;
    }

#social-media .fade {
    opacity: 0.8;
    -moz-opacity: 0.8;
    filter: alpha(opacity=80);
}

footer p small {
    font-size: 8pt;
}

/* Hide only visually, but have it available for screenreaders: h5bp.com/v */
.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

    /* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: h5bp.com/p */
    .visuallyhidden.focusable:active, .visuallyhidden.focusable:focus {
        clip: auto;
        height: auto;
        margin: 0;
        overflow: visible;
        position: static;
        width: auto;
    }

.p1-top {
    padding-top: 10px;
}

.p2-top {
    padding-top: 20px;
}

.p1-left {
    padding-left: 10px;
}

.p2-left {
    padding-left: 20px;
}

.p1-right {
    padding-right: 10px;
}

.p2-right {
    padding-right: 20px;
}

.p1-bottom {
    padding-bottom: 10px;
}

.p2-bottom {
    padding-bottom: 20px;
}

.m1-top {
    margin-top: 10px;
}

.m2-top {
    margin-top: 20px;
}

.m1-left {
    margin-left: 10px;
}

.m2-left {
    margin-left: 20px;
}

.m1-right {
    margin-right: 10px;
}

.m2-right {
    margin-right: 20px;
}

.m1-bottom {
    margin-bottom: 10px;
}

.m2-bottom {
    margin-bottom: 20px;
}

.center {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.border-top-thin {
    border-top: 1px solid #ccc;
}

/* Custom Bootstrap styling*/

.navbar-default {
    background-color: transparent;
    border-color: transparent;
}

.navbar > .container .navbar-brand, .navbar > .container-fluid .navbar-brand {
    margin-left: -15px;
}

.navbar-default .navbar-brand {
    color: rgb(119, 119, 119);
}

.navbar-brand {
    float: left;
    height: 100px;
    padding: 0;
}

.nav {
    margin-bottom: 0px;
    list-style: none outside none;
    padding-left: 75px;
}

.navbar-nav {
    float: left;
    margin-top: 25px;
}

.dropdown-menu > .active > a, .dropdown-menu > .active > a:hover, .dropdown-menu > .active > a:focus {
    color: #fff;
    text-decoration: none;
    background-color: #9acb54;
    outline: 0;
}

/* Custom button
-------------------------------------------------- */

/* Override base .btn styles */
/* Apply text and background changes to three key states: default, hover, and active (click). */
.btn-ttc,
.btn-ttc:hover,
.btn-ttc:active {
    color: white;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
    background-color: #6f933d;
}

/* Apply the custom-colored gradients */
/* Note: you'll need to include all the appropriate gradients for various browsers and standards. */
.btn-ttc {
    background-repeat: repeat-x;
    background-image: linear-gradient(top, #6f933d 0%, #9acb54 100%);
}

    /* Set the hover state */
    /* An easy hover state is just to move the gradient up a small amount. Add other embellishments as you see fit. */
    .btn-ttc:hover {
        background-position: 0 -15px;
    }

.form-horizontal .form-group {
    margin-right: 0;
    margin-left: 0;
}

/* Custom Fotorama styling */

.fotorama__wrap {
    margin-left: auto;
    margin-right: auto;
}

.fotorama__thumb-border {
    border-color: #9acb54;
}