@font-face {
  font-family: 'Playlist';
  src: url('../img/fonts/playlist-script.woff2') format('woff2'),
       url('../img/fonts/playlist-script.woff') format('woff'),
       url('../img/fonts/playlist-script.ttf') format('truetype');
}


.playlistfont {
    font-family: 'Playlist', 'Lato', sans-serif !important;
}

/*! HTML5 Boilerplate v4.3.0 | MIT License | http://h5bp.com/ */

/*
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */

/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */

html,
button,
input,
select,
textarea {
    color: #222;
}

html {
    font-size: 1em;
    line-height: 1.4;
}

/*
 * Remove text-shadow in selection highlight: h5bp.com/i
 * These selection rule sets have to be separate.
 * Customize the background color to match your design.
 */

::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}

::selection {
    background: #b3d4fc;
    text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

/*
 * Remove the gap between images, videos, audio and canvas and the bottom of
 * their containers: h5bp.com/i/440
 */

audio,
canvas,
img,
video {
    vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
    resize: vertical;
}

/* ==========================================================================
   Browse Happy prompt
   ========================================================================== */

.browsehappy {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */

body {
    background:#d1e9eb;
}
body:after
{
    content: url('../img/social-header-hover.png'), url('../img/social-footer-hover.png');
    display: none;
}
h1, h2, h3, h4, h5, h6, input[type="submit"], legend {
    font-family: 'Julius Sans One', sans-serif;
	font-weight:100;
}
.lowercase-htwo h2,
h2.lowercase-htwo {
    font-family: 'Lato';
}
p, a, li, label, input, textarea, cite {
    font-size: 16.5px;
    font-family: "Lato", sans-serif;
	font-weight:100;
}
p a,
p a:hover 
{
    color: inherit;
}
p strong a {
    font-weight: bold;
}
a.cta {
    font-size: 18px;
    display: inline-block;
    padding: 6px 8px;
    color: #015c5e;
    border: 2px solid #015c5e;
    text-transform: uppercase;
    text-decoration: none;
    transition: background 0.2s;
    -webkit-transition: background 0.2s; /* For Safari 3.1 to 6.0 */
}
    a.cta:hover {
        background: #015c5e;
        color: #FFF;
    }
blockquote {
    background: #1e89af;
    color: #FFF;
    margin: 2em 0;
    padding: 1em 2em 1em 8em;
    border-radius: 3em 0.5em;
    background-image: url('../img/Quote.png') 20px 20px no-repeat;
}
select, option {
    font-size: 16px;
    font-weight:100;
}
img 
{
    max-width: 100%;
    height: auto;
}
iframe {
    max-width: 100%;
}
@media (max-width: 980px) {
    .hide-on-tablet 
    {
        display: none;
    } 
}
@media (max-width: 768px) 
{
    blockquote {
        padding: 2.2em 1em 1em;
        border-radius: 1em 0.2em;
        background-position: 1em 1em;
        background-size: 2em;
    }
    .hide-on-mobile 
    {
        display: none;
    }
    p, a, li, label, input, textarea, cite, select, option {
        font-size: 18px;
    }
}

/* Fun link image zoom */
@media (min-width: 769px) {
    .zoom-image-wrap { overflow: hidden; }
    .zoom-image-wrap img { transition: all .2s ease-in-out; }
    .zoom-image-wrap:hover img {
        -ms-transform: scale(1.05);
        -webkit-transform: scale(1.05);
        transform: scale(1.05);
    }
}


/* Filter forms */
.filter fieldset {
    margin: 1em;
}
.filter fieldset {
    margin: 1em 0;
}
    .filter label,
    .filter select {
        display: block;
        width: 100%;
        margin: 0.1em 0;
    }
    .filter .checkbox input,
    .filter .checkbox label {
        display: inline;
    }
    .filter .checkbox label {
        margin-left: 0.5em;
    }
    .filter input[type=search] {
        width: 90%;
        margin: 0;
        padding: 4px;
    }
    .filter input[type=submit] {
        background: #333366;
        transition: background 0.1s;
        -webkit-transition: background 0.1s; /* For Safari 3.1 to 6.0 */
    }
        .filter input[type=submit]:hover {
            background: #5d6cc7;
        }
@media (max-width: 768px) {
    .filter label,
    .filter input[type=range],
    .filter select {
        width: auto;
    }
}

a.button {
    font-family: Lato, sans-serif;
    background: #228a8b;
    padding: 0.5em;
    color: #FFF;
    border: none;
    text-decoration: none;
    border-radius: 3px;
    font-weight: bold;
}

/* Masks */
.mask {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0; left: 0;
}
.mask.white {
    background: url('../img/white-mask.png');
}

/* Wrap */

.wrap {
	width: 980px;
	margin: 0 auto;
}
.wrap .center-text {
    padding: 1em 15%;
}
@media (max-width: 980px) {
	.wrap {
		width: 768px;
	}
}
@media (max-width: 768px) {
	.wrap {
		width: 100%;
		max-width: 480px;
	}
    .wrap.title.clearfix {
        width: 94%;
    }
    .wrap .center-text {
        padding: 1em;
    }
}

/* Pagination */
.pagination {
    color: #222;
    text-align: center;
}
.pagination span {
    color: #999;
}
.pagination span.current a {
    color: #222;
    width: 1em;
    margin: 0 0.2em;
    padding: 0;
    text-decoration: underline;
}
.pagination a {
    color: #222;
    width: 1em;
    margin: 0 0.2em;
    text-decoration: none;
}
.pagination a:hover {
    color: #222;
    text-decoration: underline;
}
.articles .pagination {
    padding: 1em 0;
    border-top: 1px solid #CCC;
    border-bottom: 1px solid #CCC;
    margin: 2em auto 1em;
}


.photocredit {
    position: absolute;
    bottom: 0;
    right: 0;
    padding: 12px;
}
.photocredit p,
.photocredit a,
section.your-event-section .photocredit p,
section.your-event-section .photocredit a {
    font-size: 11px;
    opacity: 0.8;
    color: #FFF;
    margin: 0;
    text-shadow: 0px 0px 3px #000;
}


/* Header */
header {
    background: #015c5e;
    position: relative;
    box-shadow: 0 1px 3px #333;
    z-index: 10;
}
    header .wrap {
        margin: 0.5em auto;
    }
        header .wrap.title 
        {
            height: 32px;
            margin: 15px auto;
        }
            #header-logo 
            {
                height: 32px;
                width: 280px;
                left: 50%;
                margin-left: -140px;
                position: absolute;
            }
    header a,
    header nav li {
        color: #FFF;
        text-decoration: none;
        font-family: 'Julius Sans One', sans-serif;
    }
    header a:hover { text-decoration: underline; }
    header nav.full.ipad {
        position: absolute;
        font-size: 14px;
        height: 1em;
        margin: 8px 0;
        width: 980px;
    }
    header nav.full.ipad ul li,
    header nav.full.ipad ul li a {
        font-size: 14px;
    }
    nav.full.ipad ul, header nav.full.ipad ul > li {
        list-style: none;
        list-style-type: none;
        margin: 0; padding: 0;
        position: relative;
    }
    nav.full.ipad ul {
        width: 490px;
        margin: 0 0 0 1em;
    }
    nav.full.ipad ul.right {
        float: right;
        margin: 0 1em 0 0;
    }
        nav.full.ipad ul.left > li {
            float: left;
            margin: 0 1.6em 0 0;
        }
        nav.full.ipad ul.right > li {
            float: right;
            margin: 0 0 0 1.7em;
        }
            nav.full.ipad ul > li > ul {
                position: absolute;
                top: 100%;
                left: -0.5em;
                margin: 0;
                padding: 20% 0 0 0;
                width: 150px;
                display: none;
                z-index: 10;
            }
                nav.full.ipad ul > li:hover > ul {
                    display: block;
                }
                nav.full.ipad ul > li > ul > li {
                    font-size: 12px;
                    background: #003333;
                    padding-bottom: 1px;
                    box-shadow: 0 0 1px #003333;
                    text-transform: none;
                }
                nav.full.ipad ul > li > ul > li:last-child {
                    padding-bottom: 0;
                }
                    nav.full.ipad ul > li > ul > li a {
                        font-size: 12px;
                        background: #107375;
                        display: block;
                        padding: 0.7em 1em 0.6em;
                        -webkit-transition: background 0.15s; /* For Safari 3.1 to 6.0 */
                        transition: background 0.15s;
                    }
                    nav.full.ipad ul > li > ul > li a:hover {
                        background: #006666;
                    }
                    nav.full.ipad ul > li > ul > li a:hover {
                        text-decoration: none;
                    }

    #show-mob-nav {
        display: none;
    }
    nav#mobile-nav {
        display: none;
        background: #198a8c;
        margin: 0; padding: 1px 0;
        text-align: center;
        z-index: 10;
    }
        nav#mobile-nav ul {
            position: absolute; left: -20000px;
            padding: 0;
            margin: 0;
        }
        nav#mobile-nav ul.open { position: static; }
            nav#mobile-nav a { margin: 0 5px; }
            nav#mobile-nav a.active { background: #107375; }
    div.subheader {
        background: #015c5e;
        border-top: solid 1px #107375;
        width: 100%;
        z-index: 10;
    }
    div.subheader.fixed {
        position: fixed;
        top: 0;
    }
        div.subheader.sharebar {
            padding: 0.2em;
        }
        div.subheader p.social {
            float: left;
            margin: 4px 0 4px 1em;
            /*width: 198px;*/
        }
            div.subheader p.social a {
                float: left;
                margin: 0 3px 0 0;
                height: 30px; width: 30px;
                background: url('../img/social-header.png') top left no-repeat;
                transition: background .25s ease-in-out;
                -moz-transition: background .25s ease-in-out;
                -webkit-transition: background .25s ease-in-out;
            }
                div.subheader p.social a:hover {
                    background: url('../img/social-header-hover.png') top left no-repeat;
                }
                div.subheader p.social a.facebook { background-position: 0 0; }
                div.subheader p.social a.spotify { background-position: 0 -30px; }
                div.subheader p.social a.twitter { background-position: 0 -60px; }
                div.subheader p.social a.youtube { background-position: 0 -90px; }
                div.subheader p.social a.instagram { background-position: 0 -120px; }
                div.subheader p.social a.pinterest { background-position: 0 -150px; }
        div.subheader div.fb-like.fb_iframe_widget {
            float: left;
            display: inline;
            margin: 8px;
        }
        div.subheader .moblive { display: none; }
        div.subheader a.bandcamp,
        div.subheader a.next-show {
            float: right;
            padding: 0.5em 0.8em;
            max-width: 75%;
            -webkit-transition: background 0.2s; /* For Safari 3.1 to 6.0 */
            transition: background 0.2s;
            text-transform: uppercase;
        }
            div.subheader a.bandcamp:hover, div.subheader a.next-show:hover { text-decoration: none; }
            div.subheader a.next-show span { font-size: 0.75em; }
            div.subheader a.next-show.mobile { display: none; }
        div.subheader a.bandcamp {
            background: #107375;
            font-size: 0.75em;
            font-size: 12px;
            padding: 9px 0.8em;
            margin: 0 4px 0 0;
        }
            div.subheader a.bandcamp:hover { background:#2f797b; }
            div.subheader a.bandcamp span { padding: 11px 0; }
            div.subheader a.bandcamp img { margin-left: 1em; }
        div.subheader a.next-show { background: #1e89af; margin: 0 1em 0 0; }
            div.subheader a.next-show:hover { background: #1c7c9e; }

        div.subheader .section-subnav {
            margin: 0 auto;
            background: #198a8c;
        }
            div.subheader .section-subnav nav {
                margin: 0 auto;
            }
                div.subheader .section-subnav nav a.select {
                    display: none;
                    text-align: center;
                    padding: 1em;
                }
                    div.subheader .section-subnav nav ul {
                        list-style-type: none;
                        list-style: none;
                        margin: 0 1em;
                        padding: 0;
                        float: left;
                    }
                    div.subheader .section-subnav nav li {
                        float: left;
                        padding: 0.5em 1em 0.5em 0;
                    }
                    div.subheader .section-subnav nav li a {
                        font-weight: bold;
                        vertical-align: middle;
                        padding: 0.5em 1em;
                        margin-left: 0.1em;
                        border-radius: 1em;
                        font-size: 0.8em;
                        -webkit-transition: background 0.15s; /* For Safari 3.1 to 6.0 */
                        transition: background 0.15s;
                        display: block;
                    }
                    div.subheader .section-subnav nav li a.active {
                        background: #015c5e;
                    }
                    div.subheader .section-subnav nav li a:hover {
                        background: #006666;
                        text-decoration: none;
                    }
                        div.subheader .section-subnav nav li a.active.parent {
                            background: none;
                        }
                div.subheader .section-subnav nav div.dropdown-select {
                    float: left;
                }

    div.subheader .section-subnav nav .dropdown-select a.pick {
        padding: 14px;
    }
        div.subheader .section-subnav nav .dropdown-select.show ul {
            float: none;
            padding: 3px 0;
        }
            div.subheader .section-subnav nav .dropdown-select.show ul li {
                float: none;
                display: block;
                padding: 0;
                margin: 0
            }
                div.subheader .section-subnav nav .dropdown-select.show ul li a {
                    border-radius: 0;
                    margin: 0;
                }



@media (max-width: 980px) {
    nav.full.ipad {
        display: none;
    }
    #show-mob-nav {
        display: block;
    }
}
@media (max-width: 980px) and (min-width: 769px) {
    div.subheader a.next-show span.ipad { display: none; }
    nav#mobile-nav { display: block; }
    nav#mobile-nav ul { position: static; text-align: center; }
    nav#mobile-nav .select { display: none; }
    nav#mobile-nav ul li {
        display: inline-block;
        zoom: 1;
        *display: inline;
    }
        nav#mobile-nav ul li.sub {
            display: none;
        }
    #siteheader .title {
        position: relative;
    }
        #show-mob-nav {
            position: absolute;
            top: 0;
            right: 0;
            margin: 0 1em;
        }
}
@media (max-width: 768px) {
    body {
        padding-top: 62px;
    }
    #siteheader {
        box-shadow: none;
    }
    #siteheader .mob-headerfix {
        position: fixed; top: 0;
        background: #015c5e;
        z-index: 20;
        width: 100%;
        border-bottom: solid 1px #107375;
    }
    #header-logo {
        max-width: 88%;
        height: auto;
        margin: 8px 0 8px;
        float: left;
        position: static;
        margin: 0;
    }
    #header-logo img 
    {
        height: auto;
        max-width: 88%;
    }
    div.subheader {
        border-top: 0;
    }
        div.subheader a.next-show.desktop { display: none; }
        div.subheader.sharebar {
            padding: 0.2em;
        }
        div.subheader p.social {
            margin: 4px;
            /*width: 198px;*/
        }
    div.subheader .section-subnav nav p,
    div.subheader .section-subnav nav ul {
        display: none;
    }

    div.subheader .wrap {
        margin: 3px auto;
    }
    #show-mob-nav {
        margin: 0;
    }
    div.subheader .fb-like,
    div.subheader .facebook,
    div.subheader .twitter,
    div.subheader div.fb-like.fb_iframe_widget {
        display: none;
    }
    div.subheader .moblive {
        display: inline-block;
        padding: 4px 0.5em;
        height: 26px;
        margin: 2px;
        background: #1e89af;
        border-radius: 0.3em;
    }
    div.subheader a.bandcamp {
        padding: 7px 0.5em;
        margin: 2px 10px 2px 2px;
        border-radius: 0.5em;
        overflow: hidden;
        display: block;
    }
        div.subheader a.bandcamp span.desktop {
            display: none;
        }
        div.subheader a.bandcamp img { margin-left: 0; }
}

