/* START define global variables */
:root {
  --colour1: #F7941C; /* orange */
  --colour2: #4B1C62; /* deep purple */
  --colour3: #9B2E83; /* magentra */
  --colour4: #EF4E5D; /* red-coral */
  --colour5: #FDD102; /* yellow */
  --complementary1: #1CA6A6; /* green blue */
  --complementary2: #5AB9EA; /* light blue */
  --complementary3: #A7E8BD; /* light green */
  --complementary4: #F2F2F2; /* light grey */
  --complementary5: #333333; /* dark grey */
}
/* END define vars */

*, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

.clearfix:before, .clearfix:after { content: ''; display: table; }
.clearfix:after { clear: both; }

@font-face {
    font-family: 'Londrina Solid';
    src: url('fonts/londrinasolid-regular-webfont.eot');
    src: url('fonts/londrinasolid-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/londrinasolid-regular-webfont.woff2') format('woff2'),
         url('fonts/londrinasolid-regular-webfont.woff') format('woff'),
         url('fonts/londrinasolid-regular-webfont.ttf') format('truetype'),
         url('fonts/londrinasolid-regular-webfont.svg#londrina_solidregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

html * {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}

body {
background:  #EDDBE9; /* was #f9d508; */
color: #133c63;
font-size: 100%;
min-height: 100%;
overflow: hidden;
   -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
	font-weight:700;
	font-family:Arial,Helvetica,sans-serif;
}

body.overflowauto {
min-height: 100%;
overflow: auto!important;
}


a, button {
text-decoration: none;
outline: none;
}

a:hover, a:focus {
text-decoration: none;
outline: none;
}






a:link {
-webkit-tap-highlight-color: rgba(0,0,0,0)!important; /* make transparent link selection  */
}




p {
color: #133c63;
font-size: 0.938em;
line-height: 125%;
padding: 0;
margin: 0 0 10px 0;
font-weight: 500;
font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
}

.apptitlepink {
color: var(--colour3);
font-size: 1.75em;
line-height: 90%;
padding: 0;
margin: 30px 0 10px 0;
font-family: 'Londrina Solid', sans-serif !important;
text-align: center;
}


strong {
font-weight: 700;
}

.floatimageright50 {
max-width: 50%;
height: auto;
margin: 0 0 2px 1.5%;
float: right;
clear: right;
position: relative;
padding: 0;
}


.floatimageleft50 {
max-width: 50%;
height: auto;
margin: 0 2% 2px 0;
float: left;
clear: left;
position: relative;
padding: 0;
}

.floatimageleft30 {
max-width: 30%;
height: auto;
margin: 0 2% 2px 0;
float: left;
clear: left;
position: relative;
padding: 0;
}












/* containers begin */

.centercontentwrapper {  /* using flexbox to center content both horizontally and vertically on the page in column */
position: absolute;
top: -50px;
left: 0;
right: 0;
bottom: 0;
border: 0;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
-webkit-justify-content: space-around;
-ms-flex-pack: distribute;
justify-content: space-around;
flex-direction: column;
z-index: 9;
}


.innercontentwrapper {
position: relative;
height: auto;
text-align: center;
display: block;
margin: 0 auto;
padding: 0;
border: 0;
}


.innercontentwrapperwide {
position: relative;
max-width: 600px;
text-align: center;
display: block;
margin: 0 auto 0 auto;
padding: 0;
border: 0;
}


.innercontenttopwrapper5 {  /*   wrapper used together with body class 'overflowauto' to allow for scrolling  */
-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
position: relative;
max-width: 500px;
text-align: left;
display: block;
margin: 0 auto 0 auto;
padding: 15px 0 25px 0;
border: 0;
}

.innercontenttopwrapper10 {  /*   wrapper used together with body class 'overflowauto' to allow for scrolling  */
-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
position: relative;
max-width: 600px;
text-align: left;
display: block;
margin: 0 auto 0 auto;
padding: 15px 0 25px 0;
border: 0;
}

.innercontenttopwrapper15 {  /*   wrapper used together with body class 'overflowauto' to allow for scrolling  */
-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
position: relative;
max-width: 600px;
text-align: left;
display: block;
margin: 0 auto 0 auto;
padding: 15px 0 25px 0;
border: 0;
}

.innercontenttopwrapper25 {  /*   wrapper used together with body class 'overflowauto' to allow for scrolling  */
-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
position: relative;
max-width: 600px;
text-align: left;
display: block;
margin: 0 auto 0 auto;
padding: 15px 0 25px 0;
border: 0;
}


.innercontentwrapper, .innercontentwrapperwide, .innercontenttopwrapper5, .innercontenttopwrapper10, .innercontenttopwrapper25 {
width: 60%;
}

.innercontenttopwrapperFull {width:96%;max-width:720px;margin:auto;padding:15px 0;}

/* containers end */

.iconbar {
background: #9B2E83;
width: 100%;
height: 50px;
position: fixed;
border: 0;
padding: 0;
margin: 0 auto;
text-align: center;
z-index: 9999;
bottom: 0;
}

.smallicon {
height: 40px;
width: 45px;
display: inline-block;
margin: 5px 10px;
padding: 0;
outline: none;
border: 0;
opacity: .40;
filter: alpha(opacity=40);
-ms-filter: "alpha(opacity=40)";
-khtml-opacity: .40;
-moz-opacity: .40;
-webkit-transition: 300ms linear 0s;
-moz-transition: 300ms linear 0s;
-o-transition: 300ms linear 0s;
transition: 300ms linear 0s;
}

.smallicon:hover {
opacity: 1;
filter: alpha(opacity=1);
-ms-filter: "alpha(opacity=1)";
-khtml-opacity: 1;
-moz-opacity: 1;
}

/* logo styles begin */

.challengelogo {
text-align: center;
position: relative;
display: block;
padding: 0;
margin: 30px auto 0 auto;
width: 390px;
max-width: 90%;
text-align: center;
}


.challengelogoleft {
text-align: left;
position: relative;
display: block;
padding: 0;
margin: 0 0 15px 0;
width: 90%;
max-width: 250px;
text-align: left;
}

/* logo styles end */


.homeimg {
text-align: center;
position: relative;
display: block;
padding: 0;
margin-top: 1% auto;
margin-bottom:30px;
width:600px;
max-width:98%;
text-align: center;
}


.attributionlogoscontainer {
width: 80%;
max-width: 380px;
height: auto;
border: 0;
position: relative;
display: block;
overflow: hidden;
text-align: center;
margin: 0 auto 25px auto;
padding: 0;
padding-top:50px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}

.solarlogo {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
float: left;
display: inline-block;
padding: 0 5px 0 0;
margin: 0 auto;
max-width: 47%;
}

.ncclogo {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
position: relative;
display: inline-block;
padding: 0 0 0 5px;
margin: 0 auto;
max-width: 95%;
width:240px;
}

.challengeListIcon {
	height:50px;
	vertical-align:middle;
  margin-right: 10px;
}


/* small top logos begin */

.smalllogoscontainer {
width: 100%;
height: auto;
border: 0;
position: relative;
display: block;
overflow: hidden;
text-align: center;
margin: 0 auto;
padding: 0;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
border: 0;
}


.challengelogosmall {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
display: inline-block;
padding: 0 5px 0 0;
margin: 0 auto;
margin-bottom:15px;
max-width: 200px;
vertical-align:middle;
}

.sheriffslogosmall {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
float: right;
position: relative;
display: inline-block;
padding: 0 0 0 5px;
margin: 0 auto;
max-width: 50%;
}

/* small top logos end */













/* textbanner begins */

.textbanner {
width: 100%;
position: relative;
margin: 10px auto 10px auto;
padding: 10px 3%;
background:  transparent;
text-align: center;
border:0;
}

.textbanner p {
color: #133c63;
font-size: 0.938em;
font-weight: 700;
font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
line-height: 120%;
padding: 0;
margin: 0 0 0 0;

}

.textbanner p span,#caloriesTotal {
font-family: 'Londrina Solid', sans-serif !important;
font-size: 2.25em!important;
font-weight: normal!important;
color:#ec6829;
line-height: 80%!important;
}

.textbanner .message {
font-family: 'Londrina Solid', sans-serif !important;
font-size: 1.75em!important;
font-weight: normal!important;
color:#609339!important;
line-height: 105%!important;
}

.textbanner .messagered {
font-family: 'Londrina Solid', sans-serif !important;
font-size: 1.5em!important;
font-weight: normal!important;
color:#ec6829!important;
line-height: 110%!important;
}

.textbanner .messagedark {
font-family: 'Londrina Solid', sans-serif !important;
font-size: 1.75em!important;
font-weight: normal!important;
color:#133c63!important;
line-height: 105%!important;
}

/* textbanner ends */













/* textbanner begins */

.goalbanner,.goalbannerBottom {
width: 100%;
position: relative;
margin: auto;
padding: 10px 3%;
background:  var(--complementary1);
text-align: center;
color: white;
}

.goalbanner {
	-webkit-border-top-left-radius: 25px;
	-webkit-border-top-right-radius: 25px;
	-moz-border-radius-topleft: 25px;
	-moz-border-radius-topright: 25px;
	border-top-left-radius: 25px;
	border-top-right-radius: 25px;
}

.goalbannerBottom {
	border-top:10px solid #123C62;
	padding-top:30px;
}

.goalbanner p,.goalbannerBottom p {
font-size: 0.750em;
font-weight: 700;
font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
line-height: 115%;
padding: 0;
margin: 0 0 0 0;
color:white;
}

.goalbanner p span,.goalbannerBottom p span {
font-family: 'Londrina Solid', sans-serif !important;
font-size: 2em!important;
font-weight: normal!important;
}

/* goalbanner ends */


/* challenge dates begins */

.challengeDates {
width: 100%;
position: relative;
margin: auto;
padding: 10px 3%;
background:  var(--complementary1);
text-align: center;
height:auto;
display:block;
color:white;
}


/* challenge dates ends */




/* schooltitlebanner begins */
.schooltitlebanner {
width: 100%;
position: absolute;
margin: 0 auto;
padding: 10px 3%;
background: #133c63;
text-align: center;
border:0;
z-index: 99;
top: 0;
}

.schooltitlebanner p {
color: #fff;
font-size: 1.15em;
font-weight: 700!important;
font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
line-height: 110%;
padding: 0;
letter-spacing: -0.035em;
margin: 0 0 0 0;
}
/* schooltitlebanner ends */

/* loginform begins */

.loginform {
position: relative;
width: 60%;
max-width: 600px;
text-align: center;
display: block;
margin: 0 auto;
padding: 0;
border: 0;
background-color:white;
-webkit-border-radius: 25px;
-moz-border-radius: 25px;
border-radius: 25px;
}

.loginform form {
text-align: left!important;
padding: 10px 0 0 0;
border: 0;
}

.loginform form p {
margin: 0 0 5px 0;
font-size: 0.7em;
font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
font-weight: 600;
}

.loginform label {
display: block;
text-transform: uppercase;
letter-spacing: 1px;
font-weight: 700;
font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
}


.loginform input[type="text"],
.loginform input[type="password"] {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 15px 20px;
margin: 10px auto;
width: 90%;
border: 0;
background: antiquewhite;
color: #6b9d41;
display: block;
font-weight: 600;
font-size: 1.6em;
-webkit-appearance: none;
-moz-appearance: none;
-ms-appearance: none;
-o-appearance: none;
appearance: none;
font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
-webkit-border-radius: 50px;
-moz-border-radius: 50px;
-o-border-radius: 50px;
-khtml-border-radius: 50px;
border-radius: 50px;
}

.loginform input[type="text"]:focus,
.loginform input[type="password"]:focus {
border-color: #ec6829;
color: #ec6829;
}

.loginform input:focus {
outline: 0;
}

input::-webkit-input-placeholder {
color: rgba(7, 182, 213, 0.75)!important;
}
input:-moz-placeholder { /* Firefox 18- */
color: rgba(7, 182, 213, 0.75)!important;
}
input::-moz-placeholder {  /* Firefox 19+ */
color: rgba(7, 182, 213, 0.75)!important;
}
input:-ms-input-placeholder {
color: rgba(7, 182, 213, 0.75)!important;
}


.loginform button,.signUpButton {
  text-align: center;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
font-family: 'Londrina Solid', sans-serif !important;
display: block;
margin: 20px auto 0 auto;
padding: 15px 0;
width: 90%;
border: none;
background: var(--complementary1);
color: #ffffff;
text-transform: uppercase;
letter-spacing: 1px;
font-size: 2em;
-webkit-appearance: none;
-moz-appearance: none;
-ms-appearance: none;
-o-appearance: none;
appearance: none;
-webkit-border-radius: 50px;
-moz-border-radius: 50px;
-o-border-radius: 50px;
-khtml-border-radius: 50px;
border-radius: 50px;
-webkit-transition: 300ms linear 0s;
-moz-transition: 300ms linear 0s;
-o-transition: 300ms linear 0s;
transition: 300ms linear 0s;
}
.loginform button:hover,.signUpButton:hover { background: var(--colour1); }

.signUpButton {padding:20px 15px;background: #EA515D;}
.signUpButton:hover { background: #FDC712; }

.loginform button:active {
transform: translateY(5px);
}

/* loginform ends */





/* challengebuttons begin */

.sheriffschallengebutton  {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
font-family: 'Londrina Solid', sans-serif !important;
display: block;
-webkit-appearance: none;
-moz-appearance: none;
-ms-appearance: none;
-o-appearance: none;
appearance: none;
-webkit-border-radius: 50px;
-moz-border-radius: 50px;
-o-border-radius: 50px;
-khtml-border-radius: 50px;
border-radius: 50px;
-webkit-transition: 300ms linear 0s;
-moz-transition: 300ms linear 0s;
-o-transition: 300ms linear 0s;
transition: 300ms linear 0s;
margin: 30px auto 30px auto;
width: 80%;
max-width: 440px;
height: 60px;
position: relative;
border: 0;
padding: 10px 5%;
color: #ffffff;
font-size: 2em;
text-align: right;
cursor:pointer;
background: #03b6d2;
z-index: 9;
}


.sheriffschallengebutton::before  {
content: url(../img/sheriffschallengeicon.png);
position: absolute;
top: -30px;
left: -15px;
z-index: 99;
}


/* challengebuttons end */




/* signup button begins */

.signup {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
display: block;
position: absolute;
right: 0;
top: 0;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
-webkit-justify-content: space-around;
-ms-flex-pack: distribute;
justify-content: space-around;
margin: 0;
padding: 0;
width: 80px;
height: 50px;
border: none;
background: #03b6d2;
color: #ffffff;
font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
font-weight: 700;
font-size: 11px;
line-height: 100%;
text-align: center;
line-height: 110%!important;
letter-spacing: -0.035em;
-webkit-appearance: none;
-moz-appearance: none;
-ms-appearance: none;
-o-appearance: none;
appearance: none;
-webkit-transition: 300ms linear 0s;
-moz-transition: 300ms linear 0s;
-o-transition: 300ms linear 0s;
transition: 300ms linear 0s;
cursor:pointer;
}

.signup:hover {
background: #ec6829;
}

/* signup button ends */





/* custom select drop-down css begins */

div.cs-select {
display: block;
vertical-align: middle;
position: relative;
margin: 0 auto 0 auto;
text-align: left;
font-size: 1.5em;
width: 100%;
max-width: 400px;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-appearance: none;
-moz-appearance: none;
z-index: 99;
font-family: 'Londrina Solid', sans-serif;
background: #133c63;
color: #fff;
-webkit-border-radius: 50px;
-moz-border-radius: 50px;
-o-border-radius: 50px;
-khtml-border-radius: 50px;
border-radius: 50px;
-webkit-tap-highlight-color: rgba(0,0,0,0)!important;
}



@media screen and (max-width: 479px) {

div.cs-select {
font-size: 1em;
max-width: 300px;
-webkit-tap-highlight-color: rgba(0,0,0,0)!important;
}

}


div.cs-select:focus {
outline: none;
}

.cs-select select {
display: none;
}


.cs-select span {
display: block;
position: relative;
cursor: pointer;
padding: 0.5em 5%;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
z-index: 99;
}

/* placeholder and selected option */
.cs-select > span {
padding-right: 0;
}

.cs-select > span::after,
.cs-select .cs-selected span::after {
speak: none;
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}

.cs-select > span::after {
color: #fff;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}

.cs-select > span::after {
content: '\25BE';
right: 1em;
}

.cs-select .cs-selected span::after {
content: '\2713';
margin-left: 1em;
}

.cs-select.cs-active > span::after {
-webkit-transform: translateY(-50%) rotate(180deg);
transform: translateY(-50%) rotate(180deg);
}

div.cs-active {
z-index: 999;
}


/* options */
.cs-select .cs-options {
position: absolute;
overflow: hidden;
width: 94%;
margin: 0 auto;
visibility: hidden;
overflow: visible;
background: transparent;
opacity: 1;
color: #133c63;
padding-bottom: 0.5em;
pointer-events: none;
top: 2.5em;
left: 0;
right: 0;
}



.cs-select.cs-active .cs-options {
visibility: visible;
pointer-events: auto;
}

.cs-select ul {
list-style: none;
margin: 0;
padding: 0;
width: 100%;
}

.cs-select ul span {
padding: 0.5em;
}

.cs-select ul li.cs-focus span {
background-color: #fff;
}




.cs-select .cs-options > ul::before {
content: '';
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
-webkit-transform: scale3d(1,0,1);
transform: scale3d(1,0,1);
background: #fff;
-webkit-transform-origin: 50% 0%;
transform-origin: 50% 0%;
-webkit-transition: -webkit-transform 0.3s;
transition: transform 0.3s;
}

.cs-select.cs-active .cs-options > ul::before {
-webkit-transform: scale3d(1,1,1);
transform: scale3d(1,1,1);
-webkit-transition: none;
transition: none;
-webkit-animation: expand 0.6s ease-out;
animation: expand 0.6s ease-out;
}

.cs-select .cs-options ul li {
opacity: 0;
-webkit-transform: translate3d(0,-25px,0);
transform: translate3d(0,-25px,0);
-webkit-transition: opacity 0.15s, -webkit-transform 0.15s;
transition: opacity 0.15s, transform 0.15s;
}

.cs-select.cs-active .cs-options ul li {
-webkit-transform: translate3d(0,0,0);
transform: translate3d(0,0,0);
opacity: 1;
-webkit-transition: none;
transition: none;
}


.cs-select .cs-options span:hover,
.cs-select .cs-options li.cs-focus span,
.cs-select .cs-options .cs-selected span {
color: #fff;
background: #ec6829;
}

.cs-select .cs-options .cs-selected span::after {
content: '';
}


@-webkit-keyframes expand {
0% { -webkit-transform: scale3d(1,0,1); }
25% { -webkit-transform: scale3d(1,1.2,1); }
50% { -webkit-transform: scale3d(1,0.85,1); }
75% { -webkit-transform: scale3d(1,1.05,1) }
100% { -webkit-transform: scale3d(1,1,1); }
}

@keyframes expand {
0% { -webkit-transform: scale3d(1,0,1); transform: scale3d(1,0,1); }
25% { -webkit-transform: scale3d(1,1.2,1); transform: scale3d(1,1.2,1); }
50% { -webkit-transform: scale3d(1,0.85,1); transform: scale3d(1,0.85,1); }
75% { -webkit-transform: scale3d(1,1.05,1); transform: scale3d(1,1.05,1); }
100% { -webkit-transform: scale3d(1,1,1); transform: scale3d(1,1,1); }
}


@-webkit-keyframes bounce {
0% { -webkit-transform: translate3d(0,-25px,0); opacity:0; }
25% { -webkit-transform: translate3d(0,10px,0); }
50% { -webkit-transform: translate3d(0,-6px,0); }
75% { -webkit-transform: translate3d(0,2px,0); }
100% { -webkit-transform: translate3d(0,0,0); opacity: 1; }
}

@keyframes bounce {
0% { -webkit-transform: translate3d(0,-25px,0); transform: translate3d(0,-25px,0); opacity:0; }
25% { -webkit-transform: translate3d(0,10px,0); transform: translate3d(0,10px,0); }
50% { -webkit-transform: translate3d(0,-6px,0); transform: translate3d(0,-6px,0); }
75% { -webkit-transform: translate3d(0,2px,0); transform: translate3d(0,2px,0); }
100% { -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); opacity: 1; }
}



/* custom select drop-down css ends */




/* table begins */

table {
border: 0;
}

.stripedtable
{
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
font-weight: 600;
position: relative;
float: none;
overflow: hidden;
margin:0 auto;
padding: 0;
width: 100%;
max-width: 100%;
text-align: left;
border-collapse: collapse;
border: 0;
background-color:white;
}
.stripedtable th
{
font-family: 'Londrina Solid', sans-serif !important;
font-weight: normal!important;
font-size: 30px;
line-height: 80%;
padding: 10px 5% 0 5%;
color: #fff;
border: 0;
font-weight: 700;
background: var(--colour2);
letter-spacing: 0.075em;
margin: 0;
text-align:center;
}

.tablesubtitle
{
font-size: 15px;
font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif!important;
font-weight: 500!important;
color: #03b6d2!important;
padding: 0;
letter-spacing: 0!important;
margin: 0 0 10px 0!important;
display: block;
}
.stripedtable td
{
padding: 0px 5%;
color: #133c63;
line-height: 110%;
border: 0;
}

.stripedtable tr
{
border: 0;
cursor:pointer;
}
.stripedtable .odd
{
background: #03b6d2;
border: 0;
}

.tablefootbg {
background: #133c63;
border: 0;
}

/* stripedtable begins */

/* teamrankingtable table begins */
#teamrankingtable {
font-size: 28px;
font-weight: 700;
letter-spacing: -0.035em;
font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
margin: 0 auto;
width: 100%;
text-align: left;
border-collapse: collapse;
}

#teamrankingtable td {
padding: 10px;
color: #133c63;
border: 3px solid #ffffff;
}
.column-first {
background: #03b6d2;
font-weight: 600;
font-size: 18px;
border-right: 3px solid #ffffff;
border-left: 3px solid #ffffff;
}
/* teamrankingtable table ends */

/* progressbar begins */

.progressbarcontainer {
width: 100%;
position: relative;
margin:auto;
padding: 10px 3%;
background:  var(--complementary1);
text-align: center;
color:white;
}

#progressBarDiv {margin-top:5px!important;}

.progressbarcontainer p{
font-weight: 500;
line-height: 105%;
padding: 0!important;
margin: 0 auto;
}

.progress {
  width: 100%;
  height: 30px;
  margin:auto!important;
  max-width: 480px;
}

.progress-wrap {
  background: #ec6829;
  margin: 5px 0;
  overflow: hidden;
  position: relative;

-webkit-border-radius: 50px;
-moz-border-radius: 50px;
-o-border-radius: 50px;
-khtml-border-radius: 50px;
border-radius: 50px;

}

.progress-wrap .progress-bar {
  background: #ffffff;
  left: 0;
  position: absolute;
  top: 0;
}

/* progressbar ends */

/* search box with search hints dropdown begins */

.search {
    position: relative;
    margin: 20px auto 50px auto;
    width: 90%;
}

.search input {
padding: 8px 5%;
margin: 10px auto;
width: 90%;
border: 0;
color: var(--complementary1);
display: block;
font-size: 1.25em;
font-family: 'Londrina Solid', sans-serif !important;
letter-spacing: 0.035em;
-webkit-appearance: none;
-moz-appearance: none;
-ms-appearance: none;
-o-appearance: none;
appearance: none;
-webkit-border-radius: 50px;
-moz-border-radius: 50px;
-o-border-radius: 50px;
-khtml-border-radius: 50px;
border-radius: 50px;
    background: #fff url("../img/searchicon.png") center right 5% no-repeat;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

.search input:focus {
    outline: 0;
color: var(--complementary1);

}

/* disabled by NG
.search input:focus + .results { display: block; }
*/

.search .results {
    display: none;
    position: relative;
    top: 0;
    left: 0;
    right: 0;
    z-index: 99;
    padding: 0;
    margin: 0 auto;
        background: #fff;
width: 86%;
}

.search .results li { display: block; }

.search .results a {
    display: block;
    position: relative;
    margin: 0 -1px;
    padding: 10px 5% 10px 5%;
    color: rgba(19, 60, 99, 0.5);
    font-weight: 700;
font-size: 1em;
}


.search .results a:hover {
    text-decoration: none;
    color: #fff;
    background-color: #ec6829;
}


/* search box with search hints dropdown ends */

/* animated bigbutton begins */

.bigbuttoncontainer {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
width:80%;
min-height: 200px;
min-width: 200px;
text-align: center;
margin: 0 auto;
position: relative;
display: block;
font-size: 4em;
color: #fff;
font-weight: 700;
padding:0;
border: 0;
}

.bigbuttonholdingimg {
position: relative;
text-align: center;
margin: 0 auto;
border: 0;
outline: 0;
z-index: 1;
width: 100%;
height: 100%;
z-index: -1;
border:0;
}

.bigbutton {
width:200px;
height:100px;
text-align: center;
margin: 0 auto;
position: absolute;
display: block;
font-size: 4em;
color: #fff;
font-weight: 700;
padding: 0;
border: 0;
font-size: 80px;
  left: 50%;
  top: 50%;
 transform: translate(-50%, -50%);
}



.cbutton {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
width: 100%;
height: auto;
position: relative;
display: block;
margin: 0 auto;
padding:0;
border: none;
background: none;
color: #ffffff;
overflow: visible;
-webkit-transition: color 0.85s;
transition: color 0.85s;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
border: 0;
background: transparent url(../img/bigbutton.png) no-repeat center center;
-webkit-background-size: 98% auto;
-moz-background-size: 98% auto;
-o-background-size: 98% auto;
background-size: 98% auto;
z-index: 99;
padding: 0;
}



.cbutton.cbutton--click,
.cbutton:focus {
outline: none;
color: #ffffff;
}
.cbutton--click::after {
-webkit-animation: anim-effect-bigbuttontap 0.5s forwards;
animation: anim-effect-bigbuttontap 0.5s forwards;
}

.cbutton::after {
position: absolute;
top: 50%;
left: 50%;
margin: -35px 0 0 -35px;
width: 70px;
height: 70px;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
-o-border-radius: 50%;
-khtml-border-radius: 50%;
border-radius: 50%;
content: '';
opacity: 0;
pointer-events: none;
background: rgba(255, 255, 255, .85);
}


@-webkit-keyframes anim-effect-bigbuttontap {
0% {
opacity: 1;
-webkit-transform: scale3d(0.1, 0.1, 1);
transform: scale3d(0.1, 0.1, 1);
}
100% {
opacity: 0;
-webkit-transform: scale3d(8, 8, 1);
transform: scale3d(8, 8, 1);
}
}

@keyframes anim-effect-bigbuttontap {
0% {
opacity: 1;
-webkit-transform: scale3d(0.1, 0.1, 1);
transform: scale3d(0.1, 0.1, 1);
}
100% {
opacity: 0;
-webkit-transform: scale3d(8, 8, 1);
transform: scale3d(8, 8, 1);
}
}

/* animated bigbutton ends */

.savebutton  {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
font-family: 'Londrina Solid', sans-serif !important;
display: block;
margin: 20px auto 0 auto;
padding: 10px;
width: 260px;
border: none;
background: var(--complementary1);
color: #ffffff;
font-size: 24px;
-webkit-appearance: none;
-moz-appearance: none;
-ms-appearance: none;
-o-appearance: none;
appearance: none;
line-height: 105%!important;
-webkit-border-radius: 50px;
-moz-border-radius: 50px;
-o-border-radius: 50px;
-khtml-border-radius: 50px;
border-radius: 50px;
-webkit-transition: 300ms linear 0s;
-moz-transition: 300ms linear 0s;
-o-transition: 300ms linear 0s;
transition: 300ms linear 0s;
}

.savebutton:hover {
background: var(--colour1);
}

.savebutton:active {
transform: translateY(5px);
}

.backbutton  {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
font-family: 'Londrina Solid', sans-serif !important;
display: block;
margin: 20px auto 0 auto;
padding: 8px 5%;
border: none;
background: #609339;
color: #ffffff;
font-size: 1.15em;
-webkit-appearance: none;
-moz-appearance: none;
-ms-appearance: none;
-o-appearance: none;
appearance: none;
-webkit-border-radius: 50px;
-moz-border-radius: 50px;
-o-border-radius: 50px;
-khtml-border-radius: 50px;
border-radius: 50px;
-webkit-transition: 300ms linear 0s;
-moz-transition: 300ms linear 0s;
-o-transition: 300ms linear 0s;
transition: 300ms linear 0s;
}

.backbutton:hover {
background: #ec6829;
}

.backbutton:active {
transform: translateY(5px);
}


.buttonColour2 {
background-color:orange;
}

/* ratings stars begin */

.starratingscontainer {
  width: 100%px;
text-align: center;
position: relative;
overflow: hidden;
margin: 0 auto;
border: 0;
text-align: center;
}
div.stars {
  width: 270px;
height: 30px;
line-height: 30px;
  display: block;
text-align: center;
position: relative;
margin: 0 auto;
border: 0;
}

input.star { display: none; }

label.star {
  float: right;
  padding: 0 3px;
  font-size: 22px;
  color: #ffffff;
  transition: all .2s;
font-weight: 700;
}

input.star:checked ~ label.star:before {
  content: '\f005';
  color: #ec6829;
  transition: all .25s;
}

input.star-5:checked ~ label.star:before {
  color: #ec6829;
}

input.star-1:checked ~ label.star:before { color: #ec6829; }


label.star:before {
  content: '\f006';
  font-family: FontAwesome;
}

/* ratings stars end */

/********************************************************  media queries begin  *********************************************************/

/* START Smartphones (landscape) ----------- */
@media only screen and (min-width : 479px) and (max-width : 768px) {
.innercontentwrapper, .innercontentwrapperwide, .innercontenttopwrapper5, .innercontenttopwrapper10, .innercontenttopwrapper15, .innercontenttopwrapper25 {
width: 95%;
}

.loginform {
position: relative;
width: 60%;
max-width: 60%;
}

.loginform form {
padding: 0 0 0 0;
}

.loginform button, .loginform input[type="text"],
.loginform input[type="password"] {
padding: 5px 20px;
}

.loginform button {
margin: 15px auto 0 auto;
}

.smallicon {
margin: 5px 5px;
}

.sheriffschallengebutton  {
width: 60%;
max-width: 340px;
min-width: 300px;
height: 60px;
padding: 15px 5%;
font-size: 1.5em;
margin: 30px auto 30px auto;
}


.apptitlepink {
font-size: 1.4em;
}

.floatimageright50 {
max-width: 45.5%;
}

.floatimageleft50 {
max-width: 45.5%;
}


.savebutton  {
width: 40%;
}

.textbanner p span {
font-size: 2em!important;
}

.bigbutton {
width:150px;
height: 150px;
line-height: 150px;
}

}
/* END Smartphones (landscape) ----------- */

/* START Smartphones (portrait) ----------- */
@media only screen and (max-width : 479px) {

.innercontentwrapper, .innercontentwrapperwide, .innercontenttopwrapper5, .innercontenttopwrapper10, .innercontenttopwrapper15, .innercontenttopwrapper25 {
width: 95%;
padding-bottom:55%;
}

.portraitOverride {
	width:96% !important;
}

.loginform {
position: relative;
width: 60%;
max-width: 60%;
}

.loginform form {
padding: 5px 0 0 0;
}

.loginform button, .loginform input[type="text"],
.loginform input[type="password"] {
padding: 5px 20px;
}

.loginform button {
margin: 15px auto 0 auto;
}

.smallicon {
margin: 5px 1px;
}

.challengebutton {
width: 80%;
max-width: 440px;
padding: 10px 5%;
font-size: 1.5em;
}

.sheriffschallengebutton  {
width: 60%;
max-width: 270px;
min-width: 270px;
height: 60px;
padding: 15px 5%;
font-size: 1.25em;
margin: 30px auto 30px auto;
}

.apptitlepink {
font-size: 1.4em;
}

.floatimageright50 {
max-width: 45.5%;
}

.floatimageleft50 {
max-width: 45.5%;
}

.challengelogo {
width: 100%;
}

.homeimg {
width:100%;
}

.savebutton  {
width: 60%;
}

.textbanner p span {
font-size: 2em!important;
}

.bigbutton {
width:150px;
height: 150px;
line-height: 150px;
}

}
/* END Smartphones (portrait) ----------- */


/* START iPads (portrait) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {


.innercontentwrapper, .innercontentwrapperwide, .innercontenttopwrapper5, .innercontenttopwrapper10, .innercontenttopwrapper15, .innercontenttopwrapper25 {
width: 95%;
}

.loginform {
position: relative;
width: 60%;
max-width: 60%;
}

.savebutton  {
width: 40%;
}


}
/* END iPads (portrait) ----------- */


/* highres' assets for Mac Retina and HD screens ----------- */
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-moz-min-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {

}

/*  media queries end  */

/* NG iTQ9 additions */

.AWinfoScreen {
  -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    -o-border-radius: 20px;
    -khtml-border-radius: 20px;
    border-radius: 20px;
    background-color: white;
    margin-top:25px;
    padding:15px;
}

.AWinfoLogo {margin:auto;margin-top:25px;margin-bottom:25px;}
.AWcontainer {
  width:100%;
  background-color:white;
  -webkit-border-bottom-right-radius: 25px;
	-webkit-border-bottom-left-radius: 25px;
	-moz-border-radius-bottomright: 25px;
	-moz-border-radius-bottomleft: 25px;
	border-bottom-right-radius: 25px;
	border-bottom-left-radius: 25px;
}
.AWfullLeaderboardTable {
  -webkit-border-bottom-right-radius: 25px;
	-webkit-border-bottom-left-radius: 25px;
	-moz-border-radius-bottomright: 25px;
	-moz-border-radius-bottomleft: 25px;
	border-bottom-right-radius: 25px;
	border-bottom-left-radius: 25px;
  width:96%;
}
.AWfullLeaderboardTable td {padding:10px;}
.AWevenRow { background-color:#EFEFEF; }
.AWoddRow { background-color:#DFDFDF; }
.AWevenRow:hover,.AWoddRow:hover { background-color:lightcyan; }
.AWrecordScreenTable td {
  padding:10px 5px;
  text-align: left;
}
#challengeInfo {max-width: 420px;margin:auto;text-align: justify;}

.challengeList,.challengeArchiveList {
margin:auto;
width:100%;
margin-top:5px;
float:left;
text-align:center;
}

.challengeListName { }
.challengeSelectTitle {
clear:both;
margin:auto;
margin-bottom:10px;
width:500px;
max-width:90%;
	background-color: var(--complementary2);
	color: #FFFFFF;
	font-family: 'Londrina Solid', sans-serif;
	font-size: 1.8em;
  padding:18px 5px;
  padding-left:32px;
	-webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    -o-border-radius: 50px;
    -khtml-border-radius: 50px;
    border-radius: 50px;
cursor:pointer;
display:block;
text-align:left;
}
.challengeSelectTitle:hover { background-color:var(--colour2); }
.displayPercentDiv {
float:left;
}
#offlineMessage {
	display:none;
	width:100%;
	margin:auto;
	margin-top:20px;
	font-size:1.3em;
	text-align:center;
	max-width:365px;
	background-color:white;
	padding:5px;
	margin-bottom:10px;
	-webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    -o-border-radius: 15px;
    -khtml-border-radius: 15px;
    border-radius: 15px;
}
.warningText {
	color:red;
	font-weight:bold;
}
.homeicon {
	position:absolute;
	left:0;
	top:0;
}
.liveText {
	color:#133c63 !important;
}
.challengeArchiveList {
	display:none;
}
.lapEntryField {
	width:100px;
  height:50px;
  padding-right:10px;
	font-size:20px;
  color:#6b9d41;
	text-align:center;
-webkit-border-radius: 50px;
-moz-border-radius: 50px;
-o-border-radius: 50px;
-khtml-border-radius: 50px;
border-radius: 50px;
border: 0;
font-weight: 700;
}

.otherDescription {
	width:300px;
  height:40px;
  padding-left:10px;
	font-size:18px;
  color:#6b9d41;
	text-align:center;
-webkit-border-radius: 50px;
-moz-border-radius: 50px;
-o-border-radius: 50px;
-khtml-border-radius: 50px;
border-radius: 50px;
border: 0;
font-weight: 700;
text-align: left;
}
.hideUntilOtherSelected { display: none; }
.classSelectDropdown {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box;
  font-size: 20px;
  font-weight: 700;
  font-family: 'HelveticaNeue', 'Helvetica Neue', Helvetica, Arial, sans-serif;letter-spacing: 0.035em;
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  -o-appearance: none;
  appearance: none;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  -o-border-radius: 50px;
  -khtml-border-radius: 50px;
  border-radius: 50px;
  background: #fff;
  padding: 8px;
  padding-right:35px;
  margin: 0;
  width: auto;
  border: 0;
  color: #6b9d41;
  display: inline-block;
  background: url("../img/br_down.png") white no-repeat 97% !important;
}
#loggedInLink {
	display:none;
	float:left;
	width:100%;
}
#cancelButton {
/*	display:none; */
}

.distancelist {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
-o-box-sizing: border-box;
box-sizing: border-box;
font-size: 20px;
font-weight: 700;
font-family: 'HelveticaNeue', 'Helvetica Neue', Helvetica, Arial, sans-serif;letter-spacing: 0.035em;
-webkit-appearance: none;
-moz-appearance: none;
-ms-appearance: none;
-o-appearance: none;
appearance: none;
-webkit-border-radius: 50px;
-moz-border-radius: 50px;
-o-border-radius: 50px;
-khtml-border-radius: 50px;
border-radius: 50px;
background: #fff;
padding: 8px;
padding-right:35px;
margin: 0;
width: auto;
max-width: 200px;
border: 0;
color: #6b9d41;
display: inline-block;
text-align:center!important;
background: url("../img/br_down.png") white no-repeat 75% !important;

/******* for using on a separate line....
display: block;
position: relative;
margin: 6px auto;
********/
}

.distancelist:focus {
outline: 0;
color: #ec6829;
}
#teamName {
	font-size:170%;
	display:block;
	margin-top:5px;
	margin-bottom:15px;
  font-weight: bold;
}
#classSelect {
	font-size:130%;
	display:block;
	margin-top:5px;
	margin-bottom:15px;
}
#teamNameSpan {
	font-size:120% !important;
	width:100%;
	float:left;
  margin-top:20px;
  margin-bottom:10px;
}
#milesSpan,#kmSpan,#teamMembers,#milesTotal,#kmTotal,#caloriesTotal {
	font-size:120% !important;
}
.leaderboardNumber {
	width:45px;
}
.leaderboardNumberCol {
	width:18%;
}
.leaderName {
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	-o-border-radius: 20px;
	-khtml-border-radius: 20px;
	border-radius: 20px;
	font-size:22px;
	color:white !important;
    float: left;
    width: 96%;
    padding-top: 	10px !important;
    padding-bottom: 10px !important;
}
.leaderName a {

}

