/* Generated by Font Squirrel (http://www.fontsquirrel.com) on July 22, 2015 */
@font-face {
  font-family: 'open_sanslight';
  src: url(../../dist/opensans-light-webfont.9e4024166b48d3349a7d7b916e5f2261.eot);
  src: url(../../dist/opensans-light-webfont.9e4024166b48d3349a7d7b916e5f2261.eot?#iefix) format("embedded-opentype"), url(../../dist/opensans-light-webfont.252282ec61896ecd88215eabf0011533.woff2) format("woff2"), url(../../dist/opensans-light-webfont.b1713fd7cde3eb1cae611646f2ed7063.woff) format("woff"), url(../../dist/opensans-light-webfont.f6bc6f1c57c6d42c537c26c630af71e2.ttf) format("truetype"), url(../../dist/opensans-light-webfont.aba049e25755f0030d3c8a0a754bb71e.svg#open_sanslight) format("svg");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'open_sanslight_italic';
  src: url(../../dist/opensans-lightitalic-webfont.6c35b243460b7cfe77a34e343c799b8e.eot);
  src: url(../../dist/opensans-lightitalic-webfont.6c35b243460b7cfe77a34e343c799b8e.eot?#iefix) format("embedded-opentype"), url(../../dist/opensans-lightitalic-webfont.1e52aa473b2b1282237f7e77abc153a9.woff2) format("woff2"), url(../../dist/opensans-lightitalic-webfont.ca361617961cdffc6911576e2dd88c6f.woff) format("woff"), url(../../dist/opensans-lightitalic-webfont.b21b8de881f737100520342ad5317338.ttf) format("truetype"), url(../../dist/opensans-lightitalic-webfont.f8ba251126493fd9be199e97c5a6f101.svg#open_sanslight_italic) format("svg");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'open_sansregular';
  src: url(../../dist/opensans-regular-webfont.0c80387c9752472ac447754301cf8e4e.eot);
  src: url(../../dist/opensans-regular-webfont.0c80387c9752472ac447754301cf8e4e.eot?#iefix) format("embedded-opentype"), url(../../dist/opensans-regular-webfont.5ed7a7262ab20e4724404416bcb4afb3.woff2) format("woff2"), url(../../dist/opensans-regular-webfont.9577c0759c88aa2b462da457f798537b.woff) format("woff"), url(../../dist/opensans-regular-webfont.585616a2e93a4c61ffa39e55cb33f283.ttf) format("truetype"), url(../../dist/opensans-regular-webfont.f9859eda03c0e1af12e148ed2a194e72.svg#open_sansregular) format("svg");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'open_sanssemibold';
  src: url(../../dist/opensans-semibold-webfont.fc53f17ba847b31fe83080090989cb21.eot);
  src: url(../../dist/opensans-semibold-webfont.fc53f17ba847b31fe83080090989cb21.eot?#iefix) format("embedded-opentype"), url(../../dist/opensans-semibold-webfont.33ce5b69bee44158dce219832d20e74f.woff2) format("woff2"), url(../../dist/opensans-semibold-webfont.37d826f6dbd34ecfcb85ee238c4e013d.woff) format("woff"), url(../../dist/opensans-semibold-webfont.d2cf620ca133808cfef7904eb8fcc7c2.ttf) format("truetype"), url(../../dist/opensans-semibold-webfont.cc3e491b223ac819c3792679bc4c772c.svg#open_sanssemibold) format("svg");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'AlternateGotNo1D';
  src: url(../../dist/2BD4F8_0_0.9ec98caf940b24f0efd215beea28f7bc.woff) format("woff"); }

header {
  position: relative;
  z-index: 10;
  color: white;
  overflow: hidden; }
  header p {
    color: white; }
  header.home {
    height: 100vh; }
  header .inner {
    display: flex;
    flex-direction: row;
    align-items: center;
    height: 100%; }
    header .inner > div {
      flex: 1 1 0px;
      container-type: inline-size; }
    @media (max-width: 499px) {
      header .inner {
        display: block; }
        header .inner #bannerLogo {
          top: 10px;
          right: 10px; } }
  header #bannerLogo {
    position: relative; }
    header #bannerLogo #bannerLogoInner {
      display: flex;
      flex-direction: column; }
      header #bannerLogo #bannerLogoInner .logo {
        align-self: flex-end;
        font-size: 5cqw; }
  header #welcomeText #welcomeTextInner {
    margin-left: 10px;
    padding-left: 10px;
    border-left: 2px solid white; }
  header #welcomeText .blurb {
    font-size: 10vh;
    font-family: "AlternateGotNo1D", "Impact", "sans-serif";
    line-height: 1em;
    margin-bottom: 10px; }
  header #welcomeText .text {
    margin: 0;
    width: 80%; }
    header #welcomeText .text p {
      font-size: 1em;
      font-weight: bold; }
    @media (max-height: 480px) {
      header #welcomeText .text {
        display: none; } }
  header #welcomeText .cta {
    white-space: nowrap; }
  @media (max-width: 499px) {
    header #welcomeText #welcomeTextInner {
      padding-left: 0;
      border: 0; }
    header #welcomeText .blurb {
      font-size: 7em; } }

