:root {
    --blue: #004777;
    --orange: #e86921;
    --cat-pose-green: #59ab7d;
    --cat-pose-yellow: #fdfd54;
}
/*

COUPLER

*/
/* Selection colours (easy to forget) */
::selection {
    background: rgb(254, 248, 214);
}
::-moz-selection {
    background: rgb(254, 248, 214);
}
img::selection {
    background: transparent;
}
img::-moz-selection {
    background: transparent;
}
body {
    -webkit-tap-highlight-color: rgb(254, 248, 214);
}

body {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: 500;
    font-size: 16px;
    line-height: 20px;
    background: #292824;
    min-width: 320px;
    padding-top: 60px;
}
@media screen and (max-width: 39.9375em) {
    body {
        padding-top: 0px;
    }
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: 700;
    -webkit-font-smoothing: antialiased;
    font-smoothing: antialiased;
    margin: 0;
    padding: 0;
    line-height: 1.4em;
}

.fullwidth {
    max-width: 100%;
}
.fullwidth [class*="block-grid-"] {
    margin-right: 0;
    margin-left: 0;
}
.flush-padding .columns {
    padding-left: 0;
    padding-right: 0;
}

.text-center {
    text-align: center;
}
.text-left {
    text-align: left;
}
.text-right {
    text-align: right;
}
.uppercase {
    text-transform: uppercase;
}
.bold,
.strong {
    font-weight: 900;
}
.small {
    font-size: 11px;
}
.serif {
    font-family: serif;
}
.smaller {
    font-size: 0.8rem;
}

.white {
    color: #fff;
}
.white-bg {
    background: #fff;
}
.cream {
    color: #f5ead8;
}
.cream-bg {
    background-color: #f5ead8;
}
.black {
    color: #00303e;
}
.black-bg {
    background-color: #000000;
}
.blackish {
    color: #292824;
}
.blackish-bg {
    background-color: #292824;
}
.grey-bg {
    background-color: #333335;
}
.green-bg {
    background-color: #78ffc5;
}
.cat-pose-green {
    color: var(--cat-pose-green);
}
.cat-pose-green-bg {
    background-color: var(--cat-pose-green);
}

.blue {
    color: var(--blue);
}
.blue-bg {
    background-color: var(--blue);
}
.red {
    color: #ed4b5b;
}
.red-bg {
    background-color: #ed4b5b;
}

.holly-bg {
    background-image: url("images/holly-bg.jpg");
    background-size: cover;
    background-position: center center;
}

.magenta {
    color: #f63a56;
}
.magenta-bg {
    background-color: #f63a56;
}

.hidden,
.is-hidden {
    display: none !important;
}
.letterspace {
    letter-spacing: 2px;
}
.letterspace-wide {
    letter-spacing: 1em;
}

.padding-small {
    padding: 1.5em;
}
.padding {
    padding: 3em;
}
.padding-large {
    padding: 5em;
}

.padding-top-small {
    padding-top: 1.5em;
}
.padding-top-xsmall {
    padding-top: 0.5em;
}
.padding-top-xxsmall {
    padding-top: 0.25em;
}
.padding-bottom-small {
    padding-bottom: 1.5em;
}
.padding-bottom-xsmall {
    padding-bottom: 0.5em;
}
.padding-bottom-xxsmall {
    padding-bottom: 0.25em;
}
.padding-top {
    padding-top: 3em;
}
.padding-bottom {
    padding-bottom: 3em;
}
.padding-top-large {
    padding-top: 5em;
}
.padding-bottom-large {
    padding-bottom: 5em;
}
.padding-bottom-none {
    padding-bottom: 0px !important;
}

.padding-left-xsmall {
    padding-left: 0.5em;
}
.padding-left-small {
    padding-left: 1.5em;
}
.padding-left {
    padding-left: 3em;
}
.padding-left-large {
    padding-left: 5em;
}

.padding-right-xsmall {
    padding-right: 0.5em;
}
.padding-right-small {
    padding-right: 1.5em;
}
.padding-right {
    padding-right: 3em;
}
.padding-right-large {
    padding-right: 5em;
}

