Currently editing: 
/home/jagssportsclub/public_html/wp-content/themes/jags-sports-gym/style.css
 Encoding:   Switch to Code Editor    Save
/*
Theme Name: Jags Sports Gym
Theme URI: http://www.jagssportsclub.co.uk/
Author: Motion 12
Author URI: https://motion12.digital
Description: Twenty Seventeen brings your site to life with immersive featured images and subtle animations. With a focus on business sites, it features multiple sections on the front page as well as widgets, navigation and social menus, a logo, and more. Personalize its asymmetrical grid with a custom color scheme and showcase your multimedia content with post formats. Our default theme for 2017 works great in many languages, for any abilities, and on any device.
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: jags
Tags: one-column, two-columns, right-sidebar, flexible-header, accessibility-ready, custom-colors, custom-header, custom-menu, custom-logo, editor-style, featured-images, footer-widgets, post-formats, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready
*/

/* additional styles */
.booking-information.mobile {
    display: none !important;
}
.booking-information.desktop {
    display: block !important;
}
hr.mobile-hr {
    display: none;
}

.show-this-mobile {
    display: none;
}

.hide-this-mobile {
    display: block;
}

.animated-swimming-svg {
    width: 86%;
    overflow: hidden;
    z-index: -1;
    position: absolute;
    left: 80px;
    top: 136px;
}

.animated-climbing-svg {
    width: 85%;
    z-index: -1;
    position: absolute;
    top: 89px;
}

.animated-classes-svg {
    width: 105%;
    z-index: -1;
    position: absolute;
    top: 118px;
}

.border-split::after {
    content: "";
    height: 1px;
    display: block;
    width: 100%;
    background: #ffffff;
}

/* integration of custom fonts */
@font-face {
    font-family: "Flavin-Light";
    src: url("/app/themes/jags-sports-gym/assets/fonts/Flavin-LightWEB.woff") format('woff');
    font-weight: 300;
}

@font-face {
    font-family: "Flavin-Light";
    src: url("/app/themes/jags-sports-gym//app/themes/jags-sports-gym/assets/fonts/Flavin-LightWEB.woff2") format('woff2');
    font-weight: 300;
}

@font-face {
    font-family: "Flavin-Regular";
    src: url("/app/themes/jags-sports-gym/assets/fonts/Flavin-RegularWEB.woff") format('woff');
    font-weight: normal;
}

@font-face {
    font-family: "Flavin-Regular";
    src: url("/app/themes/jags-sports-gym//app/themes/jags-sports-gym/assets/fonts/Flavin-RegularWEB.woff2") format('woff2');
    font-weight: normal;
}

.custom-font-regular {
    font-family: "Flavin-Regular";
    font-weight: normal;
}

html {
    font-size: 1rem;
}

a,
a:hover {
    color: #000000;
}

a  u {
    color: #fff;
}

.flavin-light-font {
    font-family: "Flavin-Light";
}
.flavin-regular-font {
    font-family: "Flavin-Regular";
}

body{
    font-family: "Flavin-Light";
    color: #6b6666;
}

html, body, a:hover {
    text-decoration: none;
}

.z-indexp-top {
    z-index: 999999999;
}

p {
    line-height: 130%;
}



/* additional styles to override WordPress */
body.blog {
    background-color: #ef5b50;
}
body.single.single-post {
    background-color: #ef5b50;
    color: #ffffff;
}

/* additional paddings and margins */
.mt-12 {
    margin-top: 120px;
}

/* section styles */

.section-spacing-404 {
    margin-top: 25vh;
    margin-bottom: 25vh;
}

.section-spacing-404 a {
    color: #000000;
}

.section-spacing-404 a:hover {
    color: #000000;
}

.section-start-space {
    margin-top: 100px;
}

.inner-section-spacing {
    padding: 0px 0px;
}

/* brand-colours */
.soft-purple {
    color: #592750;
}
.pinkish-red-colour {
    color: #ef5b50;
    font-family: "Flavin-regular";
}
.light-purple {
    color: #AB0F8B;
}
.lightest-green {
    color: #1FFF1F;
}

