@-webkit-keyframes move {
  0% {
    background-position: 0 0; }
  100% {
    background-position: 50px 50px; } }

@-moz-keyframes move {
  0% {
    background-position: 0 0; }
  100% {
    background-position: 50px 50px; } }

@-ms-keyframes move {
  0% {
    background-position: 0 0; }
  100% {
    background-position: 50px 50px; } }

@-webkit-keyframes move {
  0% {
    background-position: 0 0; }
  100% {
    background-position: 50px 50px; } }

header ul.social li.youtube a {
  background: #FF0000; }

img.mobile {
  display: none; }

@media screen and (max-width: 1200px) {
  html, body {
    min-width: auto;
    width: 100%;
    max-width: 100%;
    background: #FFFFFF; }
    html *, body * {
      -webkit-box-sizing: border-box;
      box-sizing: border-box; }
    html h1, html h2, html h3, html h4, html h5, html h6, html a, html strong, html span, body h1, body h2, body h3, body h4, body h5, body h6, body a, body strong, body span {
      line-height: 1em; }
    html ul#products * li, body ul#products * li {
      display: block; }
    html h1, body h1 {
      font-size: 32px !important;
      line-height: 1em; }
  span.darkblue,
  span.lightblue,
  span.bend,
  span.top,
  span.bottom {
    display: none !important; }
    span.darkblue + strong,
    span.lightblue + strong,
    span.bend + strong,
    span.top + strong,
    span.bottom + strong {
      color: #FFFFFF !important;
      background: #01abe8;
      padding: 10px; } }

@media screen and (max-width: 1200px) and (max-width: 500px) {
  div.menu h3 {
    font-size: 140%; }
  div.menu ul li button.buttonLink,
  div.menu ul li a {
    font-size: 0.8em; }
  div.pagination {
    font-size: 70%; } }

.mobNavigation > .mm-navbar {
  border-bottom: none; }

.mobNavigation .mm-panels .mm-navbar {
  border-bottom: none; }
  .mobNavigation .mm-panels .mm-navbar .mm-title {
    display: none !important; }

.mobNavigation #mm-0,
.mobNavigation .mm-current {
  padding-top: 0; }

.mobNavigation .mm-listview li:not(:first-child):not(:last-child) i {
  display: none; }

.mobNavigation li:last-child {
  text-align: left; }
  .mobNavigation li:last-child a {
    display: inline-block;
    padding: 5px;
    font-size: 2em; }

.mobNavigation a.facebook {
  color: #00235d; }

.mobNavigation a.youtube {
  color: #FF0000; }

.mobNavigation a.mail {
  color: #ff9933; }

div.burger {
  position: absolute;
  top: 0;
  right: 0;
  height: 40px;
  width: 40px;
  margin-top: 30px;
  margin-right: 30px;
  background: #002054;
  cursor: pointer;
  z-index: 100;
  display: none; }
  @media screen and (max-width: 1200px) {
    div.burger {
      display: block; } }
  @media screen and (max-width: 720px) {
    div.burger {
      margin-top: 20px;
      margin-right: 20px; } }
  div.burger div.bun {
    background: #FFFFFF;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    height: 3px;
    width: 70%;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px; }
    div.burger div.bun::before, div.burger div.bun::after {
      content: "";
      display: block;
      position: absolute;
      width: 100%;
      height: 3px;
      background: inherit;
      -webkit-border-radius: 20px;
      -moz-border-radius: 20px;
      border-radius: 20px; }
    div.burger div.bun::before {
      bottom: calc(100% + 5px); }
    div.burger div.bun::after {
      top: calc(100% + 5px); }

@media screen and (max-width: 1200px) {
  navigation {
    display: none !important; }
  header img.mobile {
    display: block; }
  header img.desktop,
  header img.logotext {
    display: none; }
  header div.row div.three.cols.banner {
    width: 100%;
    margin-left: 0; }
    header div.row div.three.cols.banner img#brandingtext {
      margin-top: 20px; }
  header div.row div.six.cols {
    width: auto; }
    header div.row div.six.cols ul.social {
      display: none; }
  header div.row div.three.cols {
    display: block;
    position: relative;
    margin-left: 20px;
    width: auto; }
    header div.row div.three.cols div.basketbanner {
      font-size: 1.5em;
      padding: 0;
      margin-top: 10px;
      float: left;
      margin-bottom: 0; }
      header div.row div.three.cols div.basketbanner a {
        background: #ff9933;
        float: left;
        display: block; }
      header div.row div.three.cols div.basketbanner strong {
        background: #ff9933 !important;
        padding: 10px;
        font-size: 24px; }
    header div.row div.three.cols span.phone {
      color: #002054;
      font-size: 24px;
      display: block;
      position: relative;
      float: left;
      padding: 10px;
      margin-top: 10px; }
  div.row {
    width: 96%; } }

@media screen and (max-width: 1200px) and (max-width: 720px) {
  img#brandingtext {
    width: 400px; }
  header div.row div.three.cols {
    margin-left: 20px; } }

@media screen and (max-width: 1200px) and (max-width: 720px) and (max-width: 550px) {
  div.basketbanner strong {
    font-size: 70% !important; }
  span.phone {
    font-size: 100% !important; }
  img#brandingtext {
    width: 250px; }
  header div.row div.three.cols:not(.banner) {
    margin-left: 10px; } }

@media screen and (max-width: 1200px) and (max-width: 720px) and (max-width: 550px) and (max-width: 490px) {
  header div.row div.three.cols:not(.banner) {
    margin-top: 10px; } }

@media screen and (max-width: 1200px) and (max-width: 720px) and (max-width: 550px) and (max-width: 490px) and (max-width: 400px) {
  img#brandingtext {
    width: 220px; } }