.margin-top-none {
    margin-top: 0;
}
.margin-top-xsmall {
    margin-top: 0.5em;
}
.margin-top-small {
    margin-top: 1.5em;
}
.margin-bottom-small {
    margin-bottom: 1.5em;
}
.margin-top {
    margin-top: 3em;
}
.margin-bottom {
    margin-bottom: 3em;
}
.margin-top-large {
    margin-top: 5em;
}
.margin-bottom-large {
    margin-bottom: 5em;
}

.offset {
    position: relative;
    top: -40px;
}
.offset-large {
    margin-top: -200px;
    position: relative;
    z-index: 1000;
}

.fullpage {
    height: 80vh;
}

.relative {
    position: relative;
}
.topmost {
    z-index: 100;
}
.widescreen {
    height: 0;
    position: relative;
    padding-top: 56.25%;
}
.widescreen iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

a,
a:active {
    color: var(--orange);
    text-decoration: none;
}
a:hover {
    text-decoration: underline;
}

.vertical-center {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* tOOLS */
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
.border {
    border: 10px solid #023240;
}
.border-thick {
    border: 12px solid #023240;
}
.border-thin {
    border: 5px solid #023240;
}
.border-bottom {
    border-bottom: 1px solid #023240;
}
.border-black {
    border-color: #023240;
}
.border-left {
    border-left: 1px solid #023240;
}
.border-right {
    border-left: 1px solid #023240;
}

.button {
    display: inline-block;
    background-color: var(--orange);
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 16px;
    font-family: sans-serif;
    padding: 5px 30px;
    border: 1px solid var(--orange);
    border-radius: 4px;
}

.button:hover,
.button.hover {
    color: #fff;
    background: #000;
    border: 1px solid #fff;
    text-decoration: none;
}
.button.magenta {
    background-color: #f63a56;
    color: #f4e9da;
    border: 1px solid #f63a56;
}
.button.magenta:hover {
    color: #fff;
}
.button.cat-pose-green-bg {
    background: var(--cat-pose-green);
    border: 1px solid var(--cat-pose-green);
}
.button.cat-pose-green-bg:hover {
    background: #fff;
    color: var(--cat-pose-green);
    border: 1px solid var(--cat-pose-green);
}
.dropshadow {
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8);
}
/*    Tablet Layout:   */
@media only screen and (min-width: 40.063em) and (max-width: 64em) {
    body {
    }
}
/*    Mobile Layout:   */
@media only screen and (max-width: 40em) {
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -  */
/* HEADER */
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -  */

.navbar {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background-color: #4980b3;
    border-bottom: 1px solid rgba(255, 255, 255, 0.6);
    color: #fff;
    z-index: 100;
}
.navbar h1 {
    line-height: 1;
    font-size: 24px;
    max-width: 100px;
    display: inline-block;
}
.navbar h1 a {
    display: block;
    max-width: 200px;
    font-size: 20px;
    font-weight: normal;
    color: #fff;
    margin: 0 auto;
    padding: 0;
    line-height: 1;
}
.navbar h1 a img {
    width: 100%;
    height: auto;
}
.navbar nav {
    display: inline-block;
    margin-left: 20px;
}

.navbar nav a {
    text-transform: uppercase;
    font-weight: bold;
    color: #fff;
    font-size: 13px;
    display: inline-block;
    padding: 20px 10px;
}
.navbar nav a:hover {
    opacity: 0.5;
}
.navbar .social {
    padding-top: 10px;
}
.navbar .social a {
    display: inline-block;
    text-align: center;
    padding: 8px;
    margin-left: 10px;
    background: rgba(0, 0, 0, 0.3);
    width: 40px;
    height: 40px;
    border-radius: 20px;
}
.navbar .social a:hover {
    background: rgba(0, 0, 0, 1);
    color: #fff !important;
}

/* NAV ISH */
input#control-nav {
    visibility: hidden;
    position: absolute;
    left: -9999px;
    opacity: 0;
}
label.control-nav {
    /* label icon */
    display: block;
    font-size: 24px;
    top: 0px;
    right: 20px;
    position: absolute;
}
label.control-nav:hover {
    cursor: pointer;
}
label.control-nav:before {
    content: "";
    display: block;
    height: 3px;
}
.control-nav-close {
    display: none;
}