.light-green {
    color: #1BD311;
}

.lighter-green {
    color: #1FFF1F;
}
.mid-shade-green {
    color: #1FFF1F;
}

.light-red {
    color: #F93A30;
}
.light-pink {
    color: #EF9A95;
}
.lighter-pink {
    color: #FFC9C9;
}
.main-red {
    color: #F93A30;
}
.light-brown {
    color: #5B400F;
}
.menu-gray {
    color: #808080;
}
.midnight-blue {
    color: #070B1E;
}
.soft-yellow {
    color: #FFC200;
}

.icon-side-panel.timetable {
    height: 130px;
    overflow: hidden;
}
/* timetables */
.timetables .icon-side-panel.climbing {
    display: none;
}
.timetables .icon-side-panel.classes {
    display: none;
}
.timetables .booking-information p {
    font-size: 1.4rem;
    opacity: 0.7;
}
.timetables .booking-information h2 {
    color: #ffffff;
    font-size: 1.3rem;
}
.timetables .booking-information p:hover {
    font-size: 1.4rem;
    opacity: 1;
    transition: opacity 0.3s ease;
    text-decoration: none;
}
.timetables .timetable-column-headers {
    position: relative;
    bottom: -20px;
    font-weight: 700;
}
.timetables .timetable-column-content {
    position: relative;
    top: 0px;
    margin-top: 10px;
    font-weight: 700;
}
.timetables .timetable-column-content .single-column-header {
    display: inline-block;
    color: #ffffff;
    font-size: 1.3rem;
}
.timetables .timetable-column-content .single-column-header:nth-child(1) {
    width: 25%;
}
.timetables .timetable-column-headers .single-column-header {
    display: inline-block;
    width: 25%;
    color: #ffffff;
    font-size: 1.5rem;
}
.timetables .timetable-dates ul {
    margin: 0;
    padding: 0;
}
.timetables .timetable-selector h2 a {
    color: #ffffff;
    font-size: 1.3rem;
    line-height: 100%;
    opacity: 0.3;
}
.timetables .timetable-selector h2 a:hover {
    opacity: 1;
    transition: opacity 0.3s ease;
    text-decoration: none;
}
.timetables .timetable-selector h2 a.active {
    opacity: 1;
}

a.view-virtual.collapse.view-classes.facilities-hover-animation {
    opacity: 0.3;
}
a.view-virtual.collapse.view-classes.facilities-hover-animation:hover {
    opacity: 1;
    transition: opacity 0.3s ease;
    text-decoration: none;
}
a.view-virtual.collapse.view-classes.facilities-hover-animation.active {
    opacity: 1;
}
a.view-virtual.collapse.view-classes.facilities-hover-animation:active {
    opacity: 1;
}
.timetables .timetable-selector h2 {
    margin-bottom: -5px;
    line-height: 100%;
}
.timetables .active-date a {
    font-size: 1.4rem;
    color: #ffffff;
    font-weight: 700;
}
.timetables .timetable-dates ul li:first-child {
    margin: 5px 0px;
}
.timetables .timetable-dates ul li {
    display: inline-block;
    color: #ffffff;
    margin: 5px 2px;
    font-size: 1.4rem;
}
.timetables .timetable-dates ul li a {
    color: #ffffff;
    opacity: 0.3;
}
.timetables .timetable-dates ul li a:hover {
    color: #ffffff;
    opacity: 1;
    transition: opacity 0.3s ease;
    text-decoration: none;
}
.timetables .timetable-dates ul li a.active {
    opacity: 1;
    font-weight: 700;
}

.timetables .toggle-dates a span {
    font-size: 1.8rem;
    color: #ffffff;
    opacity: 0.7;
}
.timetables .toggle-dates a span:hover {
    color: #ffffff;
    opacity: 1;
    transition: opacity 0.3s ease;
    text-decoration: none;
}
.timetables .toggle-dates a:hover {
    text-decoration: none;
}


.join-page-facilities {
    margin-top: -60px;
}