/* Mobile popup navigation */
#show-mob-nav {
    float: right;
    height: 31px;
    width: 31px;
    background: url('../img/dropdown-menu.png');
}
body.no-scroll 
{
    overflow: hidden;
}
#mobile-nav-popup {
    display: none;
    position: fixed; top: 0;
    background: #107375;
    width: 90%;
    height: 100%;
    padding: 0 5%;
    overflow: hidden;
    z-index: 50;
}
    #mobile-nav-popup ul,
    #mobile-nav-popup li {
        padding: 0;
        margin: 0;
        position: relative;
    }
    #mobile-nav-popup ul 
    {
        overflow-y: scroll; /* has to be scroll, not auto */
        -webkit-overflow-scrolling: touch;
        height: 80%;
    }
    #mobile-nav-popup ul > li {
        border-bottom: 1px solid #198a8c;
        padding: 1em 3em;
        color: #FFF;
    }
        #mobile-nav-popup ul > li:last-child {
            border-bottom: 0;
        }
    #mobile-nav-popup ul > li > ul {
        display: none;
        padding: 0 0 0.5em 1em;
    }
    #mobile-nav-popup a {
        display: block;
        color: #FFF;
        text-decoration: none;
    }
    #mobile-nav-popup a:active,
    #mobile-nav-popup li:hover,
    #mobile-nav-popup li.open {
        background: #003133;
    }
    #mobile-nav-popup a.expand {
        background: transparent;
        opacity: 0.5;
        position: absolute;
        right: 0; top: 0;
        padding: 1em;
        text-align: right;
        max-width: 80px;
    }
    #mobile-nav-popup a.close {
        padding: 1em 15px 0 0;
        opacity: 0.6;
        text-align: right;
    }
        #mobile-nav-popup a.close:hover,
        #mobile-nav-popup a.close:active {
            opacity: 1;
        }


/* Quick contact */
.quickcontact {
}
    .quickcontact section {
        margin: 1em auto;
        background: #1e89af;
    }
#quickcontactform {
    color: #FFF;
}
    #quickcontactform .contour.quickcontactform {
        padding: 1em 1.5em;
    }
    #quickcontactform h4 {
        font-size: 1.3em;
        margin: 0.2em 0 1em;
    }
#quickcontactform .contourFieldSet {
    margin-bottom: 1em;
}
#quickcontactform .col-md-6:first-child {
    width: 25%;
    float: left;
    margin-right: 5%;
}
#quickcontactform .col-md-6:last-child {
    width: 70%;
    float: left;
}
    #quickcontactform input[type=text],
    #quickcontactform textarea {
        width: 90%;
        padding: 1%;
    }
    #quickcontactform textarea {
        min-height: 7.2em;
    }

@media (max-width: 768px) {
    #quickcontactform .col-md-6:first-child,
    #quickcontactform .col-md-6:last-child {
        width: 100%;
        float: none;
        margin: 0;
    }
}


/* Footer */
footer {
    background: #2f797b;
    padding: 1.5em 2em;
    color: #FFF;
}
    footer .footer-block {
        float: left;
    }
        footer .footer-block.links {
            width: 24%;
            padding: 1em 5% 0 0;
        }
        footer .footer-block.reviews {
            width: 34.5%;
            padding: 1em 5% 0 0;
        }
        footer .footer-block.credits {
            width: 31.5%;
            text-align: right;
            padding: 0;
        }
            footer h3 {
                margin: 0.2em 0;
            }
            footer a {
                color: #FFF;
                text-decoration: none;
            }
                footer a:hover {
                    text-decoration: underline;
                }
            footer ul {
                margin: 0 0 1em;
                padding: 0;
            }
                footer ul li {
                    list-style: none;
                    list-style-type: none;
                    padding: 0;
                }
                footer p.badges {
                    margin-top: 0;
                }
                    footer p.badges a {
                        margin: 0 1em 0 0;
                        display: inline;
                        float: left;
                    }
            footer p.social a {
                float: right;
                margin: 0 2px 0 0;
                height: 40px; width: 40px;
                background: url('../img/social-footer.png') top left no-repeat;
                transition: background .2s ease-in-out;
                -moz-transition: background .2s ease-in-out;
                -webkit-transition: background .2s ease-in-out;
            }
                footer p.social a:hover {
                    background: url('../img/social-footer-hover.png') top left no-repeat;
                }
                footer p.social a.facebook { background-position: 0 0; }
                footer p.social a.spotify { background-position: 0 -40px; }
                footer p.social a.twitter { background-position: 0 -80px; }
                footer p.social a.youtube { background-position: 0 -120px; }
                footer p.social a.instagram { background-position: 0 -160px; }
                footer p.social a.pinterest { background-position: 0 -200px; }
            footer .contactdetails a {
                font-size: 1.2em;
            }
            footer .credits > div p,
            footer .credits > div p a {
                font-size: 12px;
            }
            footer .credits p.etch a {
                float: right;
                width: 93px;
                height: 47px;
                background: url('../img/etch.png') top right no-repeat;
                display: block;
            }

@media (max-width: 980px) and (min-width: 769px) {
    footer p.social a,
    footer p.social a:hover {
        height: 50px;
        width: 50px;
        background-size: 100%;
    }
        footer p.social a.facebook { background-position: 0 0; }
        footer p.social a.twitter { background-position: 0 -51px; }
        footer p.social a.youtube { background-position: 0 -100px; }
        footer p.social a.rss { background-position: 0 -152px; }
        footer p.social a.spotify { background-position: 0 -200px; }
}
@media (max-width: 768px) {
    footer {
        padding-bottom: 44px;
    }
    footer .footer-block.links,
    footer .footer-block.reviews {
        display: none;
    }
    footer .footer-block.credits {
        float: none;
        width: 100%;
        text-align: left;
    }
        footer p.social a,
        footer .credits p.etch a {
            float: left;
        }
}

/* Slideshow */
.dftc_slideshow {
    position: relative;
    overflow: hidden;
}
    .dftc_slideshow img.shaper {
        height: auto; width: 100%;
    }
    .dftc_slideshow img.slide {
        position: absolute; top: 0;
        width: 100%;
        height: auto;
        display: none;
        opacity: 0;
    }
        .dftc_slideshow img.show {
            display: block;
        }
        .dftc_slideshow .pips {
            position: absolute;
            bottom: 0;
            height: 60px; width: 100%;
            opacity: 0;
            -webkit-transition: opacity 0.2s; /* For Safari 3.1 to 6.0 */
            transition: opacity 0.2s;
        }
.letterbox .pips {
    display: none;
}
            .dftc_slideshow:hover .pips {
                opacity: 1;
            }
            .dftc_slideshow .pips div.pip-wrap {
                text-align: center;
                padding: 20px 0;
                position: relative;
            }
                .dftc_slideshow .pips div.pip-wrap span {
                    padding: 5px 10px;
                    background: #333;
                    border-radius: 20px;
                    opacity: 0.8;
                }
                .dftc_slideshow .pips a {
                    margin: 0 3px;
                    position: relative;
                    width: 10px; height: 10px;
                    background: url('../img/slider-pip.png');
                    -webkit-transition: background 0.2s; /* For Safari 3.1 to 6.0 */
                    transition: background 0.2s;
                    display: inline-block;
                    zoom: 1;
                    *display: inline;
                }
                    .dftc_slideshow .pips a.active,
                    .dftc_slideshow .pips a:hover {
                        background: url('../img/slider-pip-hover.png');
                    }

/* Lightbox */
#dftc_lightbox {
    position: fixed;
    top: 0;
    width: 100%;
    display: none;
    opacity: 0;
    z-index: 120;
}
    #dftc_lightbox .mask {
        background: #000;
        opacity: 0.9;
        width: 100%;
    }
    #dftc_lightbox a.ctrls {
        position: absolute;
        height: 60px; width: 60px;
        background: url("../img/lightbox/arrows.png") top left no-repeat;
        background-position: 0 0;
        top: 40%;
        opacity: 0.6;
    }
    #dftc_lightbox  a.ctrls:hover {
        opacity: 1;
    }
    #dftc_lightbox #left {
        left: 5%;
        background-position: 0 -60px;
    }
    #dftc_lightbox #right {
        right: 5%;
    }
    #dftc_lightbox #close {
        background-position: 0 -120px;
        right: 5%; top: 3%;

    }
    #dftc_lightbox a.disable {
        display: none;
        position: absolute; top: 0; right: 0;
    }
    #dftc_lightbox ul, #dftc_lightbox ul li {
        list-style: none;
        list-style-type: none;
        margin: 0; padding: 0;
    }
        #dftc_lightbox ul {
            position: absolute;
            width: 76%;
            left: 10%;
            top: 5%;
            padding: 2%;
            height: 86%;
        }
        #dftc_lightbox ul > li {
            width: 100%;
            height: 100%;
            margin: 0 auto;
            color: #FFF;
            max-width: 960px;
            text-align: center;
            display: none;
        }
        #dftc_lightbox ul > li.active {
            display: block;
        }
            #dftc_lightbox ul > li iframe,
            #dftc_lightbox ul > li img {
                max-width: 100%;
                margin: 0 auto;
            }
            #dftc_lightbox ul > li img {
                max-height: 90%;
            }

/* Forms */
input[type=submit] {
    padding: 0.5em;
    width: auto;
    background: #015c5e;
    border: 0;
    color: #FFF;
    font-weight: bold;
}
    input[type=submit]:hover {
        background: #198a8c;
    }
.other {
    display: none;
}
form div span.field-validation-error {
    font-size: 10px;
    color: red;
}

/* DFTC Panels */
ul.sliding_panels {
    list-style: none;
    list-style-type: none;
    padding: 0; margin: 0 5%;
}
    ul.sliding_panels li.panel {
        width: 30%;
        margin: 1em 1.3%;
        display: inline-block;
        zoom: 1;
        *display: inline;
        vertical-align: top;
        position: relative;
        overflow: hidden;
    }
        ul.sliding_panels li.panel a.title {
            background: #6666cc;
            opacity: 0.85;
        }
        ul.sliding_panels li.panel div.mask {
            top: 0;
            position: absolute;
            width: 100%; height: 120%;
            background: #6666cc;
            opacity: 0.85;
        }
        ul.sliding_panels.animate li.panel div.mask {
            top: 100%;
        }
        ul.sliding_panels li.panel a.title,
        ul.sliding_panels li.panel a.txt {
            position: absolute;
            padding: 3% 5%;
            color: #FFF;
            text-decoration: none;
            width: 90%;
        }
    .panel .review p.client {
        text-align: right;
    }
        .panel .review p.client span {
            display: block;
            padding-left: 20%;
        }
        ul.sliding_panels li.panel img {
            max-width: 100%;
            cursor: pointer;
            display: block;
            margin: 0 auto;
        }
        ul.sliding_panels li.panel blockquote {
            height: 100%;
            top: 0;
            position: absolute;
            color: #FFF;
            margin: 1em;
        }
        ul.sliding_panels li.panel a.txt {
            top: 100%;
            height: 100%;
        }
        ul.sliding_panels.static li.panel a.txt {
            top: 0;
        }
            ul.sliding_panels li.panel a.txt div {
                position: absolute;
                bottom: 2em;
                width: inherit;
            }
ul.sliding_panels.static div.txt,
ul.sliding_panels.static li.panel blockquote {
    position: absolute;
    top: 0;
    margin: 0;
    width: 80%;
    padding: 3% 10%;
    height: 94%;
    color: #FFF;
    font-size: 1.1em;
}
    ul.sliding_panels.static div.txt {
        font-size: 16px;
    }
    ul.sliding_panels.static div.txt h4 {
        font-weight: normal;
        text-transform: uppercase;
        margin: 1em 0;
    }
    ul.sliding_panels.static div.txt a {
        color:#FFF;
    }
ul.sliding_panels.static li.panel.swingorch img.tab {
    position: absolute;
    top: 0; left: 0;
}
ul.sliding_panels.static li.panel.swingorch .mask {
    background: url("../img/black-mask.png");
    opacity: 0;
    -webkit-transition: opacity 0.2s; /* For Safari 3.1 to 6.0 */
    transition: opacity 0.2s;
}
    ul.sliding_panels.static li.panel.swingorch:hover .mask {
        display: block;
        opacity: 0.3;
    }
ul.sliding_panels. .dftc-audio-player.panel-embed 
{
    overflow: scroll;
}
ul.sliding_panels.static li.popup-link 
{
    background: #1e8faf;
}
    ul.sliding_panels.static li.popup-link img
    {
        max-width: 100%;
    }
@media (max-width: 980px) and (min-width: 769px) 
{
    ul.sliding_panels li h3 
    {
        margin: 0.5em 0;
    }
}

/* Sections */
section {
    background: #FFF;
    padding-bottom: 1em;
}
    section.blank {
        padding: 1em 3em;
    }
        section.blank a {
            color: #222;
        }
    div.heading {
        padding: 0.8em 2em;
        background: #015c5e;
    }
    section div.heading {
        margin: 1em 0;
    }
        div.heading h1,
        div.heading h2,
        div.heading p,
        div.heading a {
            margin: 0;
            color: #FFF;
            text-decoration: none;
        }
    section.purple div.heading,
    div.heading.purple,
    section.purple ul.sliding_panels li.panel a.title,
    section.purple ul.sliding_panels li.panel div.mask {
        background: #606fc9;
    }
    section.orange div.heading,
    section.orange ul.sliding_panels li.panel a.title,
    section.orange ul.sliding_panels li.panel div.mask {
        background: #e0643f;
    }

    section.blue div.heading,
    section.blue ul.sliding_panels li.panel a.title,
    section.blue ul.sliding_panels li.panel .mask {
        background: #1e8faf;
    }
    section.red div.heading,
    section.red ul.sliding_panels li.panel a.title,
    section.red ul.sliding_panels li.panel .mask {
        background: #e44549;
    }
    section.yellow div.heading,
    section.yellow ul.sliding_panels li.panel a.title,
    section.yellow ul.sliding_panels li.panel .mask {
        background: #edb145;
    }

@media (min-width: 769px) {
    section.narrow {
        width: 70%;
        padding-left: 15%;
        padding-right: 15%;
    }
}
@media (max-width: 768px) 
{
    section div.heading {
        padding: 0.8em 5%;
    }
    ul.sliding_panels li.panel > a {
        font-weight: bold;
    }
    ul.sliding_panels li.panel {
        display: block;
        width: 100%;
        margin: 1em 0;
    }
    ul.sliding_panels li.panel img {
        width: 100%;
    }
}