* {
  padding: 0;
  margin: 0; }

body {
  font-family: "open_sanslight", "sans-serif"; }

img {
  height: auto;
  max-width: 100%;
  display: inline-block;
  vertical-align: middle; }

h2, #homeSplash .splashbox .text .title {
  color: #000;
  font-family: "AlternateGotNo1D", "Impact", "sans-serif";
  font-size: 3em;
  font-weight: normal;
  margin-top: 1em;
  margin-bottom: 0.2em; }
  h2:first-of-type, #homeSplash .splashbox .text .title:first-of-type {
    margin-top: 0; }

h3 {
  font-size: 1.2em;
  font-weight: bold;
  font-family: "open_sanslight", "sans-serif";
  margin: 1em 0; }

p {
  font-family: "open_sanslight", "sans-serif";
  color: #000;
  margin: 1em 0;
  font-size: 0.9em; }

ul li {
  font-family: "open_sanslight", "sans-serif";
  margin: 0.2em 2em;
  font-size: 0.9em; }

a {
  color: inherit;
  text-decoration: none; }
  article a {
    text-decoration: underline; }

span.notification {
  color: #a64452;
  font-family: open_sanssemibold;
  font-size: 1.5em;
  text-align: center !important;
  display: block;
  padding: 1em; }

span.bold {
  font-weight: bold; }

span.centered {
  text-align: center;
  display: block; }

span.cta {
  color: #a64452; }

section.copy {
  padding-top: 110px; }
  @media (max-width: 499px) {
    section.copy {
      padding-top: 0; } }

article {
  max-width: 800px;
  margin: 0 auto 100px auto;
  padding-left: 0.5em;
  padding-right: 0.5em; }
  article img {
    display: block;
    margin: auto; }
  article:after {
    content: '';
    display: block;
    clear: both; }

.infoButton {
  text-decoration: none;
  background-color: #999;
  padding: 0.5em 2em;
  margin-bottom: 0.5em;
  color: #fff;
  font-weight: bold;
  display: inline-block;
  border-radius: 0.3em;
  cursor: pointer; }
  .infoButton:hover {
    background-color: #333; }

.logo {
  font-weight: normal;
  display: block;
  height: 7em;
  width: 13.5em;
  font-family: "open_sansregular", "sans-serif";
  line-height: 1.5em;
  color: #fff;
  margin: 0; }
  .logo span {
    position: absolute; }
  .logo span.logoDot {
    background-color: #f40000;
    width: 4.1em;
    height: 4.1em;
    border-radius: 100%;
    background-image: url(../../dist/kanji.1567bc46b779198e433d42acb6864051.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain; }
  .logo span#southampton {
    font-size: 1em;
    line-height: 1em;
    top: 0;
    right: 2.4em; }
  .logo span#jitsu {
    font-family: "AlternateGotNo1D", "open_sansregular", "sans-serif";
    font-size: 4em;
    line-height: 0.3em;
    top: 0.59em;
    right: 0;
    text-transform: uppercase; }
  .logo span#club {
    font-size: 1em;
    line-height: 3.8em;
    top: 3em;
    right: 0; }