input#control-nav:checked ~ .mobile-nav-menu-container .control-nav-open {
    display: none;
}
input#control-nav:checked ~ .mobile-nav-menu-container .control-nav-close {
    display: inline-block;
}

input#control-nav:checked ~ .mobile-menu-container {
    display: block;
}
body.menu-open {
    overflow: hidden;
}

.mobile-menu-container {
    position: fixed;
    top: 65px;
    left: 0;
    width: 100%;
    height: calc(100% - 65px);
    background: rgba(0, 71, 119, 0.4);
    display: none;
    z-index: 1500;
}
.navbar.fixed .mobile-menu-container {
    top: 53px;
    height: calc(100% - 53px);
}
.mobile-menu-container .mobile-menu-options {
    position: absolute;
    width: 100%;
    height: auto;
    top: 50%;
    left: 0;
    transform: translate(0, -50%);
    font-size: 30px;
}

/*    Tablet Layout: 768px.  */
@media only screen and (min-width: 40.063em) and (max-width: 64em) {
    .navbar .social a {
        font-size: 12px;
        width: 30px;
        height: 30px;
        margin-left: 5px;
        padding: 6px;
    }
}
/*    Mobile Layout: 320px.  */
@media only screen and (max-width: 40em) {
    .navbar {
        height: auto;
        position: relative;
    }
    .navbar h1 {
        max-width: 100px;
        padding-top: 0;
    }
    .navbar nav {
        text-align: center;
        display: inline-block;
        margin: 20px 0 10px 0;
    }
    .mobile-menu-container {
        backdrop-filter: blur(10px);
    }
    .mobile-menu-container .mobile-menu-options a {
        display: block;
        color: #fff;
        padding: 1rem 1rem;
    }
}

.embed {
    position: relative;
    height: 0;
    padding-bottom: 56.25%;
}
.embed iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.featured-block {
    height: 90vh;
    position: relative;
}
.featured-block .bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    z-index: 0;
}
.featured-block .feature-content-container {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    max-width: 80%;
    z-index: 1;
}
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -  */
/* COUPLER */
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -  */
.cover-art {
    margin-top: -198px;
}

.logo.coupler {
    text-indent: -9999px;
    background: url("images/coupler--logo--2020.png") no-repeat center center;
    height: 80px;
    background-size: contain;
}
.logo.coupler.dark {
    background: url("images/coupler-logo--2020--dark.png") no-repeat center
        center;
    height: 80px;
    background-size: contain;
    text-indent: -9999px;
}

@media only screen and (min-width: 40.063em) and (max-width: 64em) {
}
@media only screen and (max-width: 40em) {
    .cover-art {
        margin-top: -10px;
    }
}

.kompakt {
    display: inline-block;
    max-width: 120px;
}

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
/*  RELEASES    */
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
.cat-pose-bg {
    background-color: var(--cat-pose-yellow);
}
.cat-pose-bg .album-title {
    font-size: 3rem;
}
.cat-pose-bg .askew {
    -moz-transform: rotate(-2deg);
    -webkit-transform: rotate(-2deg);
    -o-transform: rotate(-2deg);
    -ms-transform: rotate(-2deg);
    transform: rotate(-2deg);
}

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
/*  Mailing List */
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
.cimp {
    margin-top: 4em;
}
.cimp h2 {
    font-size: 16px;
    margin-bottom: 10px;
}
.cimp form {
    display: block;
    position: relative;
    width: 320px;
    margin: 0 auto;
    text-align: left;
}
.cimp label {
    display: none;
    color: #fff;
    clear: both;
    border-left: none;
}
.cimp input[type="email"] {
    font-size: 16px;
    -webkit-appearance: none;
    border: none;
    padding: 12px;
    width: 320px;
    border-radius: 4px;
    text-align: left;
}
.cimp input[type="submit"] {
    position: absolute;
    right: 5px;
    top: 5px;
}
.cimp .positivity {
    margin-top: 10px;
}
@media only screen and (min-width: 40.063em) and (max-width: 64em) {
}
@media only screen and (max-width: 40em) {
}

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
/*  DISCOG   */
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
.discog {
}
.discog h3 {
    line-height: 1.2em;
    padding-bottom: 6px;
}
.discog .button {
    font-size: 13px;
}

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
/*  INSIGHT   */
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