@media screen and (max-width: 1200px) {
  footer span.top,
  footer span.bend,
  footer span.lightblue,
  footer span.darkblue {
    display: none; }
  footer div.footerlinks {
    margin-bottom: 10px; } }

@media screen and (max-width: 1200px) and (max-width: 950px) {
  footer div.row div.three.cols {
    padding-left: 0;
    padding-right: 0;
    display: block;
    width: 50%; }
    footer div.row div.three.cols img {
      margin-top: 0;
      display: block;
      float: right;
      width: 200px;
      margin-right: 20px; } }
  @media screen and (max-width: 1200px) and (max-width: 950px) and (max-width: 500px) {
    footer div.row div.three.cols {
      width: 100%;
      height: auto;
      padding: 20px; }
      footer div.row div.three.cols ul {
        margin-left: 0; }
      footer div.row div.three.cols img {
        float: left;
        width: 100px; }
      footer div.row div.three.cols h6, footer div.row div.three.cols ul, footer div.row div.three.cols img {
        margin-left: 0; } }

@media screen and (max-width: 720px) {
  section#breadcrumbs div.pagetitle .title {
    width: 100%;
    padding: 0; }
  section#breadcrumbs h1 {
    width: 100%;
    color: #FFFFFF;
    padding: 10px;
    background: #01abe8; } }

section#banner div#prev,
section#banner div#next {
  display: none; }

section#banner span.rightcurve,
section#banner span.leftcurve {
  pointer-events: none; }

@media screen and (max-width: 900px) {
  section#banner span.rightcurve,
  section#banner span.leftcurve {
    display: none; }
  section#banner ul {
    height: auto; }
    section#banner ul li {
      height: auto;
      width: 100%; }
      section#banner ul li div.desc.tuff {
        position: relative;
        width: 100%;
        height: 100%;
        top: 0;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        border-radius: 0;
        border: 1px solid #01abe8;
        border-top: none;
        background: transparent !important; }
        section#banner ul li div.desc.tuff > a {
          background-color: inherit !important;
          position: relative;
          display: block;
          width: 100px;
          display: none; }
          section#banner ul li div.desc.tuff > a img {
            position: relative;
            display: block;
            width: 100%; }
        section#banner ul li div.desc.tuff span {
          display: block;
          position: relative;
          width: 100%;
          top: auto;
          bottom: 0;
          padding: 5px;
          padding-bottom: 20px;
          left: 0;
          margin-left: auto;
          text-align: center; }
          section#banner ul li div.desc.tuff span p {
            font-size: 90%;
            color: black; }
          section#banner ul li div.desc.tuff span a {
            display: inline-block;
            position: relative;
            font-size: 100%;
            width: auto; }
      section#banner ul li a.bannerimage {
        position: relative;
        display: block;
        float: left;
        width: 100%;
        height: auto; }
        section#banner ul li a.bannerimage > img {
          width: 100%; } }

