/*! 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
   ========================================================================== */

















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

html, body {
  min-width: 300px;
  margin: 0; }

html {
  font-size: 62.5%; }

.lt-ie9 html, .lt-ie9 body {
  min-width: 960px; }

body, a, h1, h2, h3, blockquote {
  font-family: "Proxima Nova","Montserrat", "Open Sans","Gill Sans MT","Gill Sans",Corbel,Arial,sans-serif;
  -webkit-font-smoothing: antialiased; }

section, footer, header {
  width: 100%;
  display: block;
  padding: 1.5em 0; }
  section.featured-video, footer.featured-video, header.featured-video {
    padding: 0;
    line-height: 0; }
  section .content, footer .content, header .content {
    width: 100%;
    max-width: 1020px;
    margin: 0 auto;
    clear: both;
    position: relative; }
    section .content h2, footer .content h2, header .content h2, .vimeography-thumbnail-container h2 {
      margin-top: 0;
      text-transform: uppercase;
      text-align: center;
      width: 100%;
      font-weight: 500;
      font-size: 32px;
      font-size: 3.2rem;
      letter-spacing: 0.2em; }
    .vimeography-thumbnail-container h2
    {
      color: #fff;
      display: none;
    }
    #showreel:target h2
    {
      display: block;
    }
    section .content .col-1, section .content .col-1-2, section .content .col-1-3, footer .content .col-1, footer .content .col-1-2, footer .content .col-1-3, header .content .col-1, header .content .col-1-2, header .content .col-1-3 {
      text-align: center;
      float: left;
      display: inline-block;
      vertical-align: top;
      padding: 0 1em;
      -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
      box-sizing: border-box; }
      section .content .col-1.no-pad, section .content .col-1-2.no-pad, section .content .col-1-3.no-pad, footer .content .col-1.no-pad, footer .content .col-1-2.no-pad, footer .content .col-1-3.no-pad, header .content .col-1.no-pad, header .content .col-1-2.no-pad, header .content .col-1-3.no-pad {
        padding: 0; }
      section .content .col-1 img, section .content .col-1-2 img, section .content .col-1-3 img, footer .content .col-1 img, footer .content .col-1-2 img, footer .content .col-1-3 img, header .content .col-1 img, header .content .col-1-2 img, header .content .col-1-3 img {
        width: 100%;
        height: auto; }
        section .content .col-1 img.keep-max, section .content .col-1-2 img.keep-max, section .content .col-1-3 img.keep-max, footer .content .col-1 img.keep-max, footer .content .col-1-2 img.keep-max, footer .content .col-1-3 img.keep-max, header .content .col-1 img.keep-max, header .content .col-1-2 img.keep-max, header .content .col-1-3 img.keep-max {
          width: auto; }
      section .content .col-1 p:first-child, section .content .col-1-2 p:first-child, section .content .col-1-3 p:first-child, footer .content .col-1 p:first-child, footer .content .col-1-2 p:first-child, footer .content .col-1-3 p:first-child, header .content .col-1 p:first-child, header .content .col-1-2 p:first-child, header .content .col-1-3 p:first-child {
        margin-top: 0; }
    section .content .row + .row, footer .content .row + .row, header .content .row + .row {
      padding-top: 1em; }
    section .content > blockquote, footer .content > blockquote, header .content > blockquote {
      margin: 0;
      text-align: center;
      width: 100%;
      font-size: 32px;
      font-size: 3.2rem;
      letter-spacing: 0.05em;
      line-height: 1.2em; }
      section .content > blockquote span, footer .content > blockquote span, header .content > blockquote span {
        display: block;
        padding: 0 1em; }
    section .content p, footer .content p, header .content p {
      font-weight: 500;
      font-size: 17.6px;
      font-size: 1.76rem;
      letter-spacing: 0.075em;
      line-height: 1.4em;
      text-align: left; }
    section .content a, section .content a:hover, footer .content a, footer .content a:hover, header .content a, header .content a:hover {
      text-decoration: none;
      -webkit-transition: color 0.1s linear;
      -moz-transition: color 0.1s linear;
      -ms-transition: color 0.1s linear;
      -o-transition: color 0.1s linear;
      transition: color 0.1s linear; }
  section.dark p, footer.dark p, header.dark p {
    color: white; }
  section.light p, footer.light p, header.light p {
    color: black;
    color: #040404; }
  section.dark a, section.dark h2, section.dark blockquote, section.light a, section.light h2, section.light blockquote, footer.dark a, footer.dark h2, footer.dark blockquote, footer.light a, footer.light h2, footer.light blockquote, header.dark a, header.dark h2, header.dark blockquote, header.light a, header.light h2, header.light blockquote {
    color: #e72a59; }
  section.dark, footer.dark, header.dark {
    background-color: black;
    background-color: #040404; }
    section.dark a:hover, footer.dark a:hover, header.dark a:hover {
      color: white; }
  section.light, footer.light, header.light {
    background-color: white; }
    section.light a:hover, footer.light a:hover, header.light a:hover {
      color: #040404; }
  section.colour, footer.colour, header.colour {
    background-color: #e72a59; }
    section.colour h2, section.colour blockquote, section.colour p, footer.colour h2, footer.colour blockquote, footer.colour p, header.colour h2, header.colour blockquote, header.colour p {
      color: white; }
    section.colour a, footer.colour a, header.colour a {
      color: black;
      color: #040404; }
      section.colour a:hover, footer.colour a:hover, header.colour a:hover {
        color: white; }

.col-1 {
  max-width: 1020px;
  width: 100%; }

.col-1-2 {
  width: 50%;
  max-width: 510px; }

.col-1-3 {
  width: 33%;
  width: 33.33333333%;
  max-width: 340px; }

.colour {
  color: #e72a59; }

header {
  position: relative; }
  header .logo {
    position: absolute;
    top: 0;
    left: 12px;
    width: 300px;
    height: 152px;
    font-size: 0;
    z-index: 100;
    background: url(../RMS/img/logo.png) 50% 50% no-repeat transparent;
    background-size: 100% 100%; }
  header .menu, header .sub-menu, header .mobile-menu {
    list-style: none;
    display: block;
    margin: 0;
    padding: 0;
    text-align: right; }
    header .menu li, header .sub-menu li, header .mobile-menu li {
      display: inline-block;
      letter-spacing: 0.05em; }
    header .menu li:last-child, header .menu li:last-child a, header .sub-menu li:last-child, header .sub-menu li:last-child a, header .mobile-menu li:last-child, header .mobile-menu li:last-child a {
      padding-right: 0; }
    header .menu a, header .sub-menu a, header .mobile-menu a {
      text-transform: uppercase; }
  header .menu a,
  header .mobile-menu a {
    font-size: 22.4px;
    font-size: 2.24rem;
    text-transform: uppercase;
    font-weight: 500;
    padding: 0.6em 0.3em;
    display: block;
    color: white; }
    header .menu a:hover,
    header .mobile-menu a:hover {
      color: #e72a59; }
  header .mobile-menu {
    display: none; }
  header .sub-menu li {
    font-size: 14.4px;
    font-size: 1.44rem;
    font-weight: 500;
    padding: 0 0.6em; }

.contact-details {
  list-style: none; }
  .contact-details li {
    color: white;
    text-transform: uppercase; }
    .contact-details li a {
      color: #e72a59; }
  footer .contact-details {
    margin: 0;
    padding: 0;
    text-align: left; }

footer .content {
  font-size: 20.8px;
  font-size: 2.08rem; }
  footer .content .col-1-2 {
    text-align: left; }
  footer .content, footer .content p {
    font-weight: 700;
    letter-spacing: 0.05em; }
  footer .content p {
    line-height: 1.2em; }

.scl-icon {
  width: 36px;
  height: 36px;
  display: inline-block;
  background: url(../RMS/img/sclicons.png) 0 0 no-repeat transparent;
  background-size: 72px 72px;
  text-indent: -9999px;
  font-size: 0;
  -webkit-transition: opacity 0.1s linear;
  -moz-transition: opacity 0.1s linear;
  -ms-transition: opacity 0.1s linear;
  -o-transition: opacity 0.1s linear;
  transition: opacity 0.1s linear; }
  .scl-icon:hover {
    opacity: 0.9; }
  .scl-icon.fb {
    background-position: 0 0; }
  .scl-icon.tw {
    background-position: 0 -36px; }
  .scl-icon.sc {
    background-position: -36px 0; }
  .scl-icon.vi {
    background-position: -36px -36px; }

.slide-nav {
  position: absolute;
  bottom: 24px;
  left: 50%;
  height: 17px;
  width: 300px;
  margin-left: -150px;
  cursor: default;
  text-align: center; }
  .row .slide-nav {
    bottom: 0;
    left: 0;
    position: relative;
    margin: 0.5em auto 0; }
  .slide-nav .arrow {
    background: url(../img/slide_nav.png) 0 0 no-repeat transparent;
    width: 56px;
    height: 17px;
    display: block;
    position: absolute;
    top: 0; }
    .slide-nav .arrow.left {
      left: 0;
      background-position: 0 0; }
      .slide-nav .arrow.left:hover {
        background-position: 0 -17px; }
    .slide-nav .arrow.right {
      right: 0;
      background-position: -17px 0; }
      .slide-nav .arrow.right:hover {
        background-position: -17px -17px; }
  .slide-nav .dot {
    width: 14px;
    height: 14px;
    margin: 3px 5px;
    display: inline-block;
    background-color: #666666;
    border-radius: 14px; }
    .slide-nav .dot:hover {
      background-color: white; }

.video-controls {
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -39px;
  margin-top: -34px;
  width: 50%; }
  .video-controls, .video-controls .play {
    height: 78px; }
  .video-controls .video-info {
    position: absolute;
    left: 110px;
    min-height: 78px;
    line-height: 1;
    text-align: left;
    -webkit-transition: opacity 0.3s ease-out;
    -moz-transition: opacity 0.3s ease-out;
    -ms-transition: opacity 0.3s ease-out;
    -o-transition: opacity 0.3s ease-out;
    transition: opacity 0.3s ease-out; }
    .video-controls .video-info div {
      font-size: 24px;
      font-size: 2.4rem;
      line-height: 1.2em;
      letter-spacing: 0;
      font-weight: 500; }
      .video-controls .video-info div.video-title, .video-controls .video-info div.video-type {
        color: white; }
      .video-controls .video-info div.video-client {
        color: #e72a59; }
  .video-controls .play {
    width: 68px;
    position: absolute;
    background: url(../img/play.png) 0 0 no-repeat transparent;
    left: 0;
    top: 0;
    opacity: 0.8;
    -webkit-transition: opacity 0.2s linear;
    -moz-transition: opacity 0.2s linear;
    -ms-transition: opacity 0.2s linear;
    -o-transition: opacity 0.2s linear;
    transition: opacity 0.2s linear; }
    .video-controls .play:hover {
      opacity: 1; }
    .video-controls .play:hover + .video-info {
      opacity: 0.0; }

@media only screen and (max-width: 960px) {
  html {
    font-size: 55%; }

  header .logo {
    width: 200px;
    height: 101px; } }
@media only screen and (max-width: 600px) {
  .col-1-2 + .col-1-2 {
    margin-top: 1em; }

  header .logo {
    width: 150px;
    height: 76px; } }
@media only screen and (max-width: 519px) {
  html {
    font-size: 60%; }


#radio-logo
{
  margin: 25px 0 !important;
}


  .col-1-2 {
    width: 100%;
    max-width: 640px; }

  section {
    padding: 1.5em;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box; }
    section .content p {
      font-weight: 400; }

  section .content .col-1-2 p:first-child {
    margin-top: 1em; }

  section.tag-line {
    display: none; }

  section .content p {
    font-size: 14.5px;
    font-size: 1.45rem;
    line-height: 20px;
    line-height: 2rem; }

  .scl-icons {
    margin: 0 auto;
    display: block; } }
@media only screen and (max-width: 600px) {
  header .logo {
    position: initial;
    z-index: 1000;
    margin: 0 auto;
    display: block;
    width: 320px;
    height: 162px;
    background-image: url(../RMS/img/mobile-logo.jpg);
    background-size: 320px 162px; }
  header .sub-menu {
    margin-top: 176px;
    text-align: center; }
    header .sub-menu li {
      font-size: 17px;
      font-size: 1.7rem; }
  header .menu {
    text-align: center; }
    header .menu li, header .menu li a {
      padding-right: 0;
      text-align: center;
      display: block; }
  header .menu li {
    margin: 0 1.5em; }
    header .menu li a {
      border-top: 2px solid #e72a59; }
    header .menu li:first-child a {
      margin-top: 5px;
      border-top: 0; }
    header .menu li:last-child a {
      margin-bottom: 5px; } }
@media only screen and (max-width: 480px) {
  .col-1-3 {
    width: 100%;
    max-width: 640px; }

  .col-1-3 + .col-1-3 {
    margin-top: 1em; }

  .showreel .content .row:nth-child(2) {
    display: none; }

  header .sub-menu li, footer .contact-details {
    font-size: 13px;
    font-size: 1.3rem; } }
@media only screen and (max-width: 320px) {
  header .logo {
    width: 100%;
    height: 0;
    padding-bottom: 50%;
    background-size: 100% 100%; } }

#radio
{
  background: url( ../RMS/img/radio-background.png ) 10% 100% no-repeat #000;
}

#radio-logo
{
  margin-top: 25%;
}

/*
  Main.css overrides
*/
::-moz-selection {
  background: #e72a59;
  text-shadow: none; }

::selection {
  background: #e72a59;
  color: white;
  text-shadow: none; }

.colour::selection, .colour h2::selection, .colour p::selection, .colour a::selection, .colour img::selection {
  background: white;
  color: #e72a59; }

#vimeography-gallery-2{
	background:#000;
}