/* Videos */
.videos {
        padding: 1em 3.5em;
        background: #FFF;
    }
        .videos a {
            opacity: 0.85;
            -webkit-transition: opacity 0.2s; /* For Safari 3.1 to 6.0 */
            transition: opacity 0.2s;
            float: left;
            width: 32%;
            margin-right: 2%;
        }
        .videos a:last-child {
            margin-right: 0;
        }
        .videos a:hover {
            opacity: 1;
        }
            .videos a img {
                width: 100%; height: auto;
            }

/* Image leader layout */
section.image-leader {
    position: relative;
}
    section.image-leader img {
        max-width: 100%;
    }
    section.image-leader div.textbox {
        position: absolute;
        padding: 1px 1em;
        color: #FFF;
        background: url('../img/purple-mask.png');
    }
    section.image-leader div.textbox a 
    {
        color: #FFF;
    }
        section.image-leader div.textbox.first {
            top: 5%;
            left: 5%;
            width: 40%;
        }
        section.image-leader div.textbox.second {
            bottom: 5%;
            right: 5%;
            width: 30%;
        }
@media (max-width: 980px) {
    section.image-leader div.textbox.first {
        position: static;
        width: auto;
        padding: 1em 2em;
        margin-bottom: 1em;
    }
    section.image-leader div.textbox.second {
        display: none;
    }
}

/* Letterbox layout */
.letterbox {
    padding-bottom: 0;
    position: relative;
}
    .letterbox h1 {
        color: #FFF;
        padding: 0.5em 5%;
        text-align: center;
        margin: 0;
    }
    .letterbox h1.red {
        background: url('../img/red-mask.png');
    }
    .letterbox h1.white {
        background: url('../img/white-mask.png');
        color: #000;
    }
    .letterbox h1.orange {
        background: url('../img/orange-mask.png');
    }
    .letterbox h1.purple {
        background: url('../img/purple-mask.png');
    }
    .letterbox h1.yellow {
        background: #edb145;
    }
    .letterbox .heading {
        margin: 0;
    }
    .letterbox img {
        max-width: 100%;
        height: auto;
    }
    .letterbox div.overlay-text {
        position: absolute;
        background: url('../img/black-mask.png');
        padding: 0.5em 10%;
        color: #FFF;
        width: 80%;
        text-align: center;
    }
    .letterbox div.overlay-text.red {
        background: url('../img/red-mask.png');
    }
    .letterbox div.overlay-text.white {
        background: url('../img/white-mask.png');
        color: #000;
    }
    .letterbox div.overlay-text.orange {
        background: url('../img/orange-mask.png');
    }
    .letterbox div.overlay-text.purple {
        background: url('../img/purple-mask.png');
    }
    .letterbox div.overlay-text.yellow {
        background: #edb145;
    }

        .letterbox div.overlay-text h1 {
            font-size: 1.5em;
            margin: 0.6em;
        }
        .letterbox div.overlay-text.top {
            top: 0;
        }
        .letterbox div.overlay-text.bottom {
            bottom: 0;
        }
        .letterbox div.overlay-text.inset {
            width: 35%;
            padding: 0.5em 1em;
            max-height: 75%;
            bottom: 5%;
            max-height: 75%;
        }
            .letterbox div.overlay-text.inset.l {
                left: 2em;
            }
            .letterbox div.overlay-text.inset.r {
                right: 2em;
            }
        
@media (max-width: 980px) {
    .letterbox div.overlay-text {
        width: 86%;
        padding: 0.5em 7%;
    }
}
@media (max-width: 768px) {
    .letterbox div.overlay-text,
    .letterbox div.overlay-text.inset {
        position: static;
        text-align: left;
        width: auto;
        padding: 0.5em 5%;
        max-height: none;
    }
        .letterbox h1,
        .letterbox div.overlay-text h1 {
            text-align: center;
            font-size: 24px;
        }
}

/* Hero layout */
h1.lineup-hero {
    font-size: 2.4vw;
    margin: 0;
    padding: 30px;
    text-align: center;
    color: #FFF;
}
@media (max-width: 768px) {
    h1.lineup-hero {
        font-size: 28px;
    }
}
.hero {
    position: relative;
    width: 100%;
    height: 90vh;
    background-size: cover;
    overflow: hidden;
}
    .hero div.bg {
        background-image: url('../img/hero-vid-bg.jpg');
        background-position-x: center;
        background-size: cover;
        z-index: -2;
        width: 100%;
        height: 100%;
        position: absolute;
    }
    .hero .header-content-wrapper {
        background: url('../img/black-mask-lite.png');
        height: 100%;
        width: 100%;
        position: absolute;
        top:0; left: 0;
    }
        .hero .header-content {
            /*height: 200px;*/
            width: 100%;
            color: #FFF;
        }
        .hero .header-content.vcenter {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
        }
            .hero .header-content h1,
            .hero .header-content p {
                text-align: center;
                padding: 0 2em;
            }
                .hero .header-content h1 {
                    font-size: 2.4vw;
                    margin: 0;
                    padding: 10px 2em;
                }
                .hero .header-content.vcenter h1 {
                    margin: 18px auto;
                    padding: 0 2em;
                }
                .hero.weddings hr {
                    width: 25%;
                    margin: 2em auto;
                    opacity: 0.9;
                }
                .hero .header-content p {
                    font-size: 1.2em;
                    max-width: 680px;
                    padding: 0 1em;
                    margin: 1em auto;
                    opacity: 0.9;
                }
                .hero .header-content a {
                    text-decoration: none;
                    display: inline-block; 
                    margin: 0 0.5em;
                    opacity: 0.8;
                    font-size: inherit;
                }
                    .hero .header-content a:hover {
                        opacity: 1;
                    }
                .hero .header-content span { margin: 0 0.5em; }

        .hero .playbutton {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
              -webkit-filter: drop-shadow(5px 5px 5px #222);
              filter: drop-shadow(5px 5px 5px #222);
        }
            .hero .playbutton a img {
                width: 25vw;
                max-width: 100px;
                height: auto;
            }
        .hero .image-wrapper {
           position: absolute;
           top: 0;
           left: 0;
           width: 100vw;
           height: 100vh;
           z-index: -1;
           pointer-events: none;
           overflow: hidden;
        }
        .hero .image-wrapper.autoplay {
           opacity: 0;
           transition: opacity 1s;
       }
        .hero .image-wrapper.autoplay.show { opacity: 1; }
            .hero .image-wrapper img.heroimg {
                width: 100%;
                height: auto;
            }
            .hero .image-wrapper iframe {
               width: 100vw;
               height: 56.25vw; /* Given a 16:9 aspect ratio, 9/16*100 = 56.25 */
               min-height: 100vh;
               min-width: 177.77vh; /* Given a 16:9 aspect ratio, 16/9*100 = 177.77 */
               position: absolute;
               top: 50%;
               left: 50%;
               transform: translate(-50%, -50%);
            }

/* Text-columns */
.text-columns {
    padding: 1em 3em;
}
section.blank .text-columns {
    padding: 1em 0;
}
    .text-columns a {
        color: #222;
    }
    .text-columns .l,
    .text-columns .r {
        width: 46%;
    }
    .text-columns .l {
        float: left;
        padding-right: 4%;
    }
    .text-columns .r {
        float: right;
        padding-left: 4%;
    }

@media (max-width: 768px) {
    .text-columns {
        padding: 1em 5%;
    }
    .text-columns .l,
    .text-columns .r {
        float: none;
        padding: 0;
        width: auto;
    }
}

/* Letterbox slideshow layout */
section.letterbox.dftc_slideshow {
    padding: 0;
    position: relative;
}
    section.letterbox.dftc_slideshow {
        margin: 0;
    }


/* sidebar-layout layout */
.sidebar-layout {
    background: #cc3333;
    padding-bottom: 0;
    position: relative;
}
    .sidebar-layout.orange { background: #e0643f; }
    .sidebar-layout.purple { background: #606fc9; }
    .sidebar-layout.blue { background: #1e8faf; }
    .sidebar-layout.red { background: #cc3333; }
    .sidebar-layout.border { background: #FFF; }
    .sidebar-layout.orange.border .sidebar .content { border-left: solid 1px #f69d82; }
    .sidebar-layout.purple.border .sidebar .content { border-left: solid 1px #ccccff; }
    .sidebar-layout.blue.border .sidebar .content { border-left: solid 1px #88e3fd; }
    .sidebar-layout.red.border .sidebar .content { border-left: solid 1px #fc9292; }
    .sidebar-layout.thin .main  {
        width: 70%;
    }
    .sidebar-layout.thin .sidebar {
        width: 30%;
    }
    .sidebar-layout.thick .main {
        width: 60%;
    }
    .sidebar-layout.thick .sidebar {
        width: 40%;
    }
    .sidebar-layout .sidebar,
    .sidebar-layout .sidebar a {
        color: #FFF;
    }
    .sidebar-layout .main {
        background: #FFF;
    }
        .sidebar-layout .sidebar .content,
        .sidebar-layout .main .content.padded {
            padding: 1.5em 2em;
        }
        .sidebar-layout.border .sidebar .content {
            padding: 0.5em 2em;
            margin: 1em 0;
        }
        .sidebar-layout.border .sidebar .content,
        .sidebar-layout.border .sidebar .content a {
            color: #222;
        }
    /* sidebar-layout RIGHT */
    .sidebar-layout.r .sidebar {
        position: absolute;
        right: 0; top: 0;
    }
    .sidebar-layout.r.thin .main {
        margin-right: 30%;
    }
    .sidebar-layout.r.thick .main {
        margin-right: 40%;
    }
    /* sidebar-layout LEFT */
    .sidebar-layout.l .sidebar {
        position: absolute;
        left: 0; top: 0;
    }
    .sidebar-layout.l.thin .main {
        margin-left: 30%;
    }
    .sidebar-layout.l.thick .main {
        margin-left: 40%;
    }

.sidebar-layout.padded .heading,
.sidebar-layout .padded .heading {
    width: 100%;
    position: relative;
    top: -1em;
    left: -2em;
}
.sidebar-layout.blue .heading {
    background: #38a6c5;
}

@media (max-width: 768px) {
    .sidebar-layout.r.thick .sidebar,
    .sidebar-layout.r.thick .main,
    .sidebar-layout.l.thick .sidebar,
    .sidebar-layout.l.thick .main,
    .sidebar-layout.r.thin .sidebar,
    .sidebar-layout.r.thin .main,
    .sidebar-layout.l.thin .sidebar,
    .sidebar-layout.l.thin .main {
        position: static;
        width: 100%;
        margin: 0;
        margin-right: 0;
        margin-left: 0;
    }
    .sidebar-layout.orange.border .main .content,
    .sidebar-layout.purple.border .main .content,
    .sidebar-layout.blue.border .main .content,
    .sidebar-layout.red.border .main .content { border-right: 0; }
    .sidebar-layout .main .content.padded {
            padding: 1.5em 5%;
    }
    .sidebar-layout .padded .heading {
        top: -1em;
        left: -1em;
    }
}

/* Tabs layout */
section.tab-layout ul.questions {
    list-style: none;
    list-style-type: none;
    float: left;
    width: 33%;
    margin: 0;
    padding: 0;
}
    section.tab-layout ul.questions li a {
        text-decoration: none;
        display: block;
        padding: 0.5em 1em 0.5em 0;
    }
    section.tab-layout ul.questions li.active a {
        background: url('../img/faq-tip.png') center right no-repeat;
    }
    section.tab-layout div.answers {
        float: left;
        width: 60%;
        padding: 0.5em 2.5%;
    }
    section.tab-layout div.answers .content {
        display: none;
    }
        section.tab-layout div.answers .content a {
            color: #222;
        }
    section.tab-layout div.answers .content.active {
        display: block;
    }
@media (max-width: 768px) {
    section.tab-layout ul.questions {
        display: none;
    }
    section.tab-layout div.display div.answers {
        float: none;
        width: auto;
        padding: 1em 5%;
    }
    section.tab-layout div.display div.answers .content {
        display: block;
        padding: 0.5em;
    }
    section.tab-layout div.display div.answers .q {
        display: block;
    }
}

/* 2021 Quotes */
.roundquote {
    display: block;
}
.roundquote .img {
    border-radius: 50%;
    overflow: hidden;
    float: left;
    display: inline-block;
    width: 30%;
    margin: 0 3% 0 0;
    padding: 0;
}
    .roundquote .img img {
        width: 100%;
        height: auto;
    }
.roundquote .content {
    float: left;
    display: inline-block;
    width: 67%;
}
    .roundquote .content.large p {
        font-size: 20px;
    }
@media (max-width: 768px) {
    .roundquote .img {
        display: block;
        float: none;
        width: 60%;
        margin: 1em auto;
    }
    .roundquote .content {
        display: block;
        float: none;
        width: 80%;
        margin: auto;
        padding: 1em;
    }
}

/* Landing page */
.landing-page {
    margin: 0;
    background-color: #000;
    background-image: url('../img/landing-page-bg.jpg');
    background-position: top center;
    background-attachment: fixed;
    background-repeat: repeat-y;
    text-align: center;
    position: relative;
    color: #FFF;
}
.landing-page .wrap {
    position: relative;
    padding: 2em 0;
}
    .landing-page .welcome h1 {
        background: url('../img/landing-page-logo.png') top center no-repeat;
        height: 210px; width: 300px;
        margin: 0 auto;
    }
    .landing-page .welcome p {
        font-size: 20px;
        text-shadow: 2px 2px 5px #000;
    }
    .landing-page .options > div {
        width: 45%;
        opacity: 0.8;
        -webkit-transition: opacity 0.2s; /* For Safari 3.1 to 6.0 */
        transition: opacity 0.2s;
    }
    .landing-page .options > div:hover {
        opacity: 1;
    }
    .landing-page .options .swing-and-soul {
        float: left;
        background: #015c5e;
    }
    .landing-page .options .swing-orchestra {
        float: right;
        background: #cc3333;
    }
        .landing-page .options a {
            color: #FFF;
            text-decoration: none;
        }
        .landing-page .options p a:hover {
            text-decoration: underline;
        }
        .landing-page .options .swing-and-soul h2 {
            font-size: 36px;
            margin: 15px auto;
            line-height: 58px;
        }
        .landing-page .options .swing-orchestra h2 {
            height: 58px;
            width: 294px;
            margin: 15px auto;
            background: url('../img/landing-swing-orch-h2.png') top center no-repeat;
        }
        .landing-page .options div.desc {
            min-height: 150px;
        }
            .landing-page .options p {
                padding: 5px 2.5em;
            }
        .landing-page .options img {
            max-width: 100%;
            height: auto;
        }

@media (max-width: 980px) {
    .landing-page .options > div {
        width: 49%;
        opacity: 1;
    }
    .landing-page .options .swing-and-soul h2 {
        font-size: 30px;
    }
}
@media (max-width: 768px) {
    .landing-page {
        top: -80px;
    }
    .landing-page .options .swing-and-soul h2
    {
        font-size: 24px;
    }
    .landing-page .options p a {
        font-weight: bold;
        text-decoration: underline;
    }
    .landing-page .options > div {
        width: 100%;
        float: none;
        display: block;
        margin-bottom: 1em;
        overflow: hidden;
    }
    .landing-page .options .content.closed {
        position: absolute;
        left: -100000px;
        top: -10000px;
    }
}

/* Homepage */
#homepage-title 
{
    position: absolute;
    top: -1000000px;
}
section.homepage_welcome {
	padding: 1em;
}
    section.homepage_welcome .dftc_slideshow {
        margin: 1em;
    }
    .homepage_welcome .videos {
        padding: 1em;
    }

.clientstrip {
    padding: 1em 3em;
}
.clientstrip.home {
    background: url('../img/white-mask.png');
}
    .clientstrip div {
        width: 10%;
        margin-right: 2.5%;
        display: inline-block;
        zoom: 1;
        *display: inline;
        vertical-align: middle;
    }
    .clientstrip div:last-child {
        margin-right: 0;
    }
.clients2021 {
    text-align: center;
}
    .clients2021 img {
        max-width: 90%;
        height: auto;
        margin: 0 auto 4em;
    }

section.clients_table div.table {
    padding: 0 3em 1em;
}
    section.clients_table div.table div.clearfix div {
        display: inline-block;
        zoom: 1;
        width: 15%;
        margin: 0 5% 5px 0;
        vertical-align: middle;
    }
    section.clients_table div.table div.clearfix div:last-child {
        margin-right: 0;
    }
        section.clients_table div.table div.clearfix div a {
            -webkit-transition: opacity 0.2s; /* For Safari 3.1 to 6.0 */
            transition: opacity 0.2s;
        }
        section.clients_table div.table div.clearfix div a:hover {
            opacity: 0.8;
        }
            section.clients_table div.table div.clearfix div img {
                width: 100%;
                height: auto;
            }

@media (max-width: 980px) {
    section.homepage_welcome #showcase img.main-img {
        max-width: 70%;
    }
}
@media (max-width: 768px) {
    section.homepage_welcome {
        padding: 1em 5%;
    }
    section.homepage_welcome .dftc_slideshow 
    {
        display:none;
    }

    section.homepage_welcome p.strapline {
        margin: 0.5em 1em;
    }
    section.homepage_welcome .videos {
        padding: 0 0 1em 0;
    }
    section.homepage_welcome .videos:last-child {
        padding-bottom: 0;
    }
    section.homepage_about {
        padding: 2em 5%;
    }
    .videos a {
        width: auto;
        text-align: center;
        margin-right: 0;
        margin: 0.5em auto;
        display: block;
        float: none;
    }
    section.homepage_about {
        padding: 2em 5%;
    }
    section.homepage_about article,
    section.homepage_about aside {
        width: 100%;
        margin: 0;
        border: 0;
    }
    section.homepage_about aside {
        padding-top: 1em;
    }
}




/* About page */
section.tab-layout.about-tabs {
    padding-bottom: 0;
}
    section.tab-layout.about-tabs div.display {
        position: relative;
        overflow: hidden;
    }
        section.tab-layout.about-tabs ul.questions {
            background: #cc3333;
        }
            section.tab-layout.about-tabs ul.questions li {
            }
            section.tab-layout.about-tabs ul.questions li.active,
            section.tab-layout.about-tabs ul.questions li:hover {
                background: #de5a5a;
            }
            section.tab-layout.about-tabs ul.questions li a {
                color: #FFF;
                padding: 1em 2em;
                font-family: 'Julius Sans One', sans-serif;
            }
        section.tab-layout.about-tabs div.answers {
            position: relative;
            width: 67%;
            padding: 0;
        }
            section.tab-layout.about-tabs div.answers div.content {
                padding: 0.5em 1.5em;
            }
@media (max-width: 768px) 
{
    section.tab-layout.about-tabs div.answers div.content {
        padding: 0.5em;
    }
}

/* Our Story */
.our-story-hero {
    height: 50vh;
    width: 100%;
    margin: 0;
    padding: 1px;
    background-position: center;
    background-size: cover;
}
    .our-story-hero .wrap { height: 100%; }
    .our-story-hero .title {
        width: 100%;
        height: 100%;
        position: relative;
    }
    .our-story-hero h1 {
        color: #FFF;
        text-shadow: 2px 2px #000;
        font-family: 'Playlist', 'Lato', sans-serif;
        position: absolute;
        bottom: 0;
        left: 50%;
        transform: translate(-50%, 0);
        padding: 30px 0;
        margin: 0;
        font-size: 70px;
    }
.our-story-sections #lineup-floating-nav {
    background-color: #198a8c;
}
.our-story-sections section {
    background-color: #d1e9eb;
    background-size: cover;
    background-repeat: no-repeat;
    padding: 1em 0;
    margin: 0;
}
    .our-story-sections section.split1 {
        background-image: linear-gradient(to bottom, #d1e9eb, #d1e9eb 50%, #e5f3f4 50%, #e5f3f4);
    }
    .our-story-sections section.split2 {
        background-image: linear-gradient(to bottom, #e5f3f4, #e5f3f4 50%, #d1e9eb 50%, #d1e9eb);
    }
    .our-story-sections section.light {
        background-color: #e5f3f4;
    }
    .our-story-sections .wrap .narrow { margin: 0 15%; }
    .our-story-sections .white { background: #FFF; padding: 30px; }
    .our-story-sections h2 { font-family: 'Lato'; }
    .our-story-sections h2.playlistfont {
        font-family: 'Playlist';
        font-size: 3vmax;
    }

.our-story-sections .quote.wrap .quote {
    padding: 15px;
}
.our-story-sections .quote .img {
    border-radius: 50%;
    overflow: hidden;
    float: left;
    display: inline-block;
    width: 30%;
    margin: 0 3% 0 0;
    padding: 0;
}
    .our-story-sections .quote .img img {
        width: 100%;
        height: auto;
    }
.our-story-sections .quote .content {
    float: left;
    display: inline-block;
    width: 67%;
}
    .our-story-sections .quote .q p {
        font-size: 18px;
    }
        .our-story-sections .quote p.name,
        .our-story-sections .quote .role p {
            margin: 0;
        }
        .our-story-sections .quote .role p {
            font-size: 14px;
        }

    .our-story-sections .quote.clients .img {
        margin: 1em 3% 1em 0;
    }
    .our-story-sections .quote.clients .q p {
        font-size: 22px;
    }
        .our-story-sections .quote p.name,
        .our-story-sections .quote .role p {
            margin: 0;
        }
        .our-story-sections .quote .role p {
            font-size: 16px;
        }

@media (max-width: 980px) {
    .our-story-hero h1 {
        font-size: 5.5vmax;
    }
}
@media (max-width: 768px) {
    .our-story-hero { height: 30vh; }
    .our-story-sections .wrap .narrow { margin: 0; }
    .our-story-sections .quote .img {
        display: block;
        float: none;
        width: 60%;
        margin: 1em auto;
    }
    .our-story-sections .quote.wrap {
        background: #d1e9eb;
        padding-bottom: 1em;
        text-align: center;
    }
    .our-story-sections .quote .content {
        display: block;
        float: none;
        width: 80%;
        margin: auto;
        padding: 1em;
    }
    .our-story-sections h2.playlistfont {
        font-size: 4vmax;
    }
}


/* Meet the band 2021 */
ul.meet-our-musicians,
ul.meet-our-musicians li.musician {
    list-style: none;
    list-style-type: none;
    list-style-image: none;
    margin: 0;
    padding: 0;
}
ul.meet-our-musicians li.musician {
    width: 25%;
    float: left;
    display: inline-block;
}
ul.meet-our-musicians li.musician.dark {
    filter: brightness(55%);
    transition: filter 0.1s;
}
    ul.meet-our-musicians li.musician .spot {
        position: relative;
        padding: 8px;
        margin: 8px;
        border-radius: 50%;
    }
        ul.meet-our-musicians li.musician .spot:hover {
            transition: background 0.2s;
            background: #FFF;

        }
        ul.meet-our-musicians li.musician .spot:hover a {
            filter: brightness(115%);
            transition: filter 0.1s;
        }
        ul.meet-our-musicians li.musician .spot a {
            position: relative;
            background-size: cover;
            display: block;
            width: 100%;
            border-radius: 50%;
            overflow: hidden;
        }
        ul.meet-our-musicians li.musician .spot svg {
            display: block;
        }
            ul.meet-our-musicians li.musician .spot svg .highlight {
                opacity: 0.3;
            }
            ul.meet-our-musicians li.musician .spot:hover svg .highlight {
                opacity: 0.6;
            }
/*        ul.meet-our-musicians li.musician .spot p {
            position: absolute;
            bottom: 30px;
            font-size: 3vw;
            text-align: center;
            width: 100%;
            color: #FFF;
            text-shadow: 2px 2px #000;
            margin: 0;
            padding: 0;
        }*/
        ul.meet-our-musicians li.musician .info {
            display: none;
        }
@media (max-width: 1280px) {
    ul.meet-our-musicians li.musician .spot p {
        font-size: 4vw;
    }
}
@media (max-width: 768px) {
    .our-story-hero h1 {
        font-size: 8vw;
    }
    ul.meet-our-musicians li.musician {
        width: 50%;
    }
    ul.meet-our-musicians li.musician .spot p {
        font-size: 10vw;
        bottom: 15px;
    }
        ul.meet-our-musicians li.musician .spot svg {
            opacity: 1;
        }
}
#popup-biog {
    position: fixed;
    top: 0; bottom: 0;
    left: 0; right: 0;
    z-index: 1000000;
    display: none;
}
    #popup-biog .box {
        width: 980px;
        max-width: 98%;
        margin: 10vh auto;
        max-height: 80vh;
        overflow: scroll;
        background: #255a5d;
        background: url('../img/green-mask.png');
        position: relative;
        border-radius: 3px;
        min-height: 100px;
        box-shadow: 3px 3px 5px #000;
    }
    #popup-biog .box .close {
        position: absolute;
        top: 20px;
        right: 20px;
        height: 40px;
        width: 40px;
        opacity: 0.8;
        background: url('../img/close.png');
        background-size: contain;
    }
        #popup-biog .box .close:hover {
            opacity: 1;
            transition: background, 0.1s;
        }

    #popup-biog .content {
        margin: 1em 100px 1em 1em;
        color: #FFF;
    }
        #popup-biog .card {
            width: 30%;
            display: inline-block;
            vertical-align: top;
            margin: 1em 5% 1em 1em;
            text-align: center;
        }
            #popup-biog .card h3 {
                font-family: Playlist;
                margin-bottom: 0;
                font-size: 28px;
            }
            #popup-biog .card .headshot {
                position: relative;
                padding-bottom: 100%;
                background-size: cover;
                display: block;
                width: 100%;
                border-radius: 50%;
                overflow: hidden;
            }
            #popup-biog .card p {
                margin-top: 0.5em;
            }
        #popup-biog .bio {
            display: inline-block;
            width: 60%;
        }
            #popup-biog .bio .text {
                margin: 1em 40px 1em 1em;
            }


@media (max-width: 768px) {
    #popup-biog .content {
        margin: 1em;
    }
    #popup-biog .box {
        width: 90vw;
        margin: 1% auto;
        max-height: 98%;
        z-index: 20000000;
    }
    #popup-biog .card,
    #popup-biog .bio {
        display: block;
        width: 98%;
        margin: 0 auto 1em;
    }
}