#backToHome {
  margin: 10px;
  display: none; }
  @media (max-width: 499px) {
    #backToHome {
      display: inline-block; } }

#topBar {
  position: fixed;
  height: 70px;
  width: 100%;
  background-color: #222;
  z-index: 20;
  color: white;
  overflow: hidden;
  transition: opacity 0.3s ease-out; }
  #topBar .inner {
    max-width: 75rem;
    margin-left: auto;
    margin-right: auto;
    padding: 0 0.5em; }
  #topBar #mainNavContainer {
    height: 100%;
    position: relative; }
  #topBar .logo {
    position: absolute;
    top: 10px;
    height: 60%;
    bottom: 0;
    margin: auto;
    font-size: 8px;
    cursor: pointer; }
    #topBar .logo span.logoDot {
      background-color: white; }
  #topBar.hidden:not(:hover) {
    overflow: hidden;
    opacity: 0.4; }
  #topBar .mainNavigation {
    height: 100%;
    margin: auto 0;
    padding: 0;
    position: absolute;
    right: 10px;
    top: 0; }
    #topBar .mainNavigation ul {
      height: 100%;
      margin: 0 auto; }
      #topBar .mainNavigation ul li {
        position: relative;
        display: inline-block;
        height: 100%;
        font-size: 18px;
        margin: 0; }
        #topBar .mainNavigation ul li a {
          display: block;
          position: relative;
          top: 50%;
          transform: translateY(-50%);
          margin: 0 30px; }
          @media (max-width: 899px) {
            #topBar .mainNavigation ul li a {
              margin: 0 10px; } }
  @media (max-width: 499px) {
    #topBar {
      display: none; } }

#banner {
  background-image: url("/images/home/hero.jpg");
  background-size: cover;
  background-position: center center;
  position: relative;
  overflow: hidden; }
  #banner #topvideo {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    overflow: hidden; }
  #banner:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-color: #000000;
    opacity: 0.6; }
  #banner #scrollIndicator {
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10;
    opacity: 0.6;
    width: 0;
    height: 0;
    border-left: 20px solid transparent;
    border-right: 20px solid transparent;
    border-top: 20px solid white; }

article.contact {
  display: flex;
  max-width: 75rem; }
  article.contact .contactLeft {
    width: 60%;
    margin-right: 20px; }
  article.contact .contactRight {
    width: 40%; }
  @media (max-width: 599px) {
    article.contact {
      display: block; }
      article.contact .contactLeft,
      article.contact .contactRight {
        width: 100%;
        margin: 0; }
      article.contact .contactRight {
        margin-top: 20px; } }
  article.contact form .form-section {
    margin-bottom: 5px; }
  article.contact form input[type="text"],
  article.contact form input[type="email"],
  article.contact form textarea {
    width: 100%;
    padding: 10px;
    margin-top: 5px;
    margin-bottom: 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
    font-family: inherit;
    resize: none; }
  article.contact form textarea {
    height: 150px; }
  article.contact form button {
    background-color: #d40000;
    color: #fff;
    padding: 10px 15px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    width: 100%; }
  article.contact form button:hover {
    background-color: #f40000; }

section.grey {
  background-color: #ccc; }

section > .inner, section.inner {
  max-width: 75rem;
  margin-left: auto;
  margin-right: auto;
  padding: 2em 0.5em; }

#findUs .map {
  width: 70%;
  height: 400px;
  float: left; }

#findUs .schedule {
  width: 28%;
  margin-left: 2%;
  float: left; }

#findUs:after {
  content: "";
  clear: both;
  display: block; }

