/*colours*/
:root {
  --main: #fba921; /*251,169,33*/
  --secondary: #427394; /*66,115,148*/
  --s80: #688fa9; 
  --s50: #a1b9ca; 
  --s20: #d9e3ea; 
  --generaltext: #444;
  --dltext: #666;
  --white: #fff;
  --black: #000;
    --red: #cb0101;/*203,1,1*/
    --green: #7CA22F;/*124,162,47*/
  --vlgrey: #ddd;
  --tgrey: #bbb;
  --slgrey: #efefef;
}

/* fonts */
@font-face {
  font-family: "Text";
  src: url("https://storage.googleapis.com/inscribirme.appspot.com/media/tktrm_sports/OpenSans-Variable.ttf") format("truetype-variations");
  font-weight: 100 1500;
}   
@font-face {
  font-family: "Display";
    src: url("https://storage.googleapis.com/inscribirme.appspot.com/media/tktrm_sports/Bitter-Variable.ttf") format("truetype-variations");
  font-weight: 100 1000;
}   

.center {text-align: center!important}
.left {text-align: left!important}
.right {text-align: right!important}
.smaller {font-size: 80%!important}

.m10 {margin-top: 10px!important}
.m20 {margin-top: 20px!important}
.m30 {margin-top: 30px!important}
.m40 {margin-top: 40px!important}
.m50 {margin-top: 50px!important}
.m60 {margin-top: 60px!important}
.m70 {margin-top: 70px!important}
.m80 {margin-top: 80px!important}
.m90 {margin-top: 90px!important}

textarea {  resize: none;}

.note-statusbar {display: none!important}
.panel {border-radius: 0px!important} 
/* 2 columns */
.wrappertwo {
  display: grid;
  grid-gap: 0px;
  grid-template-columns: 50% 50% ;
  padding: 0px;
  margin: 0px;
  width: 100%;
}
.boxtwo {
  padding: 0px 0px;
  margin: 0px;
  text-align: left;
  border: 0px solid #ee0000;
}

.k1aa {grid-row: 1;  grid-column: 1 / span 2} 
.k1a {grid-row: 1;  grid-column: 1; padding-right: 10px} 
.k1b {grid-row: 1;  grid-column: 2; padding-left: 10px} 

.k2aa {grid-row:2;  grid-column: 1 / span 2} 
.k2a {grid-row: 2;  grid-column: 1; padding-right: 10px} 
.k2b {grid-row: 2;  grid-column: 2; padding-left: 10px} 

.k3aa {grid-row: 3;  grid-column: 1 / span 2} 
.k3a {grid-row: 3;  grid-column: 1; padding-right: 10px} 
.k3b {grid-row: 3;  grid-column: 2; padding-left: 10px} 

.k4aa {grid-row: 4;  grid-column: 1 / span 2} 
.k4a {grid-row: 4;  grid-column: 1; padding-right: 10px} 
.k4b {grid-row: 4;  grid-column: 2; padding-left: 10px} 

.k5aa {grid-row: 5;  grid-column: 1 / span 2} 
.k5a {grid-row: 5;  grid-column: 1; padding-right: 10px} 
.k5b {grid-row: 5;  grid-column: 2; padding-left: 10px} 

.k6aa {grid-row: 6;  grid-column: 1 / span 2} 
.k6a {grid-row: 6;  grid-column: 1; padding-right: 10px} 
.k6b {grid-row: 6;  grid-column: 2; padding-left: 10px} 
/* end 2 columns */

/* 3 columns */
.wrapperthree {
  display: grid;
  grid-gap: 0px;
  grid-template-columns: 33.3% 33.4% 33.3% ;
  padding: 0px;
  margin: 0px;
  width: 100%;
}
.boxthree {
  padding: 0px 0px;
  margin: 0px;
  text-align: left;
  border: 0px solid #ee0000;
}

.h1aa {grid-row: 1;  grid-column: 1 / span 2} 
.h1a {grid-row: 1;  grid-column: 1; padding-right: 10px} 
.h1b {grid-row: 1;  grid-column: 2; padding-left: 10px} 
.h1c {grid-row: 1;  grid-column: 3; padding-left: 10px} 

.h2aa {grid-row:2;  grid-column: 1 / span 2} 
.h2a {grid-row: 2;  grid-column: 1; padding-right: 10px} 
.h2b {grid-row: 2;  grid-column: 2; padding-left: 10px} 
.h2bb {grid-row: 2;  grid-column: 2 / span 2; padding-left: 10px} 
.h2c {grid-row: 2;  grid-column: 3; padding-left: 10px} 