/* Meet the band ==== ***** OLD ***** ===== */
@media (min-width: 769px) {
    .meet-the-band .member {
        padding-left: 35%;
        position: relative;
        margin-bottom: 2em;
        min-height: 240px;
    }
        .meet-the-band .member .photo {
            position: absolute;
            width: 30%;
            left: 0;
            top: 0;
        }
            .meet-the-band .member .photo h3 {
                margin: 0.7em 0 0 0;
                font-weight: bold;
            }
            .meet-the-band .member .photo p {
                margin-top: 0;
            }
            .meet-the-band .member .photo img {
                max-width: 100%;
            }
}
@media (max-width: 769px) {
    section.meet-the-band.tab-layout.about-tabs div.answers,
    section.meet-the-band.tab-layout.about-tabs div.answers div.content {
        padding: 0;
    }

    .meet-the-band h4.section-name {
        padding: 0.5em 1em;
        color: #FFF;
        background: #e44549;
        margin: 0;
    }

    .meet-the-band .member {
        padding: 0 2em;
    }
}

/* See the band LIVE */
.past-events .sidebar-layout {
    background: #666 !important;
}
.past-events .sidebar-layout .main .heading {
    background: #333;
}

.sidebar-layout .main .content ul.events {
    list-style: none;
    list-style-type: none;
    margin: 0;
    padding: 0;
    color: #FFF;
}
.sidebar-layout .main .content ul.events li {
    margin-bottom: 0.5em;
}
    .sidebar-layout .main .content ul.events .header {
        background: #5d6cc7;
        padding: 1em 1.5em;
        position: relative;
    }
    .past-events .main .content ul.events .header {
        background: #666;
    }
        .sidebar-layout .main .content ul.events .header a,
        .sidebar-layout .main .content ul.events .header p,
        .sidebar-layout .main .content ul.events .header h2 {
            margin: 0;
            font-weight: normal;
            color: #FFF;
            text-decoration: none;
        }
        .sidebar-layout .main .content ul.events .header h3 {
            font-size: 0.9em;
        }
            .sidebar-layout .main .content ul.events .header a:hover h2 {
                text-decoration: underline;
            }
    .sidebar-layout .main .content ul.events .details {
        background: #7682cf;
        padding: 0 170px 0 20%;
        position: relative;
        min-height: 150px
    }
    .past-events .sidebar-layout .main .content ul.events .details {
        background: #333;
    }
        .sidebar-layout .main .content ul.events .details img.featured-image {
            float: right;
            position: absolute;
            right: 0;
            top: 0;
            max-width: 150px;
            max-height: 150px;
        }
        .sidebar-layout .main .content ul.events .details p.date {
            position: absolute;
            text-align: center;
            left: 0;
            top: 1em;
            width: 20%;
            margin: 0;
            font-family: 'Julius Sans One', sans-serif;
        }
        .sidebar-layout .main .content ul.events .details p a {
            color: #FFF;
        }
            .sidebar-layout .main .content ul.events .details p.date .day,
            .sidebar-layout .main .content ul.events .details p.date .month,
            .sidebar-layout .main .content ul.events .details p.date .year {
                display: block;
                line-height: 1em;
                margin: 0;
                font-weight: lighter;
            }
            .sidebar-layout .main .content ul.events .details p.date .day {
                font-size: 4em;
            }
            .sidebar-layout .main .content ul.events .details p.date .month {
                font-size: 2em;
                margin: 3px;
            }
            .sidebar-layout .main .content ul.events .details p.date .year {
                font-size: 1em;
            }

.sidebar-layout .sidebar .past-events {
    margin: 4em 0 0;
    padding: 1em 0;
    border-top: 1px solid #FFF;
}
    .sidebar-layout .sidebar .past-events h3 a {
        font-size: inherit;
        text-decoration: underline;
    }
    .sidebar-layout .sidebar .past-events p.event {
        padding: 1em;
        background: #990000;
        margin-bottom: 1em;
    }