/* animation */
#accordion .panel-title i.glyphicon{
    -moz-transition: -moz-transform 0.5s ease-in-out;
    -o-transition: -o-transform 0.5s ease-in-out;
    -webkit-transition: -webkit-transform 0.5s ease-in-out;
    transition: transform 0.5s ease-in-out;
}


.position-icons {
    position: fixed; top: 300px;
    width: 20%;
    left: 80px;
}


.panel .panel-heading .panel-title span {
    float: right;
}

p.members-booking.main-red.mt-5:hover {
    text-decoration: underline;
}

.panel .panel-heading a[aria-expanded="true"] span {
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-transform-origin: 50% 40%;
    -moz-transform-origin: 50% 40%;
    -o-transform-origin: 50% 40%;
    transform-origin: 50% 40%;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

.panel .panel-heading a[aria-expanded="false"] span {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: 50% 40%;
    -moz-transform-origin: 50% 40%;
    -o-transform-origin: 50% 40%;
    transform-origin: 50% 40%;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

.panel img.animated-plus {
    width: 20px;
}
/* animate icons up */
.fa-plus:before {
    content: "\f067";
    font-weight: lighter !important;
    font-size: 18px;
}

.rotate-icon{
    -webkit-transform: rotate(-225deg);
    -moz-transform: rotate(-225deg);
    transform: rotate(-225deg);
}

.panel{
    border: 0px;
    border-bottom: 1px solid #ffffff;
}
.panel .panel-title a {
    transition: all 0.6s ease;
}
.panel.courses:hover .panel-heading .panel-title a {
    color: #F93A30;
    transition: all 0.6s ease;
}
.panel.classes:hover .panel-heading .panel-title a {
    color: #1FFF1F;
    transition: all 0.6s ease;
}
.panel.careers .panel-heading:hover .panel-title a {
    color: #FFC9C9 !important;
    transition: all 0.6s ease;
}

.panel.holiday-kids-club:hover .panel-heading .panel-title a {
    color: #FFC200;
    transition: all 0.6s ease;
}

.panel.weekend-for-kids:hover .panel-heading .panel-title a {
    color: #EF3756;
    transition: all 0.6s ease;
}
.panel.term-time-courses:hover .panel-heading .panel-title a {
    color: #AB0F8B;
    transition: all 0.6s ease;
}
.panel.kids-parties:hover .panel-heading .panel-title a {
    color: #FF06D0;
    transition: all 0.6s ease;
}
.panel.menu{
    border: 0px;
    border-bottom: 1px solid #5B400F;
}
.panel-group .panel+.panel{
    margin-top: 0px;
}
.panel-group .panel{
    border-radius: 0px;
}
.panel-heading{
    border-radius: 0px;
    color: white;
    padding: 15px 0px;
}
.panel-heading.panel-menu{
    border-radius: 0px;
    color: white;
    padding: 5px 0px;
}
.panel .panel-heading .panel-title a {
    color: #ffffff;
    text-transform: none;
}
.panel.courses .panel-heading .panel-title a:focus {
    color: #F93A30;
}
.panel.classes .panel-heading .panel-title a:focus {
    color: #1FFF1F;
}
.panel .panel-heading.panel-menu .panel-title a {
    color: #5B400F;
    text-transform: none;
}
.panel .panel-heading.panel-menu h4.panel-title {
    font-size: 1.1rem;
}
.panel .panel-heading h4.panel-title {
    font-size: 1.6rem;
    margin-bottom: -0.5rem;
}
.panel .panel-body p {
    font-size: 1.1rem;
    line-height: 1.3rem;
    font-family: "Flavin-Light";
    color: #ffffff;
}
.panel .panel-body p b {
    font-size: 1.3rem;
    font-family: "Flavin-Light";
}
.panel-custom>.panel-heading{
    background-color: transparent;
}

.fixme {
    text-align: center;
}

/* bootstrap padding & margin advancements */
.mt-6 {
    margin-top: 60px;
}
.mt-10 {
    margin-top: 100px;
}
.mt-negative-6 {
    margin-top: -60px;
}
.pr-10 {
    padding-right: 100px
}
.pr-8 {
    padding-right: 80px
}
.pl-12 {
    padding-left: 120px
}

/* button styles */
.btn-white-outline {
    color: #fff;
    background-color: transparent;
    border-color: #fff;
    border-radius: 0;
}
.btn-black-outline {
    color: #000;
    width: 110px;
    font-size: 1.4rem;
    background-color: transparent;
    border-color: #000;
    border-radius: 0;
}

.btn-black-outline:hover {
    background-color: #000000;
    color: #ffffff;
}

/* navigation */

/* sticky navigation */
/*sticky header position*/
.navbar {
    background-color: transparent;
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out
}
.navbar.background-white {
    background-color: #ffffff;
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}
.navbar-expand-lg .navbar-nav .nav-link {
    font-family: "Flavin-Regular";
    padding-right: 1.5rem;
    padding-left: 1.5rem;
}

.navbar-expand-lg .navbar-nav a.nav-link {
    color: #ffffff;
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out
}

a.nav-link.active {
    text-decoration: underline !important;
}

.navbar-expand-lg .navbar-nav a.nav-link.dark-text {
    color: #070B1E;
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out
}


.navbar-expand-lg .navbar-nav a.nav-link:hover {
    text-decoration: underline;
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out
}

.custom-toggler .navbar-toggler-icon {
    background-image: url(/app/themes/jags-sports-gym/"data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http:/www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255,255,255, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}

.custom-toggler.navbar-toggler {
    border-color: transparent;
}

.modal .custom-form .form-row .form-group {
    padding: 3px 0px 0px;
    font-size: 1rem;
}

/* custom form material design */
.custom-form .form-row .form-group {
    padding: 10px 0px 0px;
    font-size: 1.6rem;
    align-self: flex-end;
}

.custom-form .form-group {
    position: relative;
    padding-top: 15px;
    margin-bottom: 10px;
}

.custom-form .form-control {
    border: 0;
    border-radius: 0;
    padding: 0px 0px;
    background-color: transparent;
    position: relative;
    z-index: 2;
    font-size: 1rem;
}
.custom-form .form-control:not(textarea) {
    height: 35px;
}
.custom-form .form-control + label {
    position: absolute;
    z-index: 1;
    top: 25px;
    margin: 0;
    transition: all 0.2s ease-in-out;
    pointer-events: none;
    left: 0px;
    right: 0px;
}
.custom-form .form-control:focus {
    box-shadow: none;
    background-color: transparent;
}
.custom-form .form-control:focus + label {
    color: #000000;
}
.custom-form .form-control:focus + label, .form-control.has-value + label {
    font-size: 1rem;
    top: 0;
}

.no-js .form-control + label {
    font-size: 1rem;
    top: 0;
}

.custom-form .form-row .form-control + label {
    left: 0px;
    right: 0px;
}
.custom-form .form-row .line {
    left: 0px;
    right: 0px;
}

.custom-form .line {
    position: absolute;
    display: block;
    bottom: 0;
    left: 0;
    right: 0;
    height: 2px;
    background-color: #bcbcbc;
}
.custom-form .line:after {
    content: "";
    height: 2px;
    position: absolute;
    display: block;
    background: #000000;
    left: 0;
    right: 0;
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    transition: -webkit-transform 0.2s ease-in-out;
    transition: transform 0.2s ease-in-out;
    transition: transform 0.2s ease-in-out, -webkit-transform 0.2s ease-in-out;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
}

.custom-form .form-control:focus ~ .line:after {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
}

select.form-control:not([size]):not([multiple]) {
    height: 55px;
}

/* hero sections */

.masthead {
    height: 100vh;
    min-height: 500px;
    color: rgba(255, 255, 255, 1);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-color: #636578 !important;
}
.masthead h1 {
    font-size: 4rem;
    padding: 75px;
    font-family: "Flavin-Regular";
}
.masthead h4 {
    font-size: 2.5rem;
    padding: 75px;
    font-family: "Flavin-Regular";
}


.carousel-item {
    height: 100vh;
    min-height: 350px;
    background: no-repeat center center scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

/* homepage content */

section .animated-section {
    padding: 20px;
    height: 470px;
}
section .animated-section.copper-beach {
    background-color: rgba(232, 242, 219, 1);
    color: #5B400F;
}
section .animated-section.copper-beach img {
    width: 40%;
}
section .animated-section.news {
    background-color: rgba(239, 91, 80, 1);
    color: #592750;
}
section .animated-section.news img {
    width: 77%;
}
section .animated-term-time-courses {
    width: 77%;
}
section .animated-section.animated-image-rock-climbing img {
    width: 100%;
}

/* about */
.about-introduction-section h1 {
    font-size: 3rem;
    font-weight: 300;
}

.contact-body-content h1 {
    font-size: 2.5rem;
    font-weight: 300;
}
.contact-body-content .contact-call-to-action {
    margin-top: 0px;
}

.contact-body-content .contact-call-to-action a {
    opacity: 0.9;
    color: #ffffff;
}
.contact-body-content .contact-call-to-action a:hover {
    opacity: 1;
    transition: opacity 0.3s ease;
    text-decoration: none;
}

/* join Jags Sports Gym */
section .price-list {
    margin-top: 50px;
    padding: 0;

}
section .price-list .price-list-line-item {
    position: relative;
    border-bottom: 1px solid #808080;
    font-size: 1.3rem
}

/* kids */

#term-time-courses .panel .panel-body p {
    color: #ffffff;
}


section.holiday-kids-club {
    padding: 20px 0px;
    background-color: #FFC200;
}

section.weekends-for-kids {
    padding: 20px 0px;
    background-color: #EF3756;
}

section.term-time-courses {
    padding: 20px 0px;
    background-color: #AB0F8B;
}

section.kids-parties {
    padding: 20px 0px;
    background-color: #5F13A8;
}

.navigate-down-arrow img {
    width: 40px;
    margin-top: 30px;
}

ul.parties-navigation,
ul.parties-navigation  li {
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: 1.6rem;
    line-height: 125%;
}
ul.parties-navigation li a {
    color: #AB0F8B
}
ul.parties-navigation li a:hover {
    color: #ffffff;
    -webkit-transition: color 0.7s ease;
    -o-transition: color 0.7s ease;
    transition: color 0.7s ease;
}

#holiday-kids-club,
#weekend-for-kids,
#term-time-courses,
#kids-parties {
    display: none;
}

header {
    position: relative;
    background-color: black;
    height: 100vh;
    min-height: 25rem;
    width: 100%;
    overflow: hidden;
}

header video {
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: 0;
    -ms-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
}

header .container {
    position: relative;
    z-index: 2;
}

header .overlay {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-color: black;
    opacity: 0.5;
    z-index: 1;
}

/* contact */
.contact-lines {
    background-image: url("/app/themes/jags-sports-gym/assets/img/contact/offset-border.svg");
    background-size: 14%;
    background-repeat: no-repeat;
    background-position-x: 19%;
}

/* footer content */
footer {
    background-color: rgba(7, 11, 30, 1);
    color: #FFFFFF;
    padding-top: 45px;
    padding-bottom: 45px;
}
footer .form-group {
    width: 70%;
}
footer .form-control {
    display: block;
    width: 100%;
    height: calc(1.5em + .75rem + 2px);
    padding: 1.7rem .75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    background-color: transparent;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: 0rem;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}
footer .btn.btn-white-outline {
    padding: 0.95rem .75rem;
}
footer .btn.btn-white-outline:hover {
    background-color: #ffffff;
    color: rgba(7, 11, 30, 1);
    text-decoration: none;
    transition: color 0.7s ease;
    transition: background-color 0.7s ease;
}
footer .form-control:focus {
    color: rgba(255, 255, 255, 1);
    background-color: transparent;
    border-color: #ffffff;
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(0,123,255,.25);
}
footer .form-control::placeholder {
    color: #FFFFFF;
    opacity: 1;
}
footer p {
    font-weight: 300;
}

footer p a {
    color: #ffffff;
    opacity: 0.7;
    transition: opacity 0.6s ease;
}

footer p a:hover {
    color: #ffffff;
    opacity: 1;
    text-decoration: none;

}

footer .row .contact-details {
    font-size: 1.2rem;
}

footer .row .social-follow p {
    display: block;
}

footer .row .terms p span.conditions {
    font-size: 0.8rem;
}


/* media queries for styles within media queries listed below: */
@media (min-width: 992px) and (max-width: 1199.98px) {

}

@media (min-width: 768px) and (max-width: 991.98px) {
    section .animated-section {
        padding: 20px;
        height: 300px;
    }

}

@media (min-width: 576px) and (max-width: 767.98px) {

    .join-page-facilities {
        margin-top: 0px;
    }

}


/* media queries based up to max-width */

@media (min-width: 2000px) and (max-width: 2600px) {
    .position-icons {
        position: fixed;
        left: 600px;
        width: 14%;
    }
}


@media (min-width: 1800px) and (max-width: 1999px) {
    .position-icons {
        position: fixed;
        top: 300px;
        width: 20%;
        left: 260px;
    }
}


@media (min-width: 1501px) and (max-width: 1799px)  {

    .position-icons {
        position: fixed; top: 300px;
        width: 15%;
        left: 270px;
    }

}


@media (min-width: 1300px) and (max-width: 1500px) {
    .position-icons {
        position: fixed;
        left: 105px;
        width: 20%;
    }
}

@media (min-width: 320px) and (max-width: 992px) {
    .btn.btn-white-outline.mb-2 {
        width: 100%;
    }
    .form-group.mb-2 {
        width: 100%;
    }
}

@media (min-width: 600px) and (max-width: 995px) {
    .animated-swimming-svg {
        width: 100%;
        overflow: hidden;
        z-index: -1;
        position: absolute !important;
        left: 0px;
        bottom: -93px;
    }
    .masthead h1 {
        font-size: 2.4rem;
        padding: 75px;
        font-family: "Flavin-Regular";
    }
    .col-lg-9.col-md-9.pl-4.pl-md-5.pt-5.pt-md-4.pb-0.pb-md-4.pr-3.pr-md-0.mt-6.pl-5 .w-50.hide-this-mobile p {
        white-space: nowrap;
    }

    .animated-climbing-svg {
        width: 135%;
        z-index: -1;
        position: absolute !important;
        top: 89px;
        right: -15px;
    }


    .animated-classes-svg {
        width: 105%;
        z-index: -1;
        position: absolute !important;
        bottom: -116px;
    }



}

@media (max-width: 1299.98px) {

    .position-icons {
        position: fixed; top: 300px;
        width: 20%;
        left: 80px;
    }
    .masthead {
        min-height: auto;
    }
    header video {
        position: absolute;
        width: 100%;
        height: auto;

    }

}

@media (max-width: 991.98px) {
    .masthead {
        height: 45vh !important;
    }
.masthead h4 {
    font-size: 1.5rem !important;
    padding: 10px;
    font-family: "Flavin-Regular";
}
    .masthead h1 {
        display: none;
    }
    .scroll-down.hide-on-mobile {
        bottom: 15px !important;
    }

}

@media (max-width: 993px) {
    
.navbar {
    background-color: #000;
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    }
    .navbar-collapse.collapse.show {
        padding-bottom: 40px;
        padding-top: 20px;
    }
    footer .row .contact-details {
        font-size: 1rem;
    }
}

@media (max-width: 767.98px) {
    .show-this-mobile {
        display: block;
    }
    .hide-this-mobile {
        display: none;
    }
    .toggle-dates {
        border-top: 1px solid #dee2e6!important;
    }
    .border-split::after {
        content: "";
        height: 1px;
        display: block;
        width: 92%;
        background: #ffffff;
        margin: 0 auto;
    }
    .timetables .timetable-column-headers {
        position: relative;
        bottom: unset;
        font-weight: 700;
    }

    .animated-swimming-svg {
        width: 75%;
        overflow: hidden;
        z-index: -1;
        position: absolute;
        left: unset;
        right: 0;
        top: unset;
        bottom: -78px;
    }

    .animated-climbing-svg {
        width: 92%;
        z-index: -1;
        position: absolute;
        top: 89px;
        right: 0px;
    }

    .animated-classes-svg {
        width: 105%;
        z-index: -1;
        position: absolute;
        top: 153px;
        right: 0px;
    }

    .navbar-brand {
        margin-right: 0rem;
    }
    .masthead {
        background-color: #ffffff !important;
    }
    .navbar-expand-lg .navbar-nav a.nav-link {
        font-size: 1.4rem;
    }
    .mt-6 {
        margin-top: 30px;
    }
    .pr-10 {
        padding-right: 25px
    }
    .mt-12 {
        margin-top: 60px;
    }



    .masthead h1 {
        font-size: 1.9rem;
        padding: 20px;
        opacity: 0;
    }
    .hide-on-tablet {
        display: none;
    }
    .contact-lines {
        background-image: none;
    }
    .pl-12 {
        padding-left: 17px
    }
    .inner-section-spacing {
        padding: 0px 0px;
    }
    .position-icons {
        position: relative !important;
        top: 0px !important;
        width: 100%;
        left: -50px;

    }
    header video {
        width: 100%;
    }

}


/* Timetable
*/

.mptt-shortcode-hours {
    display: none;
}

.mptt-shortcode-table > thead {
    display: none;
}

.mptt-shortcode-table > tbody, .mptt-shortcode-table > tbody > tr,
.mptt-shortcode-table > tbody > tr > td {
    border: none !important;
    background: none !important;
}

.mptt-shortcode-table, .mptt-shortcode-table td {
    border: none !important;
}

.mptt-shortcode-wrapper .mptt-shortcode-table tbody td.event,
.mptt-shortcode-wrapper .mptt-shortcode-table tbody td.event .mptt-event-container {
    border: none !important;
    background: none !important;
    outline: 0 !important;
}

.mptt-shortcode-event.mptt-event-vertical-default.event {
    width: 100vw;
}

.mptt-menu.mptt-navigation-select {
    display: none;
}

.mptt-shortcode-wrapper .mptt-shortcode-table tbody .mptt-event-container {
    overflow: visible;
}

.mptt-menu.mptt-navigation-tabs {
    display: none;
}

.mptt-shortcode-wrapper .mptt-shortcode-table tbody .mptt-event-container {
    outline: #fff solid 0px;
    position: relative;
}

.mptt-shortcode-table {
    width: 100%;
}
table.mptt-shortcode-table {
    margin-bottom: 0px;
}

.timetable-heading:first-child h1.timetable-title {

}

.mptt-shortcode-wrapper .mptt-shortcode-table tbody td {
    height: 50px !important;
}
.mptt-shortcode-wrapper .mptt-shortcode-table {
    margin-top: 0rem;
}


/* additional styles */
.carousel-control-next-icon
{
    width: 50px;
    height: 98px;
    background-image: url("/app/themes/jags-sports-gym/assets/img/carousel-asset-right.png") !important;
}

.carousel-control-prev-icon
{
    width: 50px;
    height: 98px;
    background-image: url("/app/themes/jags-sports-gym/assets/img/carousel-asset-left.png") !important;
}

.section-start-space {
    margin-top: 40px;
}

.display-4 {
    font-size: 3.5rem;
    font-weight: 300;
    line-height: 1.2;
    text-align: center;
    bottom: 0;
    color: #fff;
    position: absolute;
    margin: 0 auto;
    width: 100%;
    bottom: 150px;
}

/* scroll down arrow */
.scroll-down {
    opacity: 1;
    -webkit-transition: all .5s ease-in 3s;
    transition: all .5s ease-in 3s;
}

.scroll-down {
    position: absolute;
    bottom: 100px !important;
    left: 50%;
    margin-left: -16px;
    display: block;
    width: 32px;
    height: 32px;
    border: 2px solid #FFF;
    background-size: 14px auto;
    border-radius: 50%;
    z-index: 2;
    -webkit-animation: bounce 2s infinite 2s;
    animation: bounce 2s infinite 2s;
    -webkit-transition: all .2s ease-in;
    transition: all .2s ease-in;
}

.scroll-down:before {
    position: absolute;
    top: calc(50% - 8px);
    left: calc(50% - 6px);
    transform: rotate(-45deg);
    display: block;
    width: 12px;
    height: 12px;
    content: "";
    border: 2px solid white;
    border-width: 0px 0 2px 2px;
}

@keyframes bounce {
    0%,
    100%,
    20%,
    50%,
    80% {
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
    }
    40% {
        -webkit-transform: translateY(-10px);
        -ms-transform: translateY(-10px);
        transform: translateY(-10px);
    }
    60% {
        -webkit-transform: translateY(-5px);
        -ms-transform: translateY(-5px);
        transform: translateY(-5px);
    }
}

.panel .panel-body p.members-booking {
    font-size: 1.1rem;
    line-height: 0.5rem;
    font-family: "Flavin-Light";
}



@media (max-width: 575.98px) {
    .hide-on-mobile {
        display: none !important;
    }
    .timetables .timetable-dates ul li {
        font-size: 1.2rem;
    }
    .timetables .timetable-column-content .single-column-header {
        font-size: 1rem;
    }
    .timetables .timetable-column-content .single-column-header:nth-child(1) {
        width: 30%;
    }
    hr.mobile-hr {
        display: block;
    }
    .timetables .timetable-column-headers .single-column-header {
        width: 30%;
    }
    section .animated-section {
        padding: 20px;
        height: 315px;
        margin-bottom: 20px;
    }
    .booking-information.mobile {
        display: block !important;
    }
    .booking-information.desktop {
        display: none !important;
    }

    .timetables .icon-side-panel.swimming {

    }
    .timetables .icon-side-panel.climbing {
    }
    .timetables .icon-side-panel.classes {
    }
    .price-list .price-list-line-item .name {
        font-size: 0.8rem
    }

    .join-page-facilities {
        margin-top: 0px !important;
    }
    .icon-side-panel.box.position-icons-kids {
        width: 65%;
        margin: 0 auto;

    }
    .carousel-control-next-icon
    {
        width: 20px;
        height: 39px;
    }

    .section-start-space {
        margin-top: 40px;
    }
    .timetables .timetable-dates ul li {
        margin: 5px 3px;
    }
    .carousel-control-prev-icon
    {
        width: 20px;
        height: 39px;
    }
    header video {
        top: 62%;
    }
    .masthead {
        min-height: auto;
    }
    .carousel-item {
        height: auto;
        min-height: 350px;
    }
    header {
        position: relative;
        background-color: black;
        height: auto;
        min-height: auto;
        width: 100%;
        overflow: visible;
    }
    .icon-side-panel.timetable {
        overflow: hidden;
    }
    .pl-5 {
        padding-left: 15px !important;
    }
    .w-50 {
         width: 100%!important;
    }
    .navbar-brand img {
        width: 60%!important;
    }

}

input.wpcf7-form-control.wpcf7-text.form-control {
    border-bottom: 2px solid #bcbcbc;
}

.custom-radio .custom-control-input:checked~.custom-control-label::after {
    background-image: url(data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e);
    background-image: none !important;
    background-color: rgba(239, 91, 80, 1) !important;
    border-radius: 50%;
}



.fc-next-button,
.fc-prev-button,
.fc-today-button,
.fc-toolbar {
  display: none;
}

.modal-header {
    border-bottom: 0px solid #dee2e6;
}

.custom-control-input:checked~.custom-control-label::before {
    color: #fff;
    border-color: #007bff;
    background-color: transparent;
    border: none !important;
}


.container-select {
    display: block;
    position: relative;
    padding-left: 25px;
    margin-bottom: 12px;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/* Hide the browser's default radio button */
.container-select input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}

/* Create a custom radio button */
.checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 15px;
    width: 15px;
    background-color: #ffffff;
    border-radius: 50%;
}

/* On mouse-over, add a grey background color */
.container-select:hover input ~ .checkmark {
    background-color: #ffffff;
}

/* When the radio button is checked, add a blue background */
.container-select input:checked ~ .checkmark {
    background-color: #ef5b50;
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the indicator (dot/circle) when checked */
.container-select input:checked ~ .checkmark:after {
    display: block;
}

/* Style the indicator (dot/circle) */

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