#homeClubinfo {
  position: relative; }
  #homeClubinfo h2, #homeClubinfo #homeSplash .splashbox .text .title, #homeSplash .splashbox .text #homeClubinfo .title,
  #homeClubinfo p {
    color: white; }
  #homeClubinfo .inner .copy {
    margin-right: 45%; }
    #homeClubinfo .inner .copy p {
      font-size: 1em;
      line-height: 1.5em; }
    @media (max-width: 899px) {
      #homeClubinfo .inner .copy {
        margin-right: 30%; } }
  #homeClubinfo .cta {
    margin-top: 30px; }
  #homeClubinfo:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-image: url("/images/home/teaching.png");
    background-position: center top;
    background-repeat: no-repeat;
    z-index: -10;
    transform: scaleX(-1); }
  @media (max-width: 599px) {
    #homeClubinfo .inner .copy {
      margin-right: 0; } }

.theArt .copy {
  float: left;
  width: 58%;
  margin-right: 2%; }

.theArt .images {
  float: right;
  width: 40%; }
  .theArt .images img {
    display: block;
    max-width: 100%;
    margin-top: 10px;
    margin-bottom: 10px; }
    .theArt .images img.stretch {
      min-width: 100%; }

.theArt:after {
  content: "";
  clear: both;
  display: block; }

@media (max-width: 899px) {
  .theArt .copy,
  .theArt .images {
    float: none;
    width: 100%; } }

.staffProfiles {
  display: flex;
  flex-direction: row;
  text-align: center;
  justify-content: center; }
  .staffProfiles > .profile {
    flex: 1;
    padding: 10px 3%;
    vertical-align: top; }
    .staffProfiles > .profile img {
      width: 100%;
      border-radius: 50%;
      aspect-ratio: 1/1; }
  .staffProfiles.large .profile {
    max-width: 25%; }

.clubLineup {
  height: 500px;
  background: transparent url(../../dist/club-lineup-2022.c95c39d539a977d724257617009ac836.jpeg) no-repeat center 40%;
  position: relative;
  top: -50px;
  background-size: cover; }
  .clubLineup:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-color: #000000;
    opacity: 0.2; }
  @media (max-width: 499px) {
    .clubLineup {
      height: 300px;
      margin-bottom: 20px;
      position: initial; }
      .clubLineup:after {
        content: none; } }

.page-quote {
  width: 100%;
  margin-bottom: 1.5em;
  font-style: italic;
  font-weight: bold;
  text-align: center; }

.licence-form-cta {
  align-items: center;
  display: inline-flex;
  gap: 0.4em; }

.licence-form-cta__icon {
  width: 48px;
  height: 48px;
  vertical-align: middle; }

.licence-form-cta__text {
  line-height: 1; }

#home_news .newsWrap {
  display: flex;
  flex-direction: row;
  margin-bottom: 10px;
  gap: 20px; }
  @media (max-width: 599px) {
    #home_news .newsWrap {
      flex-direction: column; } }

#home_news .newsItemWrap {
  flex: 1 1 0px; }

#home_news .infoButton {
  float: right; }

#home_news:after {
  content: '';
  clear: both;
  display: block; }

#home_news .newsItem {
  width: 100%;
  height: 300px;
  overflow: hidden;
  background-image: url("/images/home/01.default.jpg");
  background-size: cover;
  background-position: top;
  cursor: pointer;
  position: relative; }

#home_news .newsItem:before {
  content: ' ';
  position: absolute;
  top: 0;
  left: 0;
  background-color: #222;
  z-index: 5;
  opacity: 0;
  width: 100%;
  height: 100%;
  -webkit-transition: all 0.1s ease-in-out;
  -moz-transition: all 0.1s ease-in-out;
  -o-transition: all 0.1s ease-in-out;
  transition: all 0.1s ease-in-out; }

#home_news .newsItem:hover:before {
  opacity: 0.5; }

#home_news .newsItem h3 {
  height: 50%;
  padding: 1em;
  background-image: linear-gradient(180deg, #222, transparent);
  color: #fff;
  z-index: 6;
  position: relative;
  margin: 0; }