@media only screen and (max-width: 40em) {
    .band h2.scour {
        font-size: 14px;
    }
}

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
/*  BAND   */
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
.band {
    position: relative;
    z-index: 2;
    margin-bottom: 0px;
}
.band .photo-holder {
    min-height: 760px;
    position: relative;
}
.band .photo-holder .columns {
    position: relative;
}
.band .photo {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    min-height: 760px;
    background-repeat: no-repeat;
    background-position: top center;
    background-size: cover;
}

@media only screen and (min-width: 40.063em) and (max-width: 64em) {
}

@media only screen and (max-width: 40em) {
    .band {
        top: 0px;
    }
    .band .photo-holder {
        min-height: 400px;
    }
    .band .photo {
        background-size: cover;
        background-position: top center;
        min-height: 400px;
    }
    .band hgroup {
    }
    .band .top-image {
        height: 400px;
    }
}

.video-feature {
    margin-top: -300px;
    margin-bottom: -100px;
}
@media only screen and (min-width: 40.063em) and (max-width: 64em) {
}
@media only screen and (max-width: 40em) {
    .video-feature {
        margin-top: -100px;
        margin-bottom: -100px;
    }
}
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
/*  SHOWS   */
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
.live h3 {
    font-weight: bold;
    color: #fff;
    opacity: 0.5;
    text-transform: uppercase;
    padding-bottom: 20px;
}
.showdates {
    color: #fff;
}
.event-with {
    opacity: 0.6;
}

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
/*  RHYTHM METHOD   */
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
.main {
    min-height: 85vh;
    position: relative;
    background-size: contain;
    background-position: top center;
    overflow: hidden;
}
.main hgroup.text-center {
    height: 85vh;
}
/* Small only */
@media screen and (max-width: 39.9375em) {
    .main {
        min-height: 50vh;
    }
    .main hgroup.text-center {
        height: 50vh;
    }
}
.top {
    z-index: 99;
}
.topmost {
    z-index: 100;
}
.blend-multiply {
    mix-blend-mode: multiply;
}
.blend-screen {
    mix-blend-mode: screen;
}
.rm-texture {
    opacity: 1;
}
.bg-image {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
}
.bg-image.offset-top {
    top: 2em;
}
.bg-image video {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    min-width: 100%;
    min-height: 100%;
}
.tracklisting {
    padding: 0;
    margin: 0;
    list-style-type: none;
    font-size: 1.2rem;
}
.tracklisting li {
    position: relative;
}
.tracklisting .time {
    float: right;
    background: rgba(0, 0, 0, 0.1);
    -webkit-border-radius: 3px;
    border-radius: 3px;
    font-size: 0.8rem;
    padding: 3px 6px;
}

.dragnet {
    height: 90vh;
    min-height: 800px;
    position: relative;
}
.dragnet .video-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.dragnet .video-bg iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
}
.dragnet .title {
    position: absolute;
    width: 600px;
    height: auto;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}
.dragnet-girl--bg {
    background: url("images/dragnet-girl--bg.jpg") no-repeat center center;
    background-size: cover;
}
@media only screen and (max-width: 40em) {
    .dragnet {
        height: 50vh;
        min-height: 400px;
        margin-top: 0;
    }
    .dragnet .video-bg iframe {
        display: none;
    }
    .dragnet .title {
        width: 80%;
    }
}
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
/*  FOOTEr   */
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
footer {
}
footer a {
    color: #1b9703;
    font-size: 18px;
}
footer a img {
    width: 120px;
    height: auto;
}

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
/*  FOOTEr   */
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
.fourohfour {
}

.c6-thumper-background {
    background-image: url("images/coupler--c6-thumper-recog--background.jpg");
    background-size: cover;
}