@media (max-width: 768px) 
{
    .sidebar-layout .main .content ul.events .details 
    {
        padding-right: 5%;
    }
    .sidebar-layout .main .content ul.events .details p.date {
        margin: 1em auto;
        width: auto;
        position: static;
        text-align: left;
        display: block;
        text-transform: none;
    }
    .sidebar-layout .main .content ul.events .details p.date .day,
    .sidebar-layout .main .content ul.events .details p.date .month,
    .sidebar-layout .main .content ul.events .details p.date .year {
        display: inline;
        font-size: 18px;
        margin: 0 0 0 0;
        font-family: Lato, sans-serif;
        font-weight: bold;
    }
    .sidebar-layout .main .content ul.events .details {
        padding: 0 34% 0 1.5em;
        position: relative;
        overflow: hidden;
    }
        .sidebar-layout .main .content ul.events .details img.featured-image {
            width: auto;
            max-width: none;
            height: 100%;
            max-height: none;
            top: 0;
            left: 70%;
        }
}

/* NEW LIVE DATES SECTION */
#showgigfilter { display: none; }
#gigfilter p {
    margin: 0.5em 0;
    list-style: none;
    padding: 0;
}
#gigfilter li a {
    color: #000;
}
#gigfilter li.active a {
    text-decoration: none;
    font-weight: 200;
}
.nogigs { display: none; }
@media (min-width: 981px) 
{
    #gigfilter {
        max-width: 60%;
    }
        #gigfilter ul,
        #gigfilter li {
            list-style: none;
            margin: 0;
            padding: 0;
        }
        #gigfilter li {
            display: inline;
            white-space: nowrap;
        }
        #gigfilter li:after {
            content: " | ";
        }
        #gigfilter li:last-child:after {
            content: "";
        }
}
@media (max-width: 980px) 
{
    #showgigfilter { display: block; color: #000; }
    #gigfilter { display: none; }
}


#giglist {
    border-collapse: collapse;
    width: 100%;
    text-align: left;
    margin: 1em auto;
    font-family: inherit;
}
    #giglist thead {
        border-bottom: 1px solid #333;
    }
    #giglist tr:nth-child(even) {
        background-color: #c0dde0;
    }
    #giglist th {
        font-family: 'Julius Sans One',sans-serif;
    }
    #giglist td { font-family: Lato,sans-serif; }
    #giglist td, #giglist th {
        padding: 16px 6px;
        max-width: 260px;
    }
    #giglist a { font-weight: bold; color: #345c5d; }
    #giglist a.button { color: #FFF; }
    #giglist p.band { font-size: 0.8rem; margin: 0.5em 0 0 0; }
    #giglist p.band a { font-size: inherit; text-decoration: none; font-weight: normal; }

    #giglist .mob {
        display: none;
    }
    #giglist td.tix {
        min-width: 165px;
    }
    #giglist td.sellingfast a.button {
        background: #FFA500;
    }
    #giglist td.lastfew a.button {
        background: #c73a09;
    }
    #giglist td.soldout a.button {
        background: #808080;
    }

@media (max-width: 980px) 
{
    #giglist .full {
        display: none;
    }
    #giglist a.mob, {
        display: block;
    }
    #giglist td.mob, #giglist th.mob {
        display: table-cell;
    }
    #giglist td.tix {
        min-width: 0;
    }
}

/* Show page */
.showPage .show-header h1 {
  font-size: 5em;
}
.showPage .about-show .text {
    padding: 1em;
}

.showPage #giglist tr {
    border-bottom: 1px solid #CCC;
}
.showPage #giglist tr:nth-child(even) {
    background: none;
}

@media (max-width: 980px) {
    .showPage .show-header h1 {
        font-size: 3em;
        padding: 20px 32px;
    }
    .showPage .about-show {
        padding: 1em;
    }
}
@media (max-width: 768px) {
    .showPage .show-header h1 {
        font-size: 2.75em;
    }
}

@font-face {
  font-family: Copasetic;
  src: url(../img/Copasetic/CopaseticNF.otf);
}
.showPage.about {
    background: #FFF;
}

.show-header {
    padding: 0 0 1.5em;
    overflow: hidden;
    position: relative;
}
.showPage .show-header .bg,
.showPage .show-header .mask {
    background-position-x: center;
    background-position-y: center;
    background-size: cover;
    z-index: -2;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}
.show-header .mask {
    opacity: 0.5;
}

/*.show-header {
    background: #342d58;
    position: relative;
    z-index: 1;
    padding-bottom: 1em;
    overflow: hidden;
}
.show-header:after {
  background: inherit;
  bottom: 0;
  content: '';
  display: block;
  height: 50%;
  left: 0;
  position: absolute;
  right: 0;
  transform: skewY(-1.5deg);
  transform-origin: 100%;
  z-index: -1;
}*/
.show-header h1 {
  font-family: Copasetic;
  color: #f7f0e1;
  margin: 0;
  padding: 40px 32px 20px;
  text-align: center;
}
.about-show {
    background-color: #f7f0e1;
    margin: 2em auto 1em;
}
.show-quotes .quote {
    padding: 1em 5em;
    text-align: center;
}
    .show-quotes p {
        font-size: 16px;
        margin: 0.2em;
    }
        .show-quotes p.showquote {
            font-weight: bold;
            font-size: 24px;
        }




/* Mailing list */
.ml-form-embedContainer .ml-form-embedWrapper.embedForm {
    max-width: 100% !important;
}



@media (max-width: 980px) {
    .show-quotes .quote {
        padding: 1em;
    }

}



/* Single event */
.event-head {
    position: relative;
}
    .content.event .heading {
        margin-bottom: 0;
    }
    .event-head h1 {
        width: 90%;
        bottom: 0;
        margin: 0;
        padding: 0.5em 5%;
        background: #606fc9;
        color: #FFF;
    }
.sidebar-layout .content.event img {
    width: 100%;
    height: auto;
}
.sidebar-layout .content.event .padded {
    padding: 1em 2em;
}
    .sidebar-layout .sidebar .event-details ul {
        list-style: none;
        list-style-type: none;
        padding: 0;
        margin: 0;
    }
        .sidebar-layout .sidebar .event-details li {
            margin: 0.5em 0;
        }
    .sidebar-layout .sidebar .event-details span {
        font-weight: bold;
    }
a.get-tickets 
{
    display: block; text-decoration: none;
    font-size: 1.1em;
}
    a.get-tickets:hover 
    {
        text-decoration: underline;
    }
    a.get-tickets img 
    {
        margin-right: 0.5em;
        max-width: 20%;
        height: auto;
    }
    
.social-share p
{
    margin: 1em 0 0.5em;
}
.social-share .item 
{
    float: left;
    margin: 0.3em;
}
@media (max-width: 768px) 
{
    .event-head h1
    {
        font-size: 24px;
    }
}

/* Press & PR, Tech Spec */
.sidebar .download {
    text-align: center;
}
.sidebar .download img {
    display: block;
    margin: 1em auto;
    max-width: 100%;
}
.sidebar .download a {
    display: block;
}

/* Reviews */
.sidebar-layout .main .content ul.reviews {
    list-style: none;
    list-style-type: none;
    margin: 0;
    padding: 0;
    color: #FFF;
}
.sidebar-layout .main .content ul.reviews li {
    margin-bottom: 0.5em;
    background: #b1d5df;
    padding: 2em 2em 2em 22%;
    position: relative;
    min-height: 150px
}
        .sidebar-layout .main .content ul.reviews li p.date {
            position: absolute;
            text-align: center;
            left: 0;
            top: 2em;
            width: 20%;
            margin: 0;
            font-family: 'Julius Sans One', sans-serif;
        }
        .sidebar-layout .main .content ul.reviews li p a {
            color: #FFF;
        }
            .sidebar-layout .main .content ul.reviews li p.date .day,
            .sidebar-layout .main .content ul.reviews li p.date .month,
            .sidebar-layout .main .content ul.reviews li p.date .year {
                display: block;
                line-height: 1em;
                margin: 0;
                font-weight: lighter;
            }
            .sidebar-layout .main .content ul.reviews li p.date .day {
                font-size: 4em;
            }
            .sidebar-layout .main .content ul.reviews li p.date .month {
                font-size: 2em;
                margin: 3px;
            }
            .sidebar-layout .main .content ul.reviews li p.date .year {
                font-size: 1em;
            }

        ul.reviews li blockquote {
            background: none;
            padding: 0;
            margin: 0;
            border-radius: 0;
        }

        .sidebar-layout .main .content ul.reviews li .description,
        .sidebar-layout .main .content ul.reviews li .description a {
            margin: 0;
            color: #000;
        }
        .sidebar-layout .main .content ul.reviews li .description cite p {
            text-align: right;
            font-style: normal;
        }
            .sidebar-layout .main .content ul.reviews li .description cite p span {
                font-size: 1.1em;
                font-family: 'Julius Sans One', sans-serif;
                display: block;
            }

        .sidebar-layout .main .content ul.reviews li ul.gallery {
            list-style: none;
            list-style-type: none;
            margin: 1.5em 0 0;
            padding: 1.5em 0 0;
            border-top: 1px solid #c9e2e9;
        }
            .sidebar-layout .main .content ul.reviews li ul.gallery li {
                float: left;
                margin: 0;
                padding: 0 1em 0 0;
                min-height: 0;
            }

.review-sidebar {
    margin: 0;
    padding: 0;
    list-style: none;
    list-style-type: none;
}
    .review-sidebar li {
        position: relative;
        margin-bottom: 2em;
    }
        .review-sidebar li img {
            width: 100%;
        }
        .review-sidebar li.img h3,
        .review-sidebar li.img p {
            position: absolute;
            padding: 0.5em 5%;
            margin: 0;
            width: 90%;
            background: url("../img/blue-mask.png");
        }
        .review-sidebar li.img h3 {
            top: 0;
        }
        .review-sidebar li.img p {
            bottom: 0;
            opacity: 0;
            transition: opacity 0.3s;
            -webkit-transition: opacity 0.3s; /* For Safari 3.1 to 6.0 */
        }
        .review-sidebar li:hover p {
            opacity: 1;
        }


@media (max-width: 768px) {
    .sidebar-layout .main .content ul.reviews li {
        padding-left: 25%;
    }
    .sidebar-layout .main .content ul.reviews li p.date .day {
        font-size: 3em;
    }
    .sidebar-layout .main .content ul.reviews li 
    {
        padding: 1em 1.5em;
    }
    .sidebar-layout .main .content ul.reviews li p.date {
        position: static;
        text-align: left;
        width: auto;
        font-family: 'Julius Sans One', sans-serif;
        color: #FFF;
        margin: 1em 0;
    }
        .sidebar-layout .main .content ul.reviews li p.date .day,
        .sidebar-layout .main .content ul.reviews li p.date .month,
        .sidebar-layout .main .content ul.reviews li p.date .year {
            font-size: 2em;
            display: inline;
        }
    
}

/* Review single page */
.main.review {
    background: #b1d5df;
}
.review-head {
    position: relative;
}
    .review-head img {
        width: 100%;
    }
    .review-head h1 {
        position: absolute;
        width: 90%;
        font-size: 1.3em;
        bottom: 1em;
        padding: 0.5em 5%;
        background: url('../img/blue-mask.png');
        color: #FFF;
    }
.review-content {
    padding: 1em 2em 1em 20%;
    position: relative;
    color: #222;
}
    .review-content a {
        color: #222;
    }
    .review-content p.date {
        position: absolute;
        text-align: center;
        left: 0;
        top: 2em;
        width: 20%;
        margin: 0;
        font-family: 'Julius Sans One', sans-serif;
        color: #FFF;
    }
        .review-content p.date .day,
        .review-content p.date .month,
        .review-content p.date .year {
            display: block;
            line-height: 1em;
            margin: 0;
            font-weight: lighter;
        }
        .review-content p.date .day {
            font-size: 5em;
        }
        .review-content p.date .month {
            font-size: 2em;
            margin: 3px;
        }
        .review-content p.date .year {
            font-size: 1em;
        }
        .review-content .intro p {
            font-weight: bold;
        }
            .review-content article .client {
                text-align: right;
                font-family: 'Julius Sans One', sans-serif;
                padding: 1em 0;
                font-size: 1em;
            }
                .review-content article .client span {
                    display: block;
                    font-size: 0.7em;
                }
        .review-content .lightbox-set {
            margin: 1em 0;
            padding: 0;
            width: 100%;
        }
        
@media (max-width: 768px) 
{
    
    .review-head h1 {
        position: static;
        width: 90%;
        font-size: 1.1em;
        bottom: 1em;
        padding: 0.5em 5%;
        background: url('../img/blue-mask.png');
        color: #FFF;
        margin: 0;
    }
    .review-content 
    {
        padding: 1em 1.5em;
    }
    .review-content p.date {
        position: static;
        text-align: left;
        width: auto;
        font-family: 'Julius Sans One', sans-serif;
        color: #FFF;
    }
        .review-content p.date .day,
        .review-content p.date .month,
        .review-content p.date .year {
            font-size: 3em;
            display: inline;
        }
}

/* Your Event */
.your-event-section {
    margin: 3em 0;
}
.your-event-section.w {
    background: #FFF;
}
.your-event-section img.r {
    float: right;
    margin: 0 0 0 2em;
}
.your-event-section img.l {
    float: left;
    margin: 0 2em 0 0;
}
.your-event-section h2 a {
    font-family: inherit;
    font-size: inherit;
    color: #333;
    text-decoration: none;
    border-bottom: 1px solid #CCC;
}

/* Your Event 2021 */
.divider-img {
    height: 400px;
    background-position: center;
    opacity: 0.8;
    background-size: cover;
    position: relative;
}
.your-event-2021 .introduction-text p {
    font-size: 18px;
}
.your-event-2021 .your-event-section {
    padding: 0;
}
.your-event-2021 .images .cell {
    text-align: left; padding: 1em 2em;
}
.your-event-2021 .roundquote.padded {
    padding: 50px 100px;
}
@media (max-width: 780px) {
    .your-event-2021 .images .cell {
        padding: 1em 0;
    }
    .your-event-2021 .roundquote.padded {
        padding:  0;
    }
}
@media (min-width: 1500px) {
    .divider-img {
        height: 600px;
    }
}


/* Wedding packages */
h1.wedding-package-header {
    padding: 1em; border-bottom: 0.5px solid #f2f2f2;
    font-size: 2vw;
}
.your-event-2021 .sample-table {
    background: #d6e8ea; padding: 0 0.5em 2em 0.5em;
}


@media (max-width: 780px) {
    h1.wedding-package-header { font-size:  5vw; }
}
@media (min-width: 1500px) {
    h1.wedding-package-header { font-size:  36px; }
}


/* Our advice */
.articles {
    margin: 2em auto 3em;
}
.articles .article-wrap {
    float: left;
    width: 50%;
    margin: 0;
    display: inline-block;
    *display: inline;
    zoom: 1;
}
    .articles .article-wrap div.inner {
        padding: 1em;
        margin: 1em 3em;
        background: #FFF;
        box-shadow: 0 0 15px #99cccc;
    }
    .articles .article-wrap div.inner img {
        max-width: 100%;
        height: auto;
    }
    .articles .article-wrap div.inner h3 a {
        font-size: inherit;
        font-family: inherit;
        text-decoration: none;
        color: #333;
    }

@media (max-width: 768px) {

    .your-event-section {
        padding: 0 1.5em;
    }
        .your-event-section h2 {
            margin-top: 0.8em;
            display: block;
        }
        .your-event-section img.r,
        .your-event-section img.l {
            margin: 0 0 1em 0;
            width: 100%;
            float: none;
        }

    .articles .article-wrap {
        float: none;
        width: 100%;
        margin: 0;
        display: block;
    }
    .articles .article-wrap div.inner {
        padding: 1em;
        margin: 1em 2em;
        background: #FFF;
        box-shadow: 0 0 15px #99cccc;
    }
}


/* Events */

body.doctype_weddingpackages {
    background: #FFF;
    font-size: 18px;
}

    body.doctype_weddingpackages h2 {
        font-size: 1.8em;
    }
    body.doctype_weddingpackages p {
        margin: 1.2em auto;
        font-size: inherit;
    }

section.image-leader.weddings {
    padding-bottom: 0;
}
.letterbox .corporate-clients {
    position: absolute;
    bottom: 1em;
    background: url('../img/purple-mask.png') repeat;
    width: 100%;
    height: auto;
}
    .letterbox .corporate-clients div {
        display: inline-block;
        *display: inline;
        zoom: 1;
        margin: 1em 0 1em 1em;
    }
        .letterbox .corporate-clients div img {
            height: 70px;
            width: auto;
        }
    .letterbox .corporate-clients blockquote {
        color: #FFF;
        float: right;
        width: 35%;
        margin: 0;
    }
        .letterbox .corporate-clients blockquote p {
            margin: 1em 2em 0.1em;
        }
        .letterbox .corporate-clients blockquote .client {
            text-align: right;
            margin: 0 2em 1em;
        }
@media (max-width: 980px) {
    .letterbox .corporate-clients {
        text-align: center;
    }
        .letterbox .corporate-clients blockquote {
            display: none;
        }
}
@media (max-width: 768px) {
    .letterbox .corporate-clients {
        display: none;
    }
}

/* Gallery */
.gallery .heading h2 
{
    max-width: 80%;
    margin-bottom: 5px;
}
.gallery-featured ul li a.title {
    font-family: 'Julius Sans One', sans-serif;
}
.gallery ul {
    list-style: none;
    list-style-type: none;
    margin: 0 auto;
    padding: 1em 0;
    width: 75%;
}
    .gallery ul li {
        float: left;
        width: 19%;
        margin: 1em 7% 1em 0;
        overflow: hidden;
        background: #FFF;
    }
    .gallery ul li.end {
        margin-right: 0;
    }
        .gallery ul li img {
            width: 97%;
            border: 2px #015c5e solid;
        }
            .gallery ul li:hover img {
                border: 2px #cc0000 solid;
                opacity: 0.8;
            }
.photographer-credit 
{
    width: 75%;
    margin: 0 auto;
    text-align: center;
}

@media (max-width: 980px) {
    .gallery ul {
        width: auto;
        padding: 1em 3em;
    }
}
@media (max-width: 768px) {
    .gallery .heading h2 
    {
        max-width: none;
    }
    .gallery ul {
        width: auto;
        padding: 1em 2em;
    }
}

/* Enquiry form */
input 
{
    font-family: "Lato", sans-serif;
}
#bookingForm,
#contour_form_DownfortheCountEnquiryForm {
    margin: 1em 2em;
    border: 0.3em solid #015c5e;
    font-size: 20px;
}
    #contour_form_DownfortheCountEnquiryForm h4
    {
        display: none;
    }
    #contour_form_DownfortheCountEnquiryForm .span6.col-md-6,
    #bookingForm div.column {
        width: 45%;
        padding: 0 2.4%;
        margin: 0;
        float: left;
    }
    #bookingForm div.column.l,
    #contour_form_DownfortheCountEnquiryForm .span6.col-md-6:first-child {
        border-right: solid 1px #669999;
    }
        #bookingForm fieldset,
        #contour_form_DownfortheCountEnquiryForm fieldset {
            margin: 0 0 1em;
        }
            #bookingForm fieldset legend {
                margin: 1em 0;
            }
            #contour_form_DownfortheCountEnquiryForm .contourField.text h2 
            {
                margin: 0;
                font-size: 20px;
            }
            #bookingForm fieldset > div,
            #contour_form_DownfortheCountEnquiryForm .contourField {
                margin: 24px 0;
            }
            #contour_form_DownfortheCountEnquiryForm .contourField:before,
            #contour_form_DownfortheCountEnquiryForm .contourField:after {
                content: " "; /* 1 */
                display: table; /* 2 */
            }

            #contour_form_DownfortheCountEnquiryForm .contourField:after {
                clear: both;
            }
            #contour_form_DownfortheCountEnquiryForm .contourField {
                *zoom: 1;
            }
                #contour_form_DownfortheCountEnquiryForm .contourField label
                {
                    font-weight: normal;
                }
                #contour_form_DownfortheCountEnquiryForm .contourField.textfield label {
                    float: left;
                    width: 45%;
                    padding: 3px 0;
                }
                #contour_form_DownfortheCountEnquiryForm .contourField.textfield input {
                    float: right;
                    padding: 3px;
                    border: 2px solid #015c5e;
                    width: 50%;
                    margin: 0;
                }
                #bookingForm fieldset > div input[type="text"],
                #bookingForm fieldset > div input[type="email"] {
                    float: right;
                    padding: 3px;
                    border: 2px solid #015c5e;
                    width: 50%;
                }
                #bookingForm fieldset > div select {
                    display: block;
                }
                #contour_form_DownfortheCountEnquiryForm textarea,
                #bookingForm fieldset > div textarea {
                    display: block;
                    float: none;
                    width: 75%;
                    margin: 0.5em 0;
                    height: 100px;
                    padding: 3px;
                    border: 2px solid #015c5e;
                }
                #contour_form_DownfortheCountEnquiryForm .contourField.checkbox
                {
                    position: relative;
                }
                #contour_form_DownfortheCountEnquiryForm .contourField.checkbox input
                {
                    position: absolute;
                    top: 3px;
                    left: 0;
                }
                #contour_form_DownfortheCountEnquiryForm .contourField.checkbox label 
                {
                    margin-left: 25px;
                }
                /*#bookingForm fieldset input[type="checkbox"] {
                    margin: 0 0 0 1em;
                }
                #bookingForm fieldset div.checkboxes {
                    margin: 1em 0.5em 0.2em 0.5em;
                }
                #bookingForm fieldset div.checkboxes label {
                    display: block;
                }
                #bookingForm fieldset div.checkboxes input[type="checkbox"] {
                    margin: 0 1em 0 0;
                }*/
                
                #bookingForm fieldset div.other input {
                    float: none;
                    display: block;
                }
                #bookingForm input[type="submit"] {
                    margin-top: 1em;
                }
                #bookingForm div.submit img.working {
                    display: none;
                }
                #bookingForm .success {
                    color: #015c5e;
                    font-style: italic;
                    display: none;
                }
    .contourMessageOnSubmit 
    {
        margin: 1em auto;
        max-width: 75%;
    }

@media (max-width: 980px) {
    #contour_form_DownfortheCountEnquiryForm .span6.col-md-6,
    #bookingForm div.column {
        width: auto;
        float: none;
        padding: 0 2em;
    }
    #contour_form_DownfortheCountEnquiryForm .span6.col-md-6:first-child,
    #bookingForm div.column.l {
        border: none;
    }
}
@media (max-width: 768px) {
    #bookingForm fieldset > div input[type="text"],
    #bookingForm fieldset > div input[type="email"],
    #bookingForm fieldset > div textarea {
        float: none;
        display: block;
        width: 95%;
    }
    #contour_form_DownfortheCountEnquiryForm .contourField.textfield label,
    #contour_form_DownfortheCountEnquiryForm .contourField.textfield input,
    #contour_form_DownfortheCountEnquiryForm .contourField textarea
    {
        width: 95%;
    }
    #contour_form_DownfortheCountEnquiryForm 
    {
        margin: 1em 5%;
    }
    #contour_form_DownfortheCountEnquiryForm .span6.col-md-6 
    {
        padding: 0 5%;
    }
}

/* CD Request form */
#contour_form_CDrequestform {
    padding: 1em;
    border: 0.1em solid #015c5e;
    font-size: 20px;
}
#contour_form_CDrequestform h4 {
    margin: 0.5em 0;
}
#contour_form_CDrequestform input[type="submit"]{
    margin: 1em 0;
}
#contour_form_CDrequestform .col-md-6 {
    float: left;
    width: 233px;
}
#contour_form_CDrequestform .col-md-6:first-child {
    border-right: 1px solid #015c5e;
    margin-right: 28px;
    padding-right: 28px;
}
#contour_form_CDrequestform .contourField input {
    width: 96%;
    padding: 1%;
}
#contour_form_CDrequestform .contourField {
    margin-bottom: 0.4em;
}
#contour_form_CDrequestform .field-validation-error,
#contour_form_CDrequestform .help-block {
    color: #CCC;
    font-size: 15px;
    font-family: "Lato" sans-serif;
    display: block;
}
#contour_form_CDrequestform .field-validation-error {
    color: red;
}
@media (max-width: 980px) {
    #contour_form_CDrequestform .contourField {
        width: 100%;
    }
    #contour_form_CDrequestform .col-md-6 {
        width: auto;
        float: none;
    }
    #contour_form_CDrequestform .col-md-6:first-child {
        border-right: none;
    }
}
@media (max-width: 768px) {
    #contour_form_CDrequestform .contourField input {
        width: 97%;
        padding: 1%;
    }
}



/* News */
.sidebar-layout .main .content ul.news {
    list-style: none;
    list-style-type: none;
    margin: 0;
    padding: 0;
    color: #FFF;
}
.sidebar-layout .main .content ul.news li {
    margin-bottom: 0.5em;
}
    .sidebar-layout .main .content ul.news .header {
        background: #107375;
        padding: 1em;
    }
        .sidebar-layout .main .content ul.news .header a {
            display: block;
            padding-right: 160px;
            position: relative;
        }
        .sidebar-layout .main .content ul.news .header h2 {
            font-size: 0.9em;
        }
        .sidebar-layout .main .content ul.news .header a,
        .sidebar-layout .main .content ul.news .header h2 {
            margin: 0;
            font-weight: normal;
            color: #FFF;
            text-decoration: none;
        }
        .sidebar-layout .main .content ul.news .header a p{
            font-family: 'Julius Sans One', sans-serif;
            position: absolute;
            right: 0; top: -1em;
        }
            .sidebar-layout .main .content ul.news .header a:hover h2 {
                text-decoration: underline;
            }
    .sidebar-layout .main .content ul.news .details {
        background: #2f797b;
        padding: 0 170px 0 2em;
        position: relative;
        min-height: 150px;
    }
        .sidebar-layout .main .content ul.news .details img {
            float: right;
            position: absolute;
            right: 0; top: 0;
            max-width: 150px;
            max-height: 150px;
        }


.sidebar-layout .main .content ul.news li.news .header {
    background: #5d6cc7;
}
.sidebar-layout .main .content ul.news li.news .details {
    background: #7682cf;
}
.sidebar-layout .main .content ul.news li.review .header {
    background: #2593b2;
}
.sidebar-layout .main .content ul.news li.review .details {
    background: #47a3bd;
}
.sidebar-layout .main .content ul.news li.advice .header {
    background: #188c8d;
}
.sidebar-layout .main .content ul.news li.advice .details {
    background: #2fa3a4;
}
.sidebar-layout .main .content ul.news li.blog .header {
    background: #cc3333;
}
.sidebar-layout .main .content ul.news li.blog .details {
    background: #de5a5a;
}
@media (max-width: 768px) {
    .sidebar-layout .main .content ul.news .details p.date {
        font-size: 10px;
        margin: 7px 0;
    }
    .sidebar-layout .main .content ul.news .header a 
    {
        padding: 0;
    }
    .sidebar-layout .main .content ul.news .header a p 
    {
        position:static;
        font-size: 0.8em;
        margin: 1em 0 0;
    }
    .sidebar-layout .main .content ul.news .details 
    {
        padding-right: 5%;
        position: relative;
    }
    .sidebar-layout .main .content ul.news .details img 
    {
        display: none;
    }
}

/* News article */
.article-head {
    position: relative;
}
    .content.article .heading {
        margin: 0;
    }
    .article-head h1 {
        position: absolute;
        width: 90%;
        bottom: 0;
        margin: 0;
        padding: 0.5em 5%;
        background: url('../img/purple-mask.png');
        color: #FFF;
    }
.sidebar-layout .content.article img {
    width: 100%;
    height: auto;
}
.sidebar-layout .content.article .padded {
    padding: 1em 2em;
}
.article .date-author {
    color: #CCC;
}
.newsarticlesidebar a
{
    display: block;
    text-decoration: none;
    margin-bottom: 0.6em;
}
    .newsarticlesidebar a:hover 
    {
        text-decoration: underline;
    }

.about-author {
    margin-bottom: 2em;
}
.about-author img {
    float: left;
    max-width: 100px;
    height: auto;
    padding: 0 1em 1em 0;
}

@media (max-width: 768px) {
    .article-head h1 {
        position: static;
        background: url('../img/purple-mask.png');
        color: #FFF;
        font-size: 24px;
    }
    .article .date-author {
        font-size: 11px;
    }
}


/* Blog article 2021 */

/*
.blog2021 article {
    padding: 3rem 1rem;
    max-width: 780px;
    margin:  0 auto;
}
    .blog2021 article h1 {
        margin: 0;
        font-size: 2.8rem;
    }
    .blog2021 article p {
        font-size: 18px;
    }
    .blog2021 article p.date-author {
        color:  #CCC;
        margin-bottom:  2rem;
    }*/

.blog2021 .content.article {
    position: relative;
    padding: 0 0 0 30%;
    margin: 0 auto;
    max-width: 1500px;
}
.blog2021 .content.article .articleimage {
    width: 30%;
    position: absolute;
    top: 0;
    left: 0;
    overflow: hidden;
    padding: 3rem 0 1rem;
}
    .blog2021 .content.article .articleimage img {
        max-width: 100%;
    }
.blog2021 .content.article article {
    padding: 3rem 2rem;
}
    .blog2021 .content.article article h1 {
        margin-top: 0;
        font-size: 2.8rem;
    }
    .blog2021 .content.article article p {
        font-size: 18px;
    }

@media (max-width: 768px) {
    .blog2021 .content.article {
        padding: 0;
    }
    .blog2021 .content.article .articleimage {
        width: auto;
        position: static;
        margin: 0 0 1rem;
        padding: 0;
    }
    .blog2021 .content.article article h1 {
        font-size: 5vw;
    }
}


/* FAQs */
section.faqs {
    padding: 0;
}
section.faqs .heading {
    margin: 0;
}
section.tab-layout.faqs ul.questions {
    background: #f9ddac;
    width: 30%;
    padding: 1em 0 1em 3%;
}
    section.tab-layout.faqs a {
        color: #666;
    }
    section.tab-layout.faqs ul.questions li.active a,
    section.tab-layout.faqs ul.questions li a:hover {
        color: #000;
    }
    section.tab-layout.faqs div.display div.answers .q {
        color: #d59014;
    }