@media screen and (max-width: 900px) and (max-width: 650px) {
  section#banner button.flickity-prev-next-button {
    width: 30px;
    height: 30px; }
  section#banner ul li {
    width: 100%;
    background-color: transparent; }
    section#banner ul li div.desc.tuff {
      background-color: transparent !important;
      width: 100%;
      display: block;
      position: relative;
      float: left; }
      section#banner ul li div.desc.tuff > a img {
        width: 100px;
        display: none; }
      section#banner ul li div.desc.tuff span {
        background: rgba(255, 255, 255, 0.5); }
        section#banner ul li div.desc.tuff span p {
          color: black; }
    section#banner ul li a.bannerimage {
      width: 100%; }
      section#banner ul li a.bannerimage > div {
        width: 100% !important;
        float: left !important; } }

section#slider a#sliderprev,
section#slider a#slidernext {
  display: none; }

section#slider ul {
  width: auto;
  height: auto; }
  section#slider ul li:not(.dot) {
    width: 33%; }
  section#slider ul a {
    width: 100%;
    display: block;
    position: relative;
    text-align: center; }
  section#slider ul div.bannerleft {
    float: none;
    width: 80%;
    margin: 10px auto;
    padding: 0;
    margin-left: auto; }
    section#slider ul div.bannerleft span.top,
    section#slider ul div.bannerleft span.bottom,
    section#slider ul div.bannerleft span.bend {
      display: none; }
    section#slider ul div.bannerleft strong {
      background: #01abe8;
      padding: 12px;
      width: 100%;
      text-align: center;
      line-height: 100%; }
  section#slider ul li p {
    width: 100%;
    margin: 10px auto;
    padding: 0 30px;
    text-align: center; }

section#slider .flickity-prev-next-button.next {
  right: 0;
  background: rgba(255, 255, 255, 0.5);
  left: 100%;
  top: 50%; }

section#slider .flickity-prev-next-button.previous {
  left: auto;
  background: rgba(255, 255, 255, 0.5);
  right: 100%; }

@media screen and (max-width: 1320px) {
  section#slider .flickity-prev-next-button.previous {
    right: 95%; }
  section#slider .flickity-prev-next-button.next {
    left: 95%; }
  section#slider ul li:not(.dot) {
    width: 50%;
    text-align: center; }
    section#slider ul li:not(.dot) img {
      max-width: 90%; }
  section#slider a#sliderprev {
    left: 0;
    z-index: 100; }
  section#slider a#slidernext {
    right: 0;
    z-index: 100; } }

@media screen and (max-width: 1320px) and (max-width: 700px) {
  section#slider ul li:not(.dot) {
    width: 100%;
    font-size: 80%; }
  section#slider .flickity-prev-next-button {
    width: 30px;
    height: 30px; }
    section#slider .flickity-prev-next-button.previous {
      right: 90%; }
    section#slider .flickity-prev-next-button.next {
      left: 90%; } }

@media screen and (max-width: 1200px) {
  section#homecontent {
    padding: 0 10px; }
    section#homecontent .bannerright {
      padding-bottom: 0; }
      section#homecontent .bannerright strong {
        display: block;
        padding: 20px;
        color: #FFFFFF;
        background: #01abe8;
        width: 100%; }
    section#homecontent div.list > div {
      margin-top: 0; } }
  @media screen and (max-width: 1200px) and (max-width: 720px) {
    section#homecontent div.trikebuilder,
    section#homecontent div.list {
      width: 100%; }
      section#homecontent div.trikebuilder div,
      section#homecontent div.list div {
        width: 100%;
        float: left; } }

section#content div.contact img {
  max-width: 50px; }