.leaderBoardAllTotal { text-align:right;}

/* 1=orange, 2=light blue, 3=pink, 4=green, 5=dark blue */
.leaderName1 { background-color:#EC682A; }
.leaderName2 { background-color:#0DACB6; }
.leaderName3 { background-color:#EC62A0; }
.leaderName4 { background-color:#92C022; }
.leaderName5 { background-color:#123C62; }

.searchForm {
	background-color:var(--complementary1);
	width:100%;
	margin:auto;
	float:left;
	-webkit-border-bottom-right-radius: 25px;
	-webkit-border-bottom-left-radius: 25px;
	-moz-border-radius-bottomright: 25px;
	-moz-border-radius-bottomleft: 25px;
	border-bottom-right-radius: 25px;
	border-bottom-left-radius: 25px;
	padding-bottom:20px;
  margin-bottom:25px;
}
.dateTitle, leaderSubText {
	color:#123C62;
}
.leaderSubText {
	width:100%;
	text-align:center;
	float:left;
	margin-top:15px;
}
.leaderboardHeading {
	padding-bottom:10px;
	display:block;
}
.teamDetailsContent {
	width:80%;
	text-align:left;
	margin:auto;
	color:white;
}
.teamDetailRow {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
-webkit-border-radius: 50px;
-moz-border-radius: 50px;
-o-border-radius: 50px;
-khtml-border-radius: 50px;
border-radius: 50px;
padding: 12px 4% 12px 8%;
display:block;
float:left;
width:100%;
}
.teamDetailRow1 { background-color:#EC682A; margin-top:15px; }
.teamDetailRow2 { background-color:#0DACB6;  }
#numberOfTeamsSpan,#rankingSpan {
float:right;
position: relative;
display: inline-block;
font-size:24px;
background-color:white;
color:#123C62;
-webkit-border-radius: 50px;
-moz-border-radius: 50px;
-o-border-radius: 50px;
-khtml-border-radius: 50px;
border-radius: 50px;
padding: 0;
text-align:center;
width: 40px;
height: 40px;
line-height: 40px;
}
#caloriesDisplay {
	display:none;
}
.challengeIconLeaderboard {
	max-width:200px;
  max-height:132px;
	vertical-align:middle;
	margin-left:20px;
}
#challengeName {
  font-family: 'Londrina Solid', sans-serif !important;
  background-color:var(--complementary4);
  color:var(--colour2);
  padding:15px !important;
  font-size:30px;
  display: block;
  position: relative;
  vertical-align:middle;
  font-size:30px !important;
  display: block;
  line-height: 110%;
  text-align: center;
  border-radius: 25px;
}
.challengeNameHolder {
  background-color: var(--complementary1);
  padding-left:15px;
  padding-right: 15px;
}
.teamResultsRow {
display: inline-block;
max-width: 78%;
line-height: 105%;
font-size: 18px;
font-weight: bold;
}

#archiveMessage {
	display:block;
	color:red;
	margin-bottom:10px;
}

#archiveMessage { display:none; }

.lessTopPadding {
	padding-top:5% !important;
}
.challengeNameRow {
	width:100%;
	text-align:center;
	height:50px;
}
.challengeNamePageTitle {
	font-family:'Londrina Solid', sans-serif !important;
	background-color:navajowhite;
	color:#609339 !important;
	padding:15px !important;
	font-size:30px;
	width:100%;
	float:left;
	text-align:center;
	margin-bottom:8px;
  border-radius: 25px;
}
.orText {font-weight: bold; font-size:22px;}
.achieveWellWrapper {
  background-color:var(--colour5);
  -webkit-border-radius: 25px;
	-moz-border-radius: 25px;
	border-radius: 25px;
  padding:15px;
  margin-bottom: 50px;
}
.schoolClassesTable {background:white;width:100%;margin-top:15px;float:left;}
.schoolClassesTable tr {border-bottom:1px solid orange;}
.schoolClassesTable tr:hover {background-color:#DFDFDF;}
.schoolClassesTable td {padding:10px;}

.textRight {text-align: right;}

#leaderBoardDiv {margin-bottom:50px;}

.checkpointsDisplay {
  clear:both;
  width: 100%;
  float:left;
  margin-top:5px;
}
.checkpointReached {background-color:yellowgreen;}
.checkpointNotReached {background-color:lightcoral;}
.checkpointYesNoImage {width:24px;}