/* May 2016 Changes */
.duck-blue section { background-color:#d1e9eb; }
.blue-alt-sections section:nth-child(odd) { background-color:#e5f3f4; }
.blue-alt-sections section:nth-child(even) { background-color:#fff; }

h2.lineup-subheader {
    margin: 0;
    padding: 1em 0;
    text-align: center;
}

.highlight-bullets {
    padding: 1em 3em;
    margin: 0;
}
.left-bullets,
.right-bullets {
    float: left;
    width: 46%;
    padding: 0;
    margin: 0;
}
    .left-bullets { margin-right: 4%; }
    .right-bullets { margin-left: 4%; }
    .highlight-bullets li {
        margin-left: 1em;
        list-style: disc;
        list-style-type: disc;
    }
@media (max-width: 768px) {
    .highlight-bullets {
        padding: 1em 0.5em 1em 1.5em;
    }
    .left-bullets,
    .right-bullets {
        float: none;
        width: 100%;
        margin-left: 0;
        margin-right: 0;
    }
        .highlight-bullets li:nth-child(odd),
        .highlight-bullets li:nth-child(even) {
            margin-left: 1em;
            margin-right: 0;
        }
}

/*  Lineup Sticky  Nav */
#lineup-section-about section:first-child {
    padding: 0;
}
#lineup-floating-nav {
    text-align: center;
    display: block;
    padding: 0.6em 0;
}
#lineup-floating-nav .burger {
    display: none;
}
#lineup-floating-nav.fixed {
    position: fixed;
    top: 56px;
    width: 100%;
    z-index: 110;
}
#lineup-floating-nav a {
    display: inline-block;
    color: #FFF;
    text-transform: uppercase;
    font-size: 20px;
    line-height: 20px;
    padding: 3px 0.5em;
    margin: 10px 1em;
    text-decoration: none;
    border-radius: 5px;
    -webkit-transition: background 0.15s; /* For Safari 3.1 to 6.0 */
    transition: background 0.15s;
}
#lineup-floating-nav a.active,
#lineup-floating-nav a:hover {
    background: #333;
}
#lineup-floating-nav-placeholder {
    display: none;
    padding: 0;
    margin: 0;
    width: 100%;
    height:0;
}
@media (max-width: 768px) {
    #lineup-floating-nav {
        text-align: left;
        padding: 0 25% 0 0;
        width: 75%;
        position: relative;
    }
    #lineup-floating-nav.fixed {
        width: 75%;
        height: 47px;
        display: block;
        top: 61px;
    }
        #lineup-floating-nav.fixed.open {
            height: auto;
        }
    #lineup-floating-nav a {
        display: none;
    }
    #lineup-floating-nav a.active {
        display: inline-block;
    }
    #lineup-floating-nav.open a {
        display: block;
        max-width: 
    }
    #lineup-floating-nav a.burger {
        position: absolute;
        display: block;
        top: 0;
        right: 0;
        height: 26px;
        width: 26px;
        padding: 1px;
        margin: 10px 1em;
        background: url('../img/sub-burger.png') center center no-repeat;
        background-size: contain;
        transition: none;
    }
    #lineup-floating-nav a.burger:hover {
        background: url('../img/sub-burger.png') center no-repeat;
        background-size: contain;
    }
}


#lineup-section-about .text-columns {
    margin: 2em auto;
    padding: 0 3em;
}
#lineup-section-about .text-columns .column {
    display: inline-block;
    width: 45%;
    margin: 0 5% 0 0;
    vertical-align: top;
}
    #lineup-section-about .text-columns .column:last-child {
        margin: 0 0 0 0;
    }
@media (max-width: 768px) {
    #lineup-section-about .text-columns {
        padding: 0 1em;
    }
    #lineup-section-about .text-columns .column {
        display: block;
        width: auto;
        margin: 0 auto;
    }
    #lineup-section-about .text-columns .column:last-child {
        margin: 0 auto;
    }
}

/*  Lineup Video Viewer */
.lineup-vids {
    padding-bottom: 2em;
}
.lineup-vid-viewer {
    margin: 1em 0 2em;
    text-align: center;
}
.lineup-vids div.v {
    width: 48%;
    margin: 0 1%;
    float: left;
}
    .lineup-vids div.v.three {
        width: 32%;
        margin: 0 2% 1em 0;
        padding: 0;
    }
    .lineup-vids div.v.three:nth-child(3),
    .lineup-vids div.v.three:nth-child(6),
    .lineup-vids div.v.three:nth-child(9) {
        margin: 0 0 1em 0;
    }
    .lineup-vids div.v.four {
        width: 23%;
        margin: 0 2% 1em 0;
        padding: 0;
    }
    .lineup-vids div.v.four:nth-child(4),
    .lineup-vids div.v.four:nth-child(8),
    .lineup-vids div.v.four:nth-child(12) {
        margin: 0 0 1em 0;
    }

.vids2021 .lineup-vids div.v {
    position: relative;
    overflow: hidden;
}
    .vids2021 .lineup-vids div.v .playing {
        transition: opacity, 0.2s;
        opacity: 0.7;
    }
    .vids2021 .lineup-vids div.v a p {
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        font-size: 12px;
        padding: 0.6em 0;
        text-align: center;
        display: inline-block;
        margin: 0;
        color: #FFF;
        background: url('../img/black-mask.png');
        text-decoration: none;
    }
    .vids2021 .lineup-vids div.v img.play {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        -webkit-filter: drop-shadow(5px 5px 5px #222);
        filter: drop-shadow(5px 5px 5px #222);
    }



@media (max-width: 768px) {
    .lineup-vids {
        padding: 0 5% 1em;
    }
    .lineup-vids div.v {
        width: 100%;
        float: none;
    }
        .lineup-vids div.v:nth-child(odd),
        .lineup-vids div.v:nth-child(even) {
            width: 100%;
            margin-right: 0;
            margin: 1em 0;
        }
}

.flexi {  }
.flexi.half {
    width: 48%;
    padding: 0 1% 1em;
    float: left;
}
.flexi.half .content {
    margin: 0 2em;
}
.flexi.full { width: 100%; }
@media (max-width: 768px) {
    .flexi.half {
        width: 100%;
        padding: 0;
        float: none;
    }
}

.popup-player {
    text-align: center;
}

.lineup-gallery ul {
    list-style: none;
    list-style-type: none;
    padding: 0;
    margin: 0 3em;
}
    .lineup-gallery li {
        width: 33.3%;
        float: left;
    }
        .lineup-gallery li img {
            width: 98%;
            padding: 1%;
            height: auto;
        }
@media (max-width: 768px) {
    .lineup-gallery ul {
        margin: 0 1em;
    }
}

.lineup-testimonials .more {
    text-align: center;
}

.download-repertoire {
    margin: 1em 20% 1em;
    padding: 1em 0 0 90px;
    position: relative;
    border-top: 1px solid #CCC;
}
    .download-repertoire img {
        position: absolute;
        width: 70px;
        height: auto;
        left: 0; top: 1.5em;
    }
    .download-repertoire h3 {
        margin-bottom: 0;
    }
    .download-repertoire p {
        margin-top: 0;
    }
    .download-repertoire p a {
        text-decoration: none;
    }
        .download-repertoire p a:hover {
            text-decoration: underline;
        }
@media (max-width: 768px) {
    .download-repertoire {
        margin: 1em 0;
        padding: 1em 0 0 50px;
    }
    .download-repertoire img {
        width: 40px;
        top: 2em;
    }
}

.lineup-extras {
    margin: 2em auto 0;
    position: relative;
    padding-left: 200px;
    min-height: 200px;
    width: 60%;
}
    .lineup-extras img {
        position: absolute;
        left: 0; top: 0;
        width: 180px; height: auto;
    }
@media (max-width: 768px) {
    .lineup-extras {
        margin: 2em 0 0;
        padding-left: 0;
        width: auto;
    }
        .lineup-extras img {
            position: static;
            float: right;
            margin: 0 0 1em 1em;
            width: 80px;
        }
}

/* Homepage */
.homepage_lineups {
    padding: 0 1em;
}
.homepage_lineups div.lineup a.img {
    height: 200px;
    background-size: cover;
    display: block;
    background-position: center;
}
.homepage_lineups div.lineup h3 a {
    text-decoration: none;
    color: #333;
    font-size: 1.3em;
}
@media (min-width: 769px) {
    .homepage_lineups div.lineup {
        width: 28%;
        padding: 1em 2.5%;
        float: left;
    }
    .homepage_lineups div.lineup h3 a {
        font-size: 1em;
    }
}

.our-bands-home {
    background: #FFF;
}
.our-bands-home .welcome h2 {
    font-size: 2em;
    font-family: 'Lato';
    text-align: center;
}
.our-bands-home .welcome p,
.our-bands-home .welcome p a {
    font-size: 18px;
    text-align: center;
}
    p.calltoaction a {
        display: inline-block;
        text-decoration: none;
        color: #FFF;
        background: #015c5e;
        padding: 0.5em 1em;
        border-radius: 0.2em;
        margin: 0.5em 0;
        -webkit-transition: background 0.15s; /* For Safari 3.1 to 6.0 */
        transition: background 0.15s;
    }
        p.calltoaction a:hover {
            background: #006666;
        }
.our-bands-home .center-text h2 a {
    color:#333;
    font-size: 48px;
    font-family: 'Julius Sans One',sans-serif;
    text-decoration: none;
}
.homepage_about .wrap {
    padding: 2em;
}
.homepage_about p,
.homepage_about a {
    font-size: 16px;
}
    .homepage_about .about {
        width: 48%;
        float: left;
    }
    .homepage_about .img {
        width: 40%;
        float: right;
        overflow: hidden;
        text-align: center;
    }
        .homepage_about .img img {
            max-width: none;
            max-height: 600px;
        }

@media (max-width: 768px) {
    .hero .header-content h1 { font-size: 1.6em; }
    .hero .header-content p { font-size: 0.8em; }
    .hero .header-content a { opacity: 1; }
    .homepage_about .wrap {
        width: 100%;
        padding: 0;
    }
    .homepage_about .about,
    .homepage_about .img {
        width: auto;
        float: none;
    }
}

h2.homepage {
    text-align: center;
    color: #333;
}
h2.homepage.white {
    color: #FFF;
}
h2.homepage a {
    text-decoration: none;
    color: inherit;
    font-family: inherit;
    font-size: inherit;
    text-align: center;
}

@media (max-width: 768px) {
    .homepage_about .img img {
        max-width: 100%;
        max-height: none;
    }
}


.homepage-clients {
    margin: 2em auto 3em;
}
    .homepage-clients h2 {
        font-weight: bold;
    }
    .homepage-clients .clientslides {
        position: relative;
    }
    .homepage-clients .clientslides img {
        display: none;
    }
        .homepage-clients .clientslides img:first-child {
            display: block;
        }


/* Our bands */

.bands-listing-sections:nth-child(odd) {
    background-color:#d1e9eb;
}
.bands-listing-sections:nth-child(even) {
    background-color:#FFF;
}

section.bands-listing {
    text-align: center;
    margin:  0 auto;
    padding: 2em 0;
    background: none;
}
.bands-listing h2 {
    text-transform: uppercase;
    font-size: 38px;
    margin: 1em auto 0;
    max-width: 700px;
    widows: 3;
}
    .bands-listing ul.bands {
        list-style: none;
        list-style-image: none;
        list-style-type: none;
        margin: 2em 0;
        padding: 0;
    }
    .bands-listing ul.bands li {
        position: relative;
        margin-bottom: 1.5em;
        width: 46%;
        float: left;
    }
        .bands-listing ul.bands li.half.odd {
            margin-right: 8%;
        }
    .bands-listing ul.bands li.full {
        width: 100%;
        margin-right: 0;
        margin-left: 0;
        display: block;
        float: none;
    }
        .bands-listing ul.bands li.full img.mob {
            display: none;
        }
    .bands-listing ul.bands li,
    .bands-listing ul.bands li a p,
    .bands-listing ul.bands li a:hover,
    .bands-listing ul.bands li a:visited {
        color: #333;
    }
        .bands-listing ul.bands li img {
            width: 100%;
            height: auto;
        }
        .bands-listing ul.bands .details {
            padding: 1em;
            text-align: left;
        }
            .bands-listing ul.bands .details h3,
            .bands-listing ul.bands .details p {
                margin: 0;
                font-size: 18px;
                line-height: 22px;
            }
            .bands-listing ul.bands .details h3 {
                margin: 0.5em 0;
            }
                .bands-listing ul.bands li h3 a {
                    color: #000;
                    text-decoration: none;
                    font-size: 26px;
                }
                .bands-listing ul.bands .details h3 a,
                .bands-listing ul.bands .details h3 a:hover,
                .bands-listing ul.bands .details h3 a:active,
                .bands-listing ul.bands .details h3 a:visited,
                .bands-listing ul.bands .details a,
                .bands-listing ul.bands .details a:hover,
                .bands-listing ul.bands .details a:active,
                .bands-listing ul.bands .details a:visited {
                    text-decoration: none;
                }



@media (max-width: 768px) {
    .strapline p {
        margin: 0 1em;
        width: auto;
    }
    .bands-listing h2 {
        margin: 1em;
    }
    .bands-listing ul.bands {
        padding: 0 1em;
    }
    .bands-listing ul.bands li {
        width: 100%;
        display: block;
        float: none;
    }
        .bands-listing ul.bands li.half.odd {
            margin-right: 0;
        }
        .bands-listing ul.bands li.full img.mob {
            display: block;
        }
        .bands-listing ul.bands li.full img.normal {
            display: none;
        }
            .bands-listing ul.bands .name {
                bottom: 5px;
                font-size: 1.5em;
            }
}

/* About 2016 */
.about-sections {
    padding: 1em 15%;
}
.blue-alt-sections section.about-sections:nth-child(even) { background-color:#e5f3f4; }
.blue-alt-sections section.about-sections:nth-child(odd) { background-color:#fff; }
.about-sections.testimonial {
    margin: 0 auto;
}
.about-sections.testimonial .image,
.about-sections.testimonial .text {
    float: left;
    margin: 1em 0;
}
.about-sections.testimonial .image {
    width: 40%;
    padding-right: 5%;
}
.about-sections.testimonial .text {
    width: 55%;
}
    .about-sections.testimonial .text .client {
        text-align: right;
    }
    .about-sections.testimonial .text .client span {
        font-family: 'Julius Sans One', sans-serif;
        font-size: 22px;
    }
@media (max-width: 980px) {
    .about-sections.testimonial .text {
        width: 40%;
        padding: 0 5% 0 2%;
    }
}
@media (max-width: 768px) {
    .about-sections.testimonial .image,
    .about-sections.testimonial .text {
        width: auto;
        display: block;
        padding: 0;
    }
}

/* New header section 2017 */
.intro {
    width: 100%;
    min-height: 90vh;
    overflow: hidden;
    background-position: center center;
    background-repeat: no-repeat;
    margin: 0 auto;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    position: relative;
}
    .intro .text {
        min-height: 85vh;
        margin: 0 auto;
        width: 980px;
        color: #FFF;
    }
        .intro .text .welcome-message {
            padding: 3.5em 0;
            width: 40%;
        }
        .intro.dark-text .text .welcome-message {
            color: #333;
        }
        .intro .text .welcome-message .mob { display: none; }
            .intro.home .text .welcome-message h1 {
                font-family: "Lato", sans-serif;
                font-style: italic;
            }
            .intro .text .welcome-message p {
                font-size: 18px;
                max-width: 95%;
            }
                .intro .text .welcome-message p a {
                    font-size: 18px;
                }
                .intro .text .welcome-message h2 a {
                    font-size: 1em;
                    color: #FFF;
                }
            .intro .text .welcome-message p.scroll-down {
                text-align: center;
                margin-top: 2em;
            }
                .intro .text .welcome-message p.scroll-down a {
                    font-size: 32px;
                    text-decoration: none;
                    padding-bottom: 30px;
                    background: url('../img/down_arrow.png');
                    background-repeat: no-repeat;
                    background-position: center bottom;
                }
.clients_image {
    text-align: center;
    margin: 0 auto 1em;
    padding: 0 1em;
}
.clients_image img {
    margin: 0 auto;
    max-width: 100%;
}

@media (max-width: 980px) and (min-width: 769px) {
    .intro .text {
        width: 768px;
    }
        .intro .text .welcome-message {
            padding: 1em 0 2em 2em;
            width: 43%;
        }
        .intro .text .welcome-message h1 {
            font-size: 26px;
        }
        .intro .text .welcome-message p,
        .intro .text .welcome-message p a {
            font-size: 12px;
        }
        .intro .text .welcome-message p.scroll-down a {
            font-size: 22px;
        }
}
@media (max-width: 768px) {
    .intro .text {
        width: auto;
        max-width: 480px;
        margin: 0 auto;
        min-height: 700px;
    }
    .intro .text .welcome-message {
        width: auto;
        padding: 160px 2em 2em;
    }
        .intro .text .welcome-message .main { display: none; }
        .intro .text .welcome-message .mob {
            display: block;
        }
            .intro .text .welcome-message p {
                font-size: 18px;
            }
}
@media (max-width: 480px) {
    .intro .text .welcome-message {
        padding: 3em 2em;
    }
}

/* YOUR EVENT 2017 */
section.your-event-section.center-text {
    background: none;
    margin: 0 auto;
    padding: 2em 15%;
}
section.your-event-section h2 {
    text-align: center;
    margin-bottom: 1em;
}
section.your-event-section h2,
section.your-event-section p {
    color: #333;
}
    section.your-event-section .images {
        display: table;
        border-collapse: separate;
        border-spacing: 1em;
    }
    section.your-event-section .one img {
        float: right;
        margin: 0 0 2em 2em;
        max-width: 50%;
    }
    section.your-event-section .even,
    section.your-event-section .odd {
        display: table-cell;
        vertical-align: top;
        padding: 0;
    }
    section.your-event-section .odd {
        width: 33.3%;
    }
    section.your-event-section .even {
        width: 50%;
    }
        section.your-event-section h3,
        section.your-event-section h4 {
            margin-bottom: 0;
        }
        section.your-event-section h3 a,
        section.your-event-section h4 a {
            font-size: inherit;
            font-family: inherit;
            color: inherit;
            text-decoration: inherit;
        }
@media (max-width: 768px) {
    section.your-event-section.center-text {
        padding: 2em;
    }
    section.your-event-section .one img {
        margin: 1em 0;
        float: none;
        max-width: 100%;
    }
    section.your-event-section .even,
    section.your-event-section .odd,
    section.your-event-section .even:nth-child(even),
    section.your-event-section .odd:nth-of-type(3n+0) {
        display: block;
        width: auto;
        margin: 1em 0 1.5em;
        height: auto;
    }
}
/* WEDDING */
.intro.wedding-packages {
    background-position: top center;
}
    .intro.wedding-packages .subtitle {
        position: absolute;
        bottom: 2em;
    }
    .intro.wedding-packages .text img {
        max-width: 90%;
        height: auto;
    }
.center-text blockquote {
    background: url("../img/Quote.png") 20px 20px no-repeat #1e89af;
    color: #FFF;
    padding: 1em 2em 1em 8em;
    border-radius: 3em .5em;
}
@media (max-width: 768px) {
    .intro.wedding-packages {
        background-position: top -10%;
    }
        .intro.wedding-packages .subtitle {
            font-size: 10px;
        }
}

/* CORPORATE */
.intro.corporate-event .text {
    position: relative;
    min-height: 700px;
}
.intro.corporate-event .welcome-message {
    position: absolute;
    bottom: 0;
    left: 2em;
    padding: 2em 0;
}
.intro .corporate-clients {
    padding: 2em;
    text-align: right;
    position: absolute;
    bottom: 0; right: 0;
    width: 50%;
}
    .intro .corporate-clients div {
        max-width: 70px;
        float: right;
    }
    .intro .corporate-clients div img {
        max-width: 100%;
        height: auto;
    }
@media (max-width: 980px) {
    .intro.corporate-event .text {
        height: 350px;
    }
    .intro .corporate-clients div {
        max-width: 14%;
    }
}
@media (max-width: 768px) {
    .intro.corporate-event {
        background-position: top center;
    }
    .intro.corporate-event .welcome-message {
        position: static;
        width: auto;
        margin: 75% 0 0 0;
        padding: 1em;
        background: url("../img/black-mask.png");
    }
    .intro .corporate-clients {
        text-align: left;
        padding: 1em 2em 3em;
        left: 0;
        width: auto;
    }
    .intro .corporate-clients div {
        float: left;
    }
}

/* Store */

.paypal-cart {
    width: 107px;
    margin: 0 auto;
}
.merch {
    padding-top: 2em;
}
.merch h2 {
    text-align: center;
    margin-top: 1.5em;
}
.merch .item {
    display: inline-block;
    zoom: 1;
    *display: inline;
    vertical-align: top;
    width: 24%;
    margin: 0 4% 1em;
    text-align: center;
}
    .merch .item h3 {
        font-family: 'Josefin Sans', sans-serif;
        margin: 0;
    }
        .merch .item .sub {
            font-size: 0.7em;
            margin: 0 0 1em;
        }
        .merch .item .img {
            width: 100%;
            height: auto;
        }
        .merch .item p.price {
            margin: 0.5em 0;
            font-size: 1.2em;
        }
        .merch .item .paypal {
            margin-top: 1em;
        }
.main.store h1 {
    text-align: center;
}
.sidebar.store h2 {
    font-family: "Lato", sans-serif;
    font-size: 20px;
}
.main.store h3 a,
.main.store h3 a:visited {
    color: #222;
}

@media (max-width: 980px) {
    .merch .item {
        width: 43%;
        margin: 0 3%;
    }
}
@media (max-width: 768px) {
    .merch .item {
        width: 100%;
        margin: 0;
    }
}

.single-product .product-photo {
    float: left;
    width: 45%;
    margin: 1em 2em 1em 0;
}
    .single-product .product-photo img {
        width: 100%;
        height: auto;
    }
@media (max-width: 480px) {
    .single-product .product-photo {
        width: 25%;
        margin: 1em 2em 1em 0;
    }
}


/* 2019 Lineups */
.alternatebands {
    margin-bottom: 1em;
}
.alternatebands .alternateband {
    display:inline; float: left; width: 30%; margin: 0.5em 1.5%;
}
.alternatebands .alternateband .details {
    background: #015c5e;
    padding: 1em;
    color: #FFF;
}
.alternatebands .alternateband .details h3 { text-transform: uppercase; }
.alternatebands .alternateband .details h3,
.alternatebands .alternateband .details a,
.alternatebands .alternateband .details p { text-decoration: none; color: #FFF; margin: 0; }
@media (max-width: 768px) 
{
    .alternatebands .alternateband .details h3 { font-size: 18px; }
    .alternatebands .alternateband {
        display:block; float: none; width: 97%;
    }
}

/* 2021 Lineups */
.lineup-navsection {
    padding: 0;
    margin: 0 auto;
}
.lineup-navsection .sectionwrap {
    padding: 2em 0;
    margin: 0;
}
.lineup-navsection h2 {
    font-size: 30px;
}
.lineup-navsection .sectionwrap h2 {
    margin: 0;
}

.lineup-navsection .text-columns {
    padding: 0 2em;
}

#lineup-section-about {
    font-size: 18px;
}
#lineup-section-about p,
#lineup-section-about a,
#lineup-section-about li,
#lineup-section-about input,
#lineup-section-about textarea {
    font-size: inherit;
}
#lineup-section-reviews .quotes .quote {
    width: 31%;
    margin: 2em 1%;
    padding: 110px 0 0 0;
    float: left;
    display: inline-block;
    position: relative;
}
    #lineup-section-reviews .quotes .quote .img {
        position: absolute;
        top: 0;
        left: 50%;
        transform: translate(-50%, 0);
        border-radius: 50%;
        border: 5px solid #FFF;
        width: 150px;
        height: 150px;
        text-align: center;
        overflow: hidden;
    }
        #lineup-section-reviews .quotes .quote .img img {
            max-width: 150px;
            height: auto;
            margin: 0 auto;
            display: block;
        }
        #lineup-section-reviews .quotes .quote .img img.quotemark {
            width: 75px;
            height: 75px;
            margin: 37.5px auto;
        }
    #lineup-section-reviews .quotes .quote .content {
        background-color: #1e89af;
        padding: 50px 1em 1em;
        color: #FFF;
    }
        #lineup-section-reviews .quotes .quote .content p,
        #lineup-section-reviews .quotes .quote .content a {
            font-size: 20px;
        }
        #lineup-section-reviews .quotes .quote .content hr {
            width: 70%;
        }
        #lineup-section-reviews .quotes .quote .content h3,
        #lineup-section-reviews .quotes .quote .content .desc p,
        #lineup-section-reviews .quotes .quote .content .desc a {
            margin: 0;
            font-size: 18px;
        }
    #lineup-section-reviews p.more {
        text-align: center;
    }