#home_news .newsItem .date {
  position: relative;
  top: -1.3em;
  font-size: 0.9em;
  color: #444; }

img.float {
  padding: 20px; }
  @media (max-width: 499px) {
    img.float {
      float: none !important;
      padding: 0; } }
  img.float.floatRight {
    float: right; }
  img.float.floatLeft {
    float: left; }

#homeSplash .splashbox {
  float: left;
  display: table;
  height: 400px;
  width: 32%;
  margin-right: 2%;
  background-position: center;
  position: relative;
  color: #fff;
  text-align: center; }
  #homeSplash .splashbox .text {
    display: table-cell;
    z-index: 10;
    position: relative;
    padding: 2em;
    vertical-align: middle; }
    #homeSplash .splashbox .text .title {
      display: block;
      color: #fff; }
  #homeSplash .splashbox.strength {
    background-image: url("/images/home/strength.png"); }
  #homeSplash .splashbox.skill {
    background-image: url("/images/home/skill.png"); }
  #homeSplash .splashbox.spirit {
    background-image: url("/images/home/spirit.png"); }
  #homeSplash .splashbox:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-color: #000000;
    opacity: 0.6; }

#homeSplash .splashbox:last-of-type {
  margin-right: 0; }

#homeSplash:after {
  content: '';
  clear: both;
  display: block; }

@media (max-width: 599px) {
  #homeSplash .splashbox {
    height: 200px;
    width: 100%;
    float: none;
    margin: 0 0 0.5em 0; }
    #homeSplash .splashbox:last-of-type {
      margin-bottom: 0; } }

table.classes {
  table-layout: fixed;
  width: 100%;
  margin-top: 1em;
  border-collapse: collapse; }
  table.classes th,
  table.classes td {
    border: 1px solid #888; }
  table.classes th {
    background-color: #ccc;
    width: 1.5em; }
    table.classes th .text {
      writing-mode: vertical-lr;
      display: block;
      line-height: 1.5em; }
  table.classes td {
    padding: 1em; }
    table.classes td span {
      display: block;
      text-align: center;
      font-size: 0.9em;
      margin-bottom: 0.5em; }
      table.classes td span.title {
        font-weight: bold; }

/* Footer */
footer {
  overflow: hidden;
  background-color: #444;
  font-size: 0.8em;
  color: #fff;
  padding: 1em 0 4em 0; }
  footer p {
    color: #fff; }

footer h2, footer #homeSplash .splashbox .text .title, #homeSplash .splashbox .text footer .title {
  color: #ddd;
  font-size: 2em;
  font-family: 'AlternateGotNo1D'; }

footer a {
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-color: #aaa; }

footer ul {
  margin: 0.5em 0; }
  footer ul li {
    font-size: 1em; }

footer ul.links {
  list-style-type: none;
  margin: 0; }

footer ul.links li {
  margin: 0;
  margin-bottom: 1em; }

footer .social.links div {
  margin-bottom: 2em;
  text-align: center; }

footer .social.links img {
  width: 30px;
  margin-right: 0.5em; }

footer div.social.links div.fullwidth {
  width: 100%; }

footer div.social.links div.fullwidth img {
  width: auto; }

footer > div.row > div.column {
  margin-top: 1.4em;
  font-size: 0.8em; }

footer .inner.lower {
  display: grid;
  grid-template-columns: repeat(4, 1fr); }
  footer .inner.lower .useful-links > div {
    margin-bottom: 0.5em; }

@media (max-width: 599px) {
  footer .inner.lower {
    display: block;
    text-align: center; }
  footer .contact, footer .connect, footer .footerTjf, footer #findUs .map, footer #findUs .schedule {
    width: 100%;
    float: none;
    margin: 0 0 1em 0; } }

#pageCopyright {
  text-align: center;
  margin-top: 1em; }

.footerTjf {
  text-align: center; }

header.pageTopper {
  height: 20em;
  background: #ccc url("/images/bg.jpg") no-repeat center; }
  header.pageTopper:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-color: #000000;
    opacity: 0.6; }