.h3aa {grid-row: 3;  grid-column: 1 / span 2} 
.h3aaa {grid-row: 3;  grid-column: 1 / span 3} 
.h3a {grid-row: 3;  grid-column: 1; padding-right: 10px} 
.h3b {grid-row: 3;  grid-column: 2; padding-left: 10px} 
.h3c {grid-row: 3;  grid-column: 3; padding-left: 10px} 

.h4aa {grid-row: 4;  grid-column: 1 / span 2} 
.h4aaa {grid-row: 4;  grid-column: 1 / span 3} 
.h4a {grid-row: 4;  grid-column: 1; padding-right: 10px} 
.h4b {grid-row: 4;  grid-column: 2; padding-left: 10px} 
.h4c {grid-row: 4;  grid-column: 3; padding-left: 10px} 

.h5aa {grid-row: 5;  grid-column: 1 / span 2} 
.h5aaa {grid-row: 5;  grid-column: 1 / span 3} 
.h5a {grid-row: 5;  grid-column: 1; padding-right: 10px} 
.h5b {grid-row: 5;  grid-column: 2; padding-left: 10px} 
.h5c {grid-row: 5;  grid-column: 3; padding-left: 10px} 

/* end 3 columns */

.boxthree upload-file {position: absolute; bottom: 35px; right: 0px}

/* 4 columns */
.wrapperfour {
  display: grid;
  grid-gap: 0px;
  grid-template-columns: 25% 25% 25% 25% ;
  padding: 0px;
  margin: 0px;
  width: 100%;
}
.boxfour {
  padding: 0px 0px;
  margin: 0px;
  text-align: left;
  border: 0px solid #ee0000;
}

.f1aa {grid-row: 1;  grid-column: 1 / span 2} 
.f1bb {grid-row: 1;  grid-column: 3 / span 2; padding-right: 10px} 
.f1bc {grid-row: 1;  grid-column: 2 / span 2; padding-right: 10px} 
.f1a {grid-row: 1;  grid-column: 1; padding-right: 10px} 
.f1b {grid-row: 1;  grid-column: 2; padding-left: 10px} 
.f1c {grid-row: 1;  grid-column: 3; padding-left: 10px} 
.f1cc {grid-row: 1;  grid-column: 3 / span 2; padding-left: 10px} 
.f1d {grid-row: 1;  grid-column: 4; padding-left: 10px}

.f2aa {grid-row: 2;  grid-column: 1 / span 2} 
.f2bb {grid-row: 2;  grid-column: 3 / span 2; padding-right: 10px} 
.f2bc {grid-row: 2;  grid-column: 2 / span 2; padding-right: 10px} 
.f2a {grid-row: 2;  grid-column: 1; padding-right: 10px} 
.f2b {grid-row: 2;  grid-column: 2; padding-left: 10px} 
.f2c {grid-row: 2;  grid-column: 3; padding-left: 10px} 
.f2d {grid-row: 2;  grid-column: 4; padding-left: 10px} 

.f3a {grid-row: 3;  grid-column: 1; padding-right: 10px} 
.f3b {grid-row: 3;  grid-column: 2; padding-left: 10px} 
.f3c {grid-row: 3;  grid-column: 3; padding-left: 10px} 
.f3d {grid-row: 3;  grid-column: 4; padding-left: 10px} 

.f4a {grid-row: 4;  grid-column: 1; padding-right: 10px} 
.f4b {grid-row: 4;  grid-column: 2; padding-left: 10px} 
.f4c {grid-row: 4;  grid-column: 3; padding-left: 10px} 
.f4d {grid-row: 4;  grid-column: 4; padding-left: 10px} 

/* end 4 columns */

/* 6 columns */
.wrappersix {
  display: grid;
  grid-gap: 0px;
  grid-template-columns: 16.6% 16.6%  16.6%  16.6%  16.6%  16.6%  ;
  padding: 0px;
  margin: 0px;
  width: 100%;
}
.boxsix {
  padding: 0px 0px;
  margin: 0px;
  text-align: left;
  border: 0px solid #ee0000;
}

.s1aaa {grid-row: 1;  grid-column: 1 / span 3} 
.s1a {grid-row: 1;  grid-column: 1; } 
.s1b {grid-row: 1;  grid-column: 2; padding-left: 10px} 
.s1c {grid-row: 1;  grid-column: 3; padding-left: 10px} 
.s1ddd {grid-row: 1;  grid-column: 4 / span 3; padding-left: 10px} 
.s1d {grid-row: 1;  grid-column: 4; padding-left: 10px} 
.s1e {grid-row: 1;  grid-column: 5; padding-left: 10px} 
.s1f {grid-row: 1;  grid-column: 6; padding-left: 10px} 
.s2aaa {grid-row: 2;  grid-column: 1 / span 3} 