@media (max-width: 980px) {
    #lineup-section-reviews .quotes .quote .content p,
    #lineup-section-reviews .quotes .quote .content a {
        font-size: 18px;
    }
    #lineup-section-reviews .quotes .quote .content h3,
    #lineup-section-reviews .quotes .quote .content .desc p,
    #lineup-section-reviews .quotes .quote .content .desc a {
        font-size: 14px;
    }
}
@media (max-width: 768px) 
{
    #lineup-section-reviews .quotes .quote {
        float: none;
        display: block;
        width: 98%;
    }
}


#lineup-section-gallery ul,
#lineup-section-gallery li {
    list-style: none;
    list-style-type: none;
}
#lineup-section-gallery ul {
    margin: 2em auto;
    padding: 0;
}
#lineup-section-repertoire.blank {
    padding: 0;
}
#lineup-section-repertoire .text-columns {
    max-height: 300px;
    overflow: hidden;
    position: relative;

}
.text-columns.rep:before {
  content:'';
  width:100%;
  height:100%;    
  position:absolute;
  left:0;
  top:0;
  background:linear-gradient(transparent 150px, white);
}
.blue-alt-sections section:nth-child(odd) .text-columns.rep:before {
  background:linear-gradient(transparent 150px, #e5f3f4);
}
    #lineup-section-repertoire .text-columns.rep.open {
        max-height: none;
    }
    .text-columns.rep.open:before,
    .blue-alt-sections section:nth-child(odd) .text-columns.rep.open:before {
        background: none;
    }
#lineup-section-repertoire .seemore {
    text-align: center;
}

section.lineup-extras-2021 {
    padding: 2em 0;
}
.lineup-extras-2021 ul,
.lineup-extras-2021 li {
    list-style-image: none;
    list-style: none;
    padding: 0;
    margin: 0;
}
    .lineup-extras-2021 .carousel {
        position: relative;
        margin: 2em auto;
        padding: 1em;
    }
    .blue-alt-sections section:nth-child(odd).lineup-extras-2021 .carousel {
      background: #FFF;
    }
    .blue-alt-sections section:nth-child(even).lineup-extras-2021 .carousel {
      background: #e5f3f4;
    }
        .lineup-extras-2021 ul {
            overflow-x: auto; 
            overflow-y: hidden;
            white-space: nowrap;
        }
        .lineup-extras-2021 li {
            display: inline-block;
            height: 400px;
            width: 35%;
            margin: 1em 0.5em;
            padding: 1.5em 1em;
            vertical-align: top;
            background-color: #1e89af;
            color: #FFF;
        }
            .lineup-extras-2021 li img {
                opacity: 90%;
                transition: opacity 0.2s;
                -webkit-transition: opacity 0.2s; /* For Safari 3.1 to 6.0 */
            }
                .lineup-extras-2021 li:hover img {
                    opacity: 100%;
                }
            .lineup-extras-2021 li .content {
                white-space: normal;
            }
                .lineup-extras-2021 li h4 {
                    font-family: "Lato", sans-serif;
                    margin: 1.2em 0 6px;
                }
                    .lineup-extras-2021 li h4 a {
                        color: #FFF;
                        text-decoration: none;
                        font-size: 1.2em;
                    }
                        .lineup-extras-2021 li h4 a:hover {
                            text-decoration: underline;
                        }


    .lineup-extras-2021 a.ctrls {
        position: absolute;
        height: 60px; width: 60px;
        background: url("../img/lightbox/arrows.png") top left no-repeat;
        background-position: 0 0;
        top: 40%;
        display: none;
    }
        .lineup-extras-2021 a.ctrls.show {
            display: block;
        }
        .lineup-extras-2021 a.ctrls.left {
            left: 0;
            background-position: 0 -60px;
        }
        .lineup-extras-2021 a.ctrls.right {
            right: 0;
        }

@media (max-width: 768px) {
    .lineup-extras-2021 li {
        display: inline-block;
        height: auto;
        width: 75%;
    }
    .lineup-extras-2021 a.ctrls.show {
        display: none;
    }
}


/* ==========================================================================
   Helper classes
   ========================================================================== */

/*
 * Image replacement
 */

.ir {
    background-color: transparent;
    border: 0;
    overflow: hidden;
    /* IE 6/7 fallback */
    *text-indent: -9999px;
}

.ir:before {
    content: "";
    display: block;
    width: 0;
    height: 150%;
}

/*
 * Hide from both screenreaders and browsers: h5bp.com/u
 */

.hidden {
    display: none !important;
    visibility: hidden;
}

/*
 * 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;
}

/*
 * Hide visually and from screenreaders, but maintain layout
 */

.invisible {
    visibility: hidden;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */

.clearfix:before,
.clearfix:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.clearfix:after {
    clear: both;
}

/*
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */

.clearfix {
    *zoom: 1;
}

/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   These examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */

@media only screen and (min-width: 35em) {
    /* Style adjustments for viewports that meet the condition */
}

@media print,
       (-o-min-device-pixel-ratio: 5/4),
       (-webkit-min-device-pixel-ratio: 1.25),
       (min-resolution: 120dpi) {
    /* Style adjustments for high resolution devices */
}

/* ==========================================================================
   Print styles.
   Inlined to avoid required HTTP connection: h5bp.com/r
   ========================================================================== */

@media print {
    * {
        background: transparent !important;
        color: #000 !important; /* Black prints faster: h5bp.com/s */
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

    a[href]:after {
        content: " (" attr(href) ")";
    }

    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    /*
     * Don't show links for images, or javascript/internal links
     */

    .ir a:after,
    a[href^="javascript:"]:after,
    a[href^="#"]:after {
        content: "";
    }

    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    thead {
        display: table-header-group; /* h5bp.com/t */
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    @page {
        margin: 0.5cm;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }
}