/* ------------------------------------------------*/
/* The Martial Arts School - Global Styles
/* Fonts: 								Sans Serif: "Noto Sans"
/* Weights (Regular, Semi-bold):		400, 600
/* Colours: 
	dark grey: 		#22272d
	mid grey: 		#303740
	light grey: 	#4e555c
	pale grey: 		#d6d6d6
	yellow: 		#ffcd06


---------------------------------------------------*/
/* default
---------------------------------------------------*/

body { background: #fff; font-family: 'Noto Sans', Arial, sans-serif; font-weight: 400; font-size: 16px; line-height: 23px; color: #000; -webkit-font-feature-settings: "lnum"; -moz-font-feature-settings: "lnum"; font-feature-settings: "lnum"; }

.bg-preview { background: transparent url(/img/bg-preview-dk.png) 0 0 repeat;  }


/* debug
---------------------------------------------------*/
.border { border: 1px solid red; }
.border-blue { border: 1px solid blue; }
.border-green { border: 1px solid green; }
.border-orange { border: 1px solid orange; }
.border-top { border-top: 1px solid red; }
.border-right { border-right: 1px solid red; }
.border-bottom { border-bottom: 1px solid red; }
.border-left { border-left: 1px solid red; }
.border-top-white { border-top: 1px solid #fff; }

.bg { background: #ffcc00; }


/* Bootstrap overrides
---------------------------------------------------*/
/* remove spacing between middle columns */
.row.no-gutter [class*='col-']:not(:first-child):not(:last-child) { padding-right: 0; padding-left: 0; }

/* remove right padding from first column */
.row.no-gutter [class*='col-']:first-child { padding-right: 0; }

/* remove left padding from first column */
.row.no-gutter [class*='col-']:last-child { padding-left: 0; }

/* row padding override */
div.special > div[class*="col-"] { padding: 0; }

/* centered columns styles */
.row-centered {
    text-align:center;
}
.col-centered {
    display:inline-block;
    float:none;
    /* reset the text-align */
    text-align:left;
    /* inline-block space fix */
    margin-right:-4px;
}

.no-padd { padding: 0 !important; }


/* 5 equal columns */
.col-xs-5ths,
.col-sm-5ths,
.col-md-5ths,
.col-lg-5ths {
    position: relative;
    min-height: 1px;
    padding-right: 10px;
    padding-left: 10px;
}

.col-xs-5ths {
    width: 20%;
    float: left;
}

@media (min-width: 768px) {
    .col-sm-5ths {
        width: 20%;
        float: left;
    }
}

@media (min-width: 992px) {
    .col-md-5ths {
        width: 20%;
        float: left;
    }
}

@media (min-width: 1200px) {
    .col-lg-5ths {
        width: 20%;
        float: left;
    }
}


/* flex row equal columns */
/*@media only screen and (min-width : 481px) {*/
   .flex-row.row {
	 display: flex;
	 flex-wrap: wrap;
   }
   .flex-row.row > [class*='col-'] {
	 display: flex;
	 flex-direction: column;
   }
  .flex-row.row:after, 
  .flex-row.row:before {
	 display: flex;
  }
/*}*/



/* span all columns */
.all-cols { -webkit-column-span: all; column-span: all; }

/* prevents splitting element */
.do-not-split {
	
    margin: 0;
    -webkit-column-break-inside: avoid; /* Chrome, Safari */
    page-break-inside: avoid;           /* Theoretically FF 20+ */
    break-inside: avoid-column;         /* IE 11 */
    display:table;                      /* Actually FF 20+ */
}

/* coliumn counts */
.one-column { column-count: 1; }
.two-column { column-count: 2; }
.three-column { column-count: 3; }
.four-column { column-count: 4; }



/* logged in panel */
#logged-in-panel { position: fixed; z-index: 999999; width: 100%; padding: 1% 2%; background: #c5c5c5; }
#logged-in-panel a { color: #fff !important; font-weight: 300; }
#logged-in-panel span.closemgr { display: block; float: right; color: #fff !important; }
#logged-in-panel #close-mgr { display: block; color: #fff !important; padding: 0; font-size: 26px; }
#logged-in-panel #close-mgr:hover { text-decoration: none; color: #000 !important; }



/* global
---------------------------------------------------*/
.clear { clear: both; }
.hidden { display: none; visibility: hidden; }
.referrer,
.off { position: absolute; width: 1px; border: 0; clip: rect(0,0,0,0); height: 1px; left: -999px; /*margin: -1px;*/ padding: 0; overflow: hidden; }
.off.focusable:active, .off.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }
@-moz-document url-prefix() {
    fieldset {
        display: table-cell;
    }
}

/* iframes */
.google-maps { position: relative; padding-bottom: 75%; height: 0; overflow: hidden; }
.google-maps iframe { position: absolute; top: 0; left: 0; width: 100% !important; height: 100% !important; }

.videowrapper { position: relative; padding-bottom: 56.25%; /* 16:9 */ padding-top: 25px; height: 0; }
.videowrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

/* anchor offset */
a.shiftedanch { position: relative; top: -135px; margin: 0; padding: 0; float: left; color: #fff !important; }

/* print */
.print-only { display: none; }

.img { width: 100%; }

.fixed { position: fixed; z-index: 9000; width: 100%; top: 0; }

hr { border: none; border-bottom: 1px solid #ccc; padding: 0; margin: 15px 0; background: #666; }

strong { font-weight: 600 !important; }

img#captcha { width: 200px !important; }

.fade { opacity: 1; transition: opacity .25s ease-in-out; -moz-transition: opacity .25s ease-in-out; -webkit-transition: opacity .25s ease-in-out; }
.fade:hover { opacity: 0.8; }

.fade2 { opacity: 1; transition: opacity .25s ease-in-out; -moz-transition: opacity .25s ease-in-out; -webkit-transition: opacity .25s ease-in-out; }
.fade2:hover { opacity: 0.5; }

.fadein { opacity: 0; }

.faded { opacity: 0.5; transition: opacity .25s ease-in-out; -moz-transition: opacity .25s ease-in-out; -webkit-transition: opacity .25s ease-in-out; }

.first { font-weight: normal; font-family: 'Abel', Helvetica, Tahoma, Verdana, Arial, sans-serif; }

.notfirst { font-weight: normal; font-family: 'Abel', Helvetica, Tahoma, Verdana, Arial, sans-serif; }

.transition { -webkit-transform: scale(1.01); -moz-transform: scale(1.01); -o-transform: scale(1.01); transform: scale(1.01); }

/* Remove spinners from number fields */
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
input[type=number] { -moz-appearance: textfield; }

/* drop shadow */
.drpshdw { box-shadow: 1px 1px 5px 0px rgba(0,0,0,0.75); }
.drpshdw1 { -webkit-box-shadow: 0px 0px 10px 3px rgba(70,70,70,0.3); -moz-box-shadow: 0px 0px 10px 3px rgba(70,70,70,0.3); box-shadow: 0px 0px 10px 3px rgba(70,70,70,0.3); }


/* 404s */
.page404 { background: #edeff0; font-family: Tahoma,Geneva,sans-serif; }
.page404 #container-404 { border: 1px solid #ccc; margin: 50px auto; width: 760px; background: #fff url(/img/404/404-body-bg.gif) 0 0 repeat-x; }
.page404 #container-404 h1 { font-size: 20px; color: #666; margin: 50px 0 10px 0; }
.page404 #container-404 #logo-404 { background: transparent url(/img/404/404.png) -15px -15px no-repeat; padding: 75px; }
#logo-404 p { color: #666}
#logo-404 p.error-404 { color: #ccc; font-weight: bold; margin-bottom: 15px; }

#page404 ul { list-style-type: none; }
#page404 ul,
#page404 dl { margin: 5px; }

#page404 li,
#page404 dd { color: #666; background: transparent url(/img/404/404-arrow-r.gif) 0 7px no-repeat; padding: 0 0 0 20px; }

#page404 li.sub,
#page404 dd.sub { margin-left: 5px; }

#page404 li a { color: #666; }

#sitemap dl  { margin: 15px; }
#sitemap dd { background: transparent url(/img/404/404-arrow-r.gif) 0 7px no-repeat; padding: 0 0 0 20px; }
#sitemap dd.sub { margin-left: 20px; }



/* captcha */
@media screen and (max-height: 575px){ .g-recaptcha { transform: scale(0.77); -webkit-transform: scale(0.77); transform-origin: 0 0; -webkit-transform-origin: 0 0; } }


/* cookies */
#cookies { position: fixed; bottom: 0; z-index: 9999; width: 100%; }
#cookies .cookitem { min-height: 50px; background: #1d1d1b; padding-bottom: 50px; }

.cooktxt { padding-top: 25px; color: #fff; font-size: 16px;  }
.cookbtns { padding-top: 25px; }
.cookbtns a.agreed { background: #ccc; padding: 5px; margin-right: 10px; color: #000; text-decoration: none; }
.cookbtns a.closed {  background: #ddd; padding: 5px; margin-right: 10px; color: #000; text-decoration: none; }
#cookies a.gen { color: #f6a201; }


/* Scroll to top link */
.top-scroll { position: fixed; right: 50%; bottom: 2.5em; margin-right: -600px; z-index: 9999999; }
.top-scroll a { display: block; height: 52px; width: 52px; background: url(/img/to-the-top.png) no-repeat 0 -52px; text-decoration: none; }
.top-scroll a:hover { background-position: 0 0; }

@media only screen and (max-width:1279px){ 
	.top-scroll { right: 1.5em; margin-right: 0; }
}
@media only screen and (max-width:1090px){
    .top-scroll { display: none; }
}


/* slide in animation */
.come-in { transform: translateY(250px); animation: come-in 0.8s ease forwards; }
.come-in:nth-child(odd) { animation-duration: 0.6s; /* So they look staggered */ }
@keyframes come-in { to { transform: translateY(0); } }




/* row with equal height columns */
.row-eq-height { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; }


/* bounce icons */
.bounce { display: inline-block; position: relative; -moz-animation: bounce 1.5s infinite linear; -o-animation: bounce 1.5s infinite linear; -webkit-animation: bounce 1.5s infinite linear; animation: bounce 1.5s infinite linear; }

@-webkit-keyframes bounce {
    0% { top: 0; }
    50% { top: -0.2em; }
    70% { top: -0.3em; }
    100% { top: 0; }
}
@-moz-keyframes bounce {
    0% { top: 0; }
    50% { top: -0.2em; }
    70% { top: -0.3em; }
    100% { top: 0; }
}
@-o-keyframes bounce {
    0% { top: 0; }
    50% { top: -0.2em; }
    70% { top: -0.3em; }
    100% { top: 0; }
}
@-ms-keyframes bounce {
    0% { top: 0; }
    50% { top: -0.2em; }
    70% { top: -0.3em; }
    100% { top: 0; }
}
@keyframes bounce {
    0% { top: 0; }
    50% { top: -0.2em; }
    70% { top: -0.3em; }
    100% { top: 0; }
}