/* end 6 columns */

/* 2 responsive columns */
.column2 {
  float: left;
  width: 50%;
  padding: 0 10px; border: 0px solid #f09; margin: 0px;
}

.row2 {margin: 0 -10px; padding: 0px; min-width: 100%}

.row2:after {
  content: "";
  display: table;
  clear: both;
}


/* 3 responsive columns */
.column3 {
  float: left;
  width: 33.3%;
  padding: 0 10px; border: 0px solid #f09; margin: 0px; background: none
}

.row3 {margin: 0 -10px; padding: 0px; min-width: 100%}

.row3:after {
  content: "";
  display: table;
  clear: both;
}

.columns6 {display: grid; gap: 5px; grid-template-columns: repeat(6, 1fr)}

.v_middle {position: absolute; top: 50%; transform: translateY(-50%)}
.middle {position: absolute; top: 50%; left: 50%;  transform: translateY(-50%) translateX(-50%)}

.wrappersaving {
  display: grid;
  grid-gap: 0px;
  grid-template-columns: 50% 50%;
  padding: 0px;
  margin: 40px 25%;
  width: 50%;
}
.boxsaving {
  padding: 0px 0px;
  margin: 0px;
  text-align: left;
  border: 0px solid #ee0000;
}

.ss1a {grid-row: 1;  grid-column: 1; padding: 0px!important; text-align: center} 
.ss1b {grid-row: 1;  grid-column: 2; padding: 0px!important; text-align: center} 

.boxsaving input {min-width: 210px}

.back {font-weight: 600; color: var(--secondary); cursor: pointer}
.back i {color: var(--main)}


.columns2 {display: grid; gap: 10px; grid-template-columns: repeat(2, 1fr)}
.columns3 {display: grid; gap: 10px; grid-template-columns: repeat(3, 1fr)}
.columns4 {display: grid; gap: 10px; grid-template-columns: repeat(4, 1fr)}
.columns5 {display: grid; gap: 10px; grid-template-columns: repeat(5, 1fr)}
.columns6 {display: grid; gap: 5px; grid-template-columns: repeat(6, 1fr)}


/***** forms *****/
.input_text { font-size: 1em; font-weight: 150!important; color: var(--dtext); border: 1px solid var(--vlgrey); width: 100%; border-radius: 0px; padding: 7px 3px; background: var(--white)!important}
.sp_form label {display: block; font-size: 1em; font-weight: 450; margin: 20px 0px 5px}
.input_select {padding: 9px 3px } 
.input_text:focus  {border-bottom: 1px solid var(--main)!important;outline: none!important; }


.input_colour {margin: 0px!important; padding: 0px!important; width: 100%; border: 1px solid var(--vlgrey)!important}

.input_small { font-size: 0.9em!important; font-weight: 250!important;  padding: 5px 2px}

.sp_label, .wrappertwo label, .wrapperthree label, .wrappersix label, .column3 label, .column2 label, .wrapperfour label, form label {display: block; font-size: 1.05em; font-weight: 450; margin: 10px 0px 5px}

/***** end forms *****/