@media screen and (max-width: 1200px) {
  section#content div.contact {
    height: auto !important;
    padding: 30px 0;
    border-bottom: 1px solid #01abe8; }
  section#content iframe {
    width: 100% !important; } }

@media screen and (max-width: 1200px) and (max-width: 720px) {
  section#content img {
    width: 100%; }
  section#content div.content,
  section#content div.menu {
    width: 100%;
    margin-top: 0; }
  section#content ul li {
    padding-left: 30px; }
  section#content div.contact {
    margin-right: 0;
    width: 50%; } }
  @media screen and (max-width: 1200px) and (max-width: 720px) and (max-width: 500px) {
    section#content div.contact {
      width: 100%; } }

@media screen and (max-width: 1200px) {
  section#accessories div.menu,
  section#accessories div.nine {
    width: 100%; }
  section#accessories div.accessory {
    padding: 20px;
    width: 48%;
    border: 2px solid #01abe8; }
    section#accessories div.accessory div.accPrice {
      display: block;
      position: relative;
      clear: both; } }

@media screen and (max-width: 1200px) and (max-width: 720px) {
  section#accessories div.accessory {
    width: 100%; } }

@media screen and (max-width: 1200px) and (max-width: 720px) and (max-width: 500px) {
  section#accessories div.accessory div.accPicture {
    width: 100%;
    margin: 0 auto;
    margin-bottom: 20px; } }

@media screen and (max-width: 1200px) {
  section#products div.six.cols {
    display: block;
    padding: 10px;
    width: 100%;
    font-size: 90%;
    border: 2px solid #01abe8; }
    section#products div.six.cols a {
      display: block; }
    section#products div.six.cols strong {
      display: block;
      float: right; } }
    @media screen and (max-width: 1200px) and (max-width: 500px) {
      section#products div.six.cols strong span {
        font-size: 120%; } }

@media screen and (max-width: 1200px) {
    section#products div.six.cols div.bannerright {
      padding-top: 0;
      bottom: 0;
      position: absolute;
      bottom: 0;
      right: 0; } }
    @media screen and (max-width: 1200px) and (max-width: 700px) {
      section#products div.six.cols div.bannerright {
        position: relative;
        bottom: auto;
        right: auto; } }

@media screen and (max-width: 1200px) {
      section#products div.six.cols div.bannerright strong {
        color: #FFFFFF;
        padding: 20px;
        background: #01abe8; }
        section#products div.six.cols div.bannerright strong span {
          font-size: 100%; } }

@media screen and (max-width: 1200px) and (max-width: 500px) {
  section#products div.six.cols .details {
    width: 100%;
    margin-bottom: 20px; }
    section#products div.six.cols .details *, section#products div.six.cols .details {
      text-align: left !important;
      float: left;
      width: 100%; }
  section#products div.six.cols h2,
  section#products div.six.cols p,
  section#products div.six.cols p.specs {
    display: block;
    float: left;
    width: 100%; }
  section#products div.six.cols h2 {
    margin-bottom: 10px; }
  section#products div.six.cols div.bannerright {
    padding-right: 0;
    padding-bottom: 0; } }

section#product div.trikebuilder img {
  max-width: 100%; }

@media screen and (max-width: 1200px) {
  section#product div.row div.six.cols.right,
  section#product div.row div.six.cols.left {
    width: 100%; }
    section#product div.row div.six.cols.right p span,
    section#product div.row div.six.cols.left p span {
      display: inline-block;
      line-height: 1.4em;
      background: #FFFFFF;
      font-weight: bold;
      color: #000000; } }

@media screen and (max-width: 1200px) and (max-width: 500px) {
  section#product div.left ul li:not(:first-child) {
    height: 80px !important; } }

@media screen and (max-width: 1200px) {
  section#product div.builderheader {
    height: auto; }
  section#product span.suitability {
    width: 100%;
    margin-bottom: 20px; }
  section#product div.specifications h3 {
    float: left; }
  section#product div.specifications div.row span.title,
  section#product div.specifications div.row span.value {
    float: left; }
  section#product div.specifications div.row span.value {
    padding-left: 40px; } }