.button {font-weight: 500; padding: 5px 40px; border-radius: 300px;color: #fff; background: var(--main);text-shadow: 1px 1px 2px rgba(0,0,0,0.2); white-space: nowrap; border: none; font-size: 1.1em}
.button_l {font-weight: 400; padding: 8px 40px; border-radius: 300px;color: var(--main);text-shadow: 1px 1px 2px rgba(0,0,0,0.2); white-space: nowrap; border: 1px solid var(--main);}
.button:hover {color: #fff}

.button_s {font-weight: 500; padding: 3px 7px; border-radius: 300px;color: var(--main); background: var(--white);text-shadow: 1px 1px 1px rgba(0,0,0,0.05); white-space: nowrap;  border: 1px solid var(--main); font-size: 0.8em; display: inline-flex; margin-left: 70px}
.button_s:hover {text-decoration: none; color: var(--main) }

.small_button {font-weight: 500; padding: 3px 7px; border-radius: 300px;color: var(--main); background: var(--white);text-shadow: 1px 1px 1px rgba(0,0,0,0.05); white-space: nowrap;  border: 1px solid var(--main); font-size: 0.8em}

/********************************************general mobile settings**********************************************************/
@media all and (max-width: 64em), only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min--moz-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (-o-min-device-pixel-ratio: 2/1) and (max-width: 1024px), only screen and (min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min-resolution: 192dpi) and (max-width: 1024px), only screen and (min-resolution: 2dppx) and (max-width: 1024px) {
    
    
    
 /* 2 columns */
.wrappertwo {
  display: grid;
  grid-gap: 0px;
  grid-template-columns: 100% ;
  padding: 0px;
  margin: 0px;
  width: 100%;
}
.boxtwo {
  padding: 0px 0px;
  margin: 0px;
  text-align: left;
  border: 0px solid #ee0000;
}

.k1aa {grid-row: 1;  grid-column: 1; padding: 0px!important } 
.k1a {grid-row: 1;  grid-column: 1; padding: 0px!important} 
.k1b {grid-row: 2;  grid-column: 1; padding: 0px!important} 

.k2aa {grid-row:3;  grid-column: 1 } 
.k2a {grid-row: 3;  grid-column: 1; padding-right: 0px} 
.k2b {grid-row: 4;  grid-column: 1; padding-left: 0px} 

.k3aa {grid-row: 5;  grid-column: 1 } 
.k3a {grid-row: 5;  grid-column: 1; padding-right: 0px} 
.k3b {grid-row: 6;  grid-column: 1; padding-left: 0px} 

.k4aa {grid-row: 7;  grid-column: 1 } 
.k4a {grid-row: 7;  grid-column: 1; padding-right: 0px} 
.k4b {grid-row: 8;  grid-column: 1; padding-left: 0px} 

.k5aa {grid-row: 9;  grid-column: 1 } 
.k5a {grid-row: 9;  grid-column: 1; padding-right: 10px} 
.k5b {grid-row: 10;  grid-column: 1; padding-left: 10px} 

.k6aa {grid-row: 11;  grid-column: 1 } 
.k6a {grid-row: 11;  grid-column: 1; padding-right: 10px} 
.k6b {grid-row: 12;  grid-column: 1; padding-left: 10px} 
/* end 2 columns */ 
    
/* 3 columns */
.wrapperthree {
  display: grid;
  grid-gap: 0px;
  grid-template-columns: 100% ;
  padding: 0px;
  margin: 0px;
  width: 100%;
}
.boxthree {
  padding: 0px 0px;
  margin: 0px;
  text-align: left;
  border: 0px solid #ee0000;
}

.h1aa {grid-row: 1;  grid-column: 1 } 
.h1a {grid-row: 1;  grid-column: 1; padding-right: 0px} 
.h1b {grid-row: 2;  grid-column: 1; padding-left: 0px} 
.h1c {grid-row: 3;  grid-column: 1; padding-left: 0px} 

.h2aa {grid-row:4;  grid-column: 1 } 
.h2a {grid-row: 4;  grid-column: 1; padding-right: 0px} 
.h2b {grid-row: 5;  grid-column: 1; padding-left: 0px} 
.h2bb {grid-row: 5;  grid-column: 1; padding-left: 0px} 
.h2c {grid-row: 6;  grid-column: 1; padding-left: 0px} 
    
.h3aa {grid-row: 7;  grid-column: 1 } 
.h3aaa {grid-row: 7;  grid-column: 1 } 
.h3a {grid-row: 7;  grid-column: 1; padding-right: 0px} 
.h3b {grid-row: 8;  grid-column: 1; padding-left: 0px} 
.h3c {grid-row: 8;  grid-column: 1; padding-left: 0px} 
    
.h4aa {grid-row: 9;  grid-column: 1 } 
.h4aaa {grid-row: 9;  grid-column: 1 } 
.h4a {grid-row: 9;  grid-column: 1; padding-right: 0px} 
.h4b {grid-row: 10;  grid-column: 1; padding-left: 0px} 
.h4c {grid-row: 11;  grid-column: 1; padding-left: 0px} 
    
.h5aa {grid-row: 12;  grid-column: 1 } 
.h5aaa {grid-row: 12;  grid-column: 1 } 
.h5a {grid-row: 12;  grid-column: 1; padding-right: 0px} 
.h5b {grid-row: 13;  grid-column: 1; padding-left: 0px} 
.h5c {grid-row: 14;  grid-column: 1; padding-left: 0px} 

/* end 3 columns */
.boxthree upload-file {position: relative; bottom: 5px; right: 0px}
    
/* 3 responsive columns */
.column3 {
  float: left;
  width: 100%;
  padding: 0 10px; border: 0px solid #f09; margin: 0px;
}

.row3 {margin: 0 -10px; padding: 0px; min-width: 100%}

.row3:after {
  content: "";
  display: table;
  clear: both;
}

/* 4 columns */
.wrapperfour {
  display: grid;
  grid-gap: 0px;
  grid-template-columns: 100% ;
  padding: 0px;
  margin: 0px;
  width: 100%;
}
.boxfour {
  padding: 0px 0px;
  margin: 0px;
  text-align: left;
  border: 0px solid #ee0000;
}

.f1aa {grid-row: 1;  grid-column: 1 } 
.f1bb {grid-row: 2;  grid-column: 1 ; padding-right: 0px} 
.f1bc {grid-row: 2;  grid-column: 1 ; padding-right: 0px} 
.f1a {grid-row: 1;  grid-column: 1; padding-right: 0px} 
.f1b {grid-row: 2;  grid-column: 1; padding-left: 0px} 
.f1c {grid-row: 3;  grid-column: 1; padding-left: 0px} 
.f1cc {grid-row: 3;  grid-column: 1; padding-left: 0px} 
.f1d {grid-row: 4;  grid-column: 1; padding-left: 0px}

.f2aa {grid-row: 5;  grid-column: 1 } 
.f2bb {grid-row: 6;  grid-column: 1; padding-right: 0px} 
.f2bc {grid-row: 6;  grid-column: 1 ; padding-right: 0px} 
.f2a {grid-row: 5;  grid-column: 1; padding-right: 0px} 
.f2b {grid-row: 6;  grid-column: 1; padding-left: 0px} 
.f2c {grid-row: 7;  grid-column: 1; padding-left: 0px} 
.f2d {grid-row: 8;  grid-column: 1; padding-left: 0px}
    
.f3a {grid-row: 9;  grid-column: 1; padding-right: 0px} 
.f3b {grid-row: 10;  grid-column: 2; padding-left: 0px} 
.f3c {grid-row: 11;  grid-column: 3; padding-left: 0px} 
.f3d {grid-row: 12;  grid-column: 4; padding-left: 0px} 

.f4a {grid-row: 13;  grid-column: 1; padding-right: 0px} 
.f4b {grid-row: 14;  grid-column: 2; padding-left: 0px} 
.f4c {grid-row: 15;  grid-column: 3; padding-left: 0px} 
.f4d {grid-row: 16;  grid-column: 4; padding-left: 0px} 

/* end 4 columns */
    
    /* 6 columns */
.wrappersix {
  display: grid;
  grid-gap: 0px;
  grid-template-columns: 33.3% 33.3% 33.3%;
  padding: 0px;
  margin: 0px;
  width: 100%;
}
.boxsix {
  padding: 0px 0px;
  margin: 0px;
  text-align: left;
  border: 0px solid #ee0000;
}

.s1aaa {grid-row: 1;  grid-column: 1 / span 3} 
.s1d {grid-row: 2;  grid-column: 1; padding-left: 0px} 
.s1e {grid-row: 2;  grid-column: 2; padding-left: 10px} 
.s1f {grid-row: 2;  grid-column: 3; padding-left: 10px} 
.s2aaa {grid-row: 3;  grid-column: 1 / span 3} 

/* end 6 columns */
    
.wrappersaving {
  display: grid;
  grid-gap: 0px;
  grid-template-columns: 50% 50%;
  padding: 0px;
  margin: 40px 0px;
  width: calc(100% - 0px);
}
    
.boxsaving input {min-width: 160px; padding: 5px 20px!important }
    
/* 2 responsive columns */
.column2 {
  float: left;
  width: 100%;
  padding: 0 10px; border: 0px solid #f09;
}
.row2 {margin: 0 -10px;}

.row2:after {
  content: "";
  display: table;
  clear: both;
}
    
    
  /* 3 responsive columns */
.column3 {
  float: left;
  width: 100%;
  padding: 0 10px; border: 0px solid #f09; margin: 0px;
}

.row3 {margin: 0 -10px; padding: 0px; min-width: 100%}

.row3:after {
  content: "";
  display: table;
  clear: both;
}  
    
.columns2 {display: grid; gap: 10px; grid-template-columns: repeat(1, 1fr)}
.columns3 {display: grid; gap: 10px; grid-template-columns: repeat(1, 1fr)}
.columns4 {display: grid; gap: 10px; grid-template-columns: repeat(1, 1fr)}
.columns5 {display: grid; gap: 10px; grid-template-columns: repeat(1, 1fr)}
.columns6 {display: grid; gap: 3px; grid-template-columns: repeat(2, 1fr)}
    
.star {font-size: 0.9em; font-weight: 600!important; color: var(--main)!important; transform: translateY(-2px); display: inline-block}

    
}