@media screen and (max-width: 1200px) and (max-width: 720px) {
  section#product div.specifications div.row span.title,
  section#product div.specifications div.row span.value {
    width: 100%;
    padding-left: 0; }
  section#product div.specifications div.row span.title {
    margin: 10px 0;
    color: grey; } }

@media screen and (max-width: 1200px) {
  section#product div.faq h3 {
    float: left;
    margin-bottom: 10px; }
  section#product div.related ul li {
    margin-bottom: 20px; } }
  @media screen and (max-width: 1200px) and (max-width: 720px) {
    section#product div.related ul li {
      width: 48%; } }
  @media screen and (max-width: 1200px) and (max-width: 720px) and (max-width: 500px) {
    section#product div.related ul li {
      width: 98%; } }

@media screen and (max-width: 1200px) {
  section#trikebuilder div.builder,
  section#trikebuilder div.option {
    width: 100%; }
  section#trikebuilder .builderheader {
    height: auto; }
    section#trikebuilder .builderheader img {
      width: auto;
      max-width: 96%; }
  section#trikebuilder div.builder ul#runningtotal {
    width: 100%; }
    section#trikebuilder div.builder ul#runningtotal li.total + li {
      padding-top: 0; }
  section#trikebuilder div.option h4 {
    width: 100%; }
  section#trikebuilder div.option .optionrow .stage span.radio {
    padding: 2px 0; }
  section#trikebuilder div.option div.colorholder {
    width: 33%; }
    section#trikebuilder div.option div.colorholder div.control {
      margin-top: 20px; }
  section#trikebuilder div.option a#morecolours span {
    float: left;
    padding-left: 10px; }
  section#trikebuilder div.option div.basketbanner {
    padding-top: 30px; }
  section#trikebuilder div.option div.nextprev {
    margin: 0;
    padding: 0;
    margin-top: 10px;
    padding-top: 10px;
    width: 96%; }
    section#trikebuilder div.option div.nextprev button {
      float: right;
      width: auto;
      padding: 0 5px;
      margin: 0;
      font-size: 120%; }
      section#trikebuilder div.option div.nextprev button:first-child {
        padding-right: 0; } }

@media screen and (max-width: 1200px) and (max-width: 720px) {
  section#trikebuilder .optionrow .stage {
    width: 100%; }
    section#trikebuilder .optionrow .stage input[type=radio],
    section#trikebuilder .optionrow .stage input[type=checkbox] {
      width: 15px;
      height: 15px; } }

form#frmEnquiry {
  display: block;
  position: relative;
  float: left;
  width: 100%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }
  form#frmEnquiry .six.cols {
    width: 100%; }
  form#frmEnquiry label {
    text-align: left;
    width: 100px; }
  form#frmEnquiry input,
  form#frmEnquiry select,
  form#frmEnquiry textarea {
    width: 50%; }
  form#frmEnquiry div.submit {
    max-width: 100%; }
    form#frmEnquiry div.submit input[type="submit"] {
      width: 100%; }
  form#frmEnquiry select {
    cursor: pointer; }
  @media screen and (max-width: 1200px) {
    form#frmEnquiry input[type="submit"] {
      padding: 12px !important; } }

@media screen and (max-width: 1200px) and (max-width: 1000px) {
  form#frmEnquiry label,
  form#frmEnquiry input,
  form#frmEnquiry textarea,
  form#frmEnquiry select {
    display: block;
    position: relative;
    float: left;
    width: 100%; }
  form#frmEnquiry label {
    padding-top: 20px;
    padding-bottom: 8px; } }

@media screen and (max-width: 1200px) and (max-width: 1000px) and (max-width: 500px) {
  form#frmEnquiry div.submit {
    float: left; }
    form#frmEnquiry div.submit input[type="submit"] {
      font-size: 75%; } }

@media screen and (max-width: 1200px) {
  section#blog div.content,
  section#blog div.menu {
    display: block;
    position: relative;
    width: 100%;
    margin-top: 0; }
    section#blog div.content div.bloglisting *, section#blog div.content div.bloglisting,
    section#blog div.menu div.bloglisting *,
    section#blog div.menu div.bloglisting {
      display: block;
      position: relative;
      float: left;
      width: 100%; } }