body {
	color: white;
}
body.home, body.contact, body.classes, body.randomclass {
	color: black;
}
body.quickquiz {
	background: black url(https://mathsstarters.net/images/bkg_random_grey_variations.png);
}
body.numoftheday {
	background: #fafafa url(https://dedhk00m7fqyl.cloudfront.net/ms/images/bkg_escheresque.png);
}
body.numbersgame {
	background: black url(https://dedhk00m7fqyl.cloudfront.net/ms/images/bkg_ms_tng.png);
}
body.bingo {
	background: black url(https://dedhk00m7fqyl.cloudfront.net/ms/images/crissXcross.png);
}
body.dicepage {
	background: black url(https://dedhk00m7fqyl.cloudfront.net/ms/images/blue_stripe.png);
}
body.randomclass, body.randomgroups {
	background: black url(https://mathsstarters.net/images/bkg_swirl_pattern.png);
}
body.random {
	background: black url(https://mathsstarters.net/images/purple_stripe.png);
}
#site {
	background-color: #b60a01;
	background-image: url(//dedhk00m7fqyl.cloudfront.net/cmn/images/hdr_starters.png);
	color:#fff;
	box-shadow: -3px 3px 6px #222, 0px 3px 6px #222;
	padding: 20px 0 10px 0;
}
body.home #site {
	color:#fff;
	padding: 20px 0 10px 0;
}

body.classes #site {
	color:#fff;
	padding: 20px 0 10px 0;
}


#contentbox {
	background-color: rgba(0,0,0,0.5);
	padding: 1rem 3rem;
	-moz-border-radius: 30px;
	-webkit-border-radius: 30px;
	border-radius: 30px;
	box-shadow: 3px 3px 6px #222;
	font-size: 1.8rem;
}
.quickquiz #contentbox {
	border: 6px solid #2ECC40;
}
.numoftheday #contentbox {
	border: 6px solid #2DB6B6;
}
.numbersgame #contentbox {
	border: 6px solid #014dad;
}
.bingo #contentbox {
	border: 6px solid #F30E02;
}
.dicepage #contentbox {
	border: 6px solid #0500A1;
}
.randomgroups #contentbox {
	margin: 0 20px;
}
.random #contentbox {
	border: 6px solid #57019E;
}
h1 span {
	font-weight: 100;
}
h1.activity {
	text-align: center;
	font-weight: 600 !important;
	letter-spacing: 0.3rem;
	-webkit-transition: all 600ms cubic-bezier(0.39, 0.575, 0.565, 1);
	transition:         all 600ms cubic-bezier(0.39, 0.575, 0.565, 1);
}
.quickquiz h1.activity {
	text-shadow: 2px 2px 2px #2ECC40,2px -2px 2px #2ECC40,-2px 2px 2px #2ECC40,-2px -2px 2px #2ECC40;
}
.numoftheday h1.activity {
	text-shadow: 2px 2px 2px #2DB6B6, -2px 2px #2DB6B6,-2px 2px 2px #2DB6B6,-2px -2px 2px #2DB6B6;
	font-family: 'Delius Unicase', cursive;	
}
.numbersgame h1.activity {
	color: #014dad;
	text-shadow: 2px 2px 2px #eee,2px -2px 2px #eee,-2px 2px 2px #eee,-2px -2px 2px #eee;
}
.bingo h1.activity {
	text-shadow: 2px 2px 2px #F30E02,2px -2px 2px #F30E02,-2px 2px 2px #F30E02,-2px -2px 2px #F30E02;
	font-family: Impact, Charcoal, sans-serif;
	text-transform: uppercase;
}
.dicepage h1.activity {
	text-shadow: 2px 2px 2px #0500A1,2px -2px 2px #0500A1,-2px 2px 2px #0500A1,-2px -2px 2px #0500A1;
	text-transform: uppercase;
	font-family: 'Black Ops One', cursive;
}
.random h1.activity {
text-shadow: 2px 2px 2px #7802DA,2px -2px 2px #7802DA,-2px 2px 2px #7802DA,-2px -2px 2px #7802DA;
}
h1.bigger {
	font-size: 4em;
}

/* -- on startup -- */
#quiz, #quickquizmenu, #check, .bingo #controls, .bingo #menubox, #instructions {
	display: none;
}
#loading {
	height: 300px;
	text-align: center;
	padding: 100px;
}

/* -- end on startup -- */

/* -- Quick Quiz, Bingo navs --*/
#quickquizmenu .nav-link, #quickquizmenu .list-group-item, #menubox .nav-link, #menubox .list-group-item {
	padding: 0.5rem 1rem !important;
	font-size: 1.5rem;
	border: 0;
}
a.cust-nav-first {
	background-color: #333;
	margin: 1px;
}
a.cust-nav-first:hover {
	background-color: #555;
	color: white;
}
a.cust-nav-first {
	color: white;
}

a.cust-nav-second {
	background-color: #555;
	margin: 1px;
}
a.cust-nav-second:hover {
	background-color: #777;
	color: white;
}
a.cust-nav-second {
	color: white;
}
/* -- end Quick Quiz, Bingo navs --*/

/* -- Common -- */
.questionline {
	clear: both;
	padding: 2px 0;
	border-bottom: 1px dotted lightblue;
}
/* -- end Common -- */

/* -- Quick Quiz -- */
#quiz {
	display: none;
}
span.qnum {
	float: left;
	width: 2em;
	color: #999;
	margin-left: 1rem;
}
.anshighlight {
	color: #B3DEB3;
	font-weight: bold;
}
#quiz .questionline.questionlineactive .qnum {
color: yellow;
}
.questionline.questionlineactive {
background-color: rgba(255,255,0,0.1);
}
.questionline.questionlineanswer {
background-color: rgba(0,255,0,0.1);
}
.questionline {
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}
.answerstar {
	position: absolute;
	left: -1em;
	
}

/* -- end Quick Quiz -- */

/* -- Number of the Day -- */
.numoftheday #numoftheday {
	display: none; /* because unhidden by js */
	padding: 2.5rem 0;
}
.numoftheday #numoftheday div {
	display: inline;
}
.numbercard {
	text-align: center;
	padding: 0.5rem;
	line-height: 1rem;
	text-align: center;
	border: 1px solid white;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
}
#day .numbercard {
	background: #0F7676;
}
#todaysnum {
	font-size: 1.5em;
}
#todaysnum .numbercard {
	background: #DA8137;
	font-size: 4rem;
	font-weight: bold;
	margin-left: 1rem;
	color: white;
	text-shadow:3px 3px 0 #000,-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000;
	font-family: 'Delius Unicase', cursive;
}
#day {
	float: right;
}
.numoftheday .answer {
	color: #80DBDB;
	font-weight: 600;
	display:none;
	margin-left: 3rem;
	letter-spacing: 0.1rem;
}
#quiztype {
	color: #2DB6B6;
	font-weight: bold;
}

/* -- end Number of the Day -- */

/* -- Numbers Game -- */
.numbersgame p, .numbersgame label {
	padding: 0.5rem 0;
	font-size: 1.3rem;
}
#numbercards {
	text-align: center;
	padding: 0.2em 0;
}
div.number {
	padding: 0.5rem;
	font-size: 6rem;
	font-weight: 600;
	line-height: 6rem;
	text-align: center;
	border: 1px solid white;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	background: #014DAD;
	text-shadow: 3px 3px 3px #333;
	min-height: 6rem;
}
div.find {
	width: 13rem;
	margin: 0 auto;
	padding: 0.5rem;
	font-size: 6rem;
	font-weight: 600;
	line-height: 6rem;
	text-align: center;
	border: 2px solid white;
	-moz-border-radius: 20px;
	-webkit-border-radius: 20px;
	border-radius: 20px;
	background: #00B47D;
	text-shadow: 3px 3px 3px #333;
	min-height: 6rem;
}
body.numbersgame #contentbox a {color: white;}

div#choosecards {
	background: #444;
	text-align: center;
	-moz-border-radius: 50px;
	-webkit-border-radius: 50px;
	border-radius: 50px;
}
div#choosecards form  {
	padding: 10px;
}
/* -- end Numbers Game -- */

/* -- bingo -- */
table {
	border-spacing: 10px;
	margin: 0 auto;
	vertical-align: center;
}
td {
	min-width: 6rem;
	min-height: 6rem;
	padding: 0 1.2rem;
	font-size: 3.5rem;
	text-align: center;
	border: 1px solid white;
	margin: 0;
	font-family: times, "times new roman", serif;
}
#answers.small td {
	font-size: 2.5rem;
	padding: 0 12px;
}
.bingo span.question {
	display: block;
	font-size: 2.8em;
	text-align: center;
	border: 4px solid white;
/*	background: #00B47D;*/
	margin: 0 0.3em;
	font-family: times, "times new roman", serif;
	-moz-border-radius: 15px;
	border-radius: 15px;
	color: #FBB7B4;
	padding: 0.2em 0.2em 1em 0.2em;
}
#questions {
margin: 0.3em 0;
display: none;
min-height: 8em;
}





.subtitle {
	padding: 0;
	margin: -1rem 0 0.5rem 0;
	font-weight: bold;
	font-size: 2rem;
	text-align: center;
	letter-spacing: 00.2rem;
}

#check .modal-content {
	background: black;
	padding: 2rem;
	color: white;
font-size: 96%;
}
#check_answers span {
	font-weight: normal;
}
#check .close {
	color: white;
	opacity: 0.8;
}

.check {
	padding-right: 2rem;
}
#check span.check {
	font-family: times, "times new roman", serif;
	font-weight: normal;
	line-height: 1.5em;
	font-size: 1.2em;
}
.bingo .anshighlight {
	color: #FBB7B4;
}

span.inst {
	font-size: 0.5em;
}
.modal-lg {
max-width: 1024px;
}

/* -- Dice --*/
.dicepage #activitybox,
.dicepage #customsettings,
.dicepage #customsettingssingle,
.dicepage #settingsheading,
.dicepage #answer,
.dicepage #options
{
	display: none;
}
.dicepage #gamehelp {
	padding: 0 10%;
}
.dicepage #gamehelp p, .dicepage #gamehelp a {
	color: #eee;
	margin: 0;
	padding: 0;
	font-size: 1rem;
}
.dicepage .smallnum, .dicepage .largenum {
display:block;
min-width: 2em;
text-align: center;
border: 2px solid white;
float:left;
font-weight: bold;
font-family: monospace;
padding: 0.2em 0;
font-size: 1.5em;
-moz-border-radius: 4px;
border-radius: 4px;
}

.dicepage .numcol1s, .dicepage .numcols {
background: #61D3B1;
}
.dicepage .numcol1l, .dicepage .numcoll {
background: #006D4A;
}
.dicepage .numcol2s {
background: #84A1FF;	
}
.dicepage .numcol2l {
background: #1D3A9C;	
}
.dicepage .numcol1s.negative, .dicepage .numcols.negative {
background: #FF7064;
}
.dicepage .numcol1l.negative, .dicepage .numcoll.negative {
background: #E73827;
}
.dicepage .numcol2s.negative {
background: #A54D78;	
}
.dicepage .numcol2l.negative {
background: #85144b;	
}


#minnum, #timeint {
float: left;
margin: 0 30px 0 0;
}
.dicepage .slider {
width: 250px;
margin: 10px 0;
float:left;
}
.dicepage #maxnum {
float: left;
margin: 0 0 0 30px;
}
.dicepage #activitybox p {
padding-top: 100px;
}

.dicepage #dicebox, .dicepage #diceboxsingle, .dicepage #controls, .dicepage #controlbox {
	margin: 30px auto;
	display: block;

}

.dicepage #roll {
	font-size: 2rem;
	font-weight: 600;
	letter-spacing: 0.4rem;
	font-family: 'Black Ops One', cursive;
	text-transform: uppercase;
	text-shadow: 2px 2px 2px #333, -2px 2px 2px #333, 2px -2px 2px #333, -2px -2px 2px #333;
}
#dicebox .dice {
	display: block;
	margin: 0 10px;
	border: 2px solid white;
		-moz-border-radius: 10px;
		-webkit-border-radius: 10px;
		border-radius: 10px;
	width: 180px;
	text-align: center;
	font-size: 120px;
	line-height: 150px;
	text-shadow: 2px 2px 0 black, -2px 2px 0 black, 2px -2px 0 black, -2px -2px 0 black ;
float: left;
padding: 20px 20px;
}
#diceboxsingle .dice {
	display: block;
/*	margin: 0.5em auto;*/
	border: 2px solid white;
		-moz-border-radius: 10px;
		-webkit-border-radius: 10px;
		border-radius: 10px;
	width: 380px;
	text-align: center;
	font-size: 240px;
	line-height: 300px;
	text-shadow: 2px 2px 0 black, -2px 2px 0 black, 2px -2px 0 black, -2px -2px 0 black ;
	float: left;
}
.dicepage #diceboxsingle .dice {
	float: none;
	margin: 0 auto;
}
.dicepage .dicecolour1 {
background: #2ECC40;
}
.dicepage .dicecolour2 {
background: #FF4136;	
}
.dicepage .dicecolour3 {
background: #0074D9;	
}
.dicepage .dicecolour4 {
background: #B10DC9;	
}
.dicepage .dicecolour5 {
background: #FF851B;	
}
.dicepage .sign {
display:block;
float: left;
width: 100px;
height: 120px;
font-size: 120px;
line-height: 150px;
padding: 0;
margin: 0;
border: none;
text-align: center;
}
.dicepage #answer {
display:block !important;
clear:both;
text-align: center;
font-size: 100px;
}

.dicepage #minnum1, .dicepage #minnum2, .dicepage #timeint {
float: left;
margin: 0 30px 0 0;
}
.dicepage #maxnum1, .dicepage #maxnum2 {
float: left;
margin: 0 0 0 30px;
}
.numcol1 {
background: #008282;
}
.numcol2 {
background: #005E5E;
}
.dots {
	font-family: diceFont;
}


.dicepage h2, .dicepage h3, .dicepage h4 {
font-weight: 200;
margin: 1rem 0 0.6rem 0;
letter-spacing: 0.2rem;
}


  /* WebKit and Opera browsers */
  @-webkit-keyframes spinner {
    from { -webkit-transform: rotateY(0deg);    }
    to   { -webkit-transform: rotateY(-360deg); }
  }

  /* all other browsers */
  @keyframes spinner {
    from {
      -moz-transform: rotateY(0deg);
      -ms-transform: rotateY(0deg);
      transform: rotateY(0deg);
    }
    to {
      -moz-transform: rotateY(-360deg);
      -ms-transform: rotateY(-360deg);
      transform: rotateY(-360deg);
    }
  }


.spinner {
    -webkit-animation-name: spinner;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-duration: 0.5s;

    animation-name: spinner;
    animation-timing-function: linear;
    animation-iteration-count: 1;
    animation-duration: 0.5s;

    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    transform-style: preserve-3d;
}


/* -- end dice -- */

/* -- end bingo -- */
footer.activityfooter {
	padding-top: 20px;
	text-align: center;
	color: #ccc;
font-size: 0.9rem;
}
footer.activityfooter a {
	color: #eee;
}
footer.activityfooter a:hover {
	color: white;
text-decoration: underline
}

.tip {
	font-size: 1rem;
	text-align: center;
	margin-top: 30px;
	color: #888;
}
.tip kbd {
	color: #bbb;
	background: black;
}


.icon_bingo_square_f{background:url(https://dedhk00m7fqyl.cloudfront.net/ms/images/ms_sprite_square_171017.png) 0 0 no-repeat;display:inline-block;width:144px;height:144px}.icon_dice_square_f{background:url(https://dedhk00m7fqyl.cloudfront.net/ms/images/ms_sprite_square_171017.png) -292px -146px no-repeat;display:inline-block;width:144px;height:144px}.icon_exam-timer_square_f{background:url(https://dedhk00m7fqyl.cloudfront.net/ms/images/ms_sprite_square_171017.png) 0 -292px no-repeat;display:inline-block;width:144px;height:144px}.icon_fdt_square_f{background:url(https://dedhk00m7fqyl.cloudfront.net/ms/images/ms_sprite_square_171017.png) -292px -292px no-repeat;display:inline-block;width:144px;height:144px}.icon_fdtcf_square_f{background:url(https://dedhk00m7fqyl.cloudfront.net/ms/images/ms_sprite_square_171017.png) -438px 0 no-repeat;display:inline-block;width:144px;height:144px}.icon_horserace_f{background:url(https://dedhk00m7fqyl.cloudfront.net/ms/images/ms_sprite_square_171017.png) -438px -292px no-repeat;display:inline-block;width:144px;height:144px}.icon_numoftheday_square_f{background:url(https://dedhk00m7fqyl.cloudfront.net/ms/images/ms_sprite_square_171017.png) -438px -146px no-repeat;display:inline-block;width:144px;height:144px}.icon_quickquiz_square_f{background:url(https://dedhk00m7fqyl.cloudfront.net/ms/images/ms_sprite_square_171017.png) -146px 0 no-repeat;display:inline-block;width:144px;height:144px}.icon_random_square_f{background:url(https://dedhk00m7fqyl.cloudfront.net/ms/images/ms_sprite_square_171017.png) 0 -146px no-repeat;display:inline-block;width:144px;height:144px}.icon_task-timer_square_f{background:url(https://dedhk00m7fqyl.cloudfront.net/ms/images/ms_sprite_square_171017.png) -146px -292px no-repeat;display:inline-block;width:144px;height:144px}.icon_the-numbers-game_square_f{background:url(https://dedhk00m7fqyl.cloudfront.net/ms/images/ms_sprite_square_171017.png) -146px -146px no-repeat;display:inline-block;width:144px;height:144px}.icon_word-search_square_f{background:url(https://dedhk00m7fqyl.cloudfront.net/ms/images/ms_sprite_square_171017.png) -292px 0 no-repeat;display:inline-block;width:144px;height:144px}.icon_rounding_square_f{background:url(https://dedhk00m7fqyl.cloudfront.net/ms/images/ms_sprite_square_171017.png) 0 -438px no-repeat;display:inline-block;width:144px;height:144px}
.icon_fdt_fr_orange_f
{
	background:url(//dedhk00m7fqyl.cloudfront.net/ms/images/mssprite130301.png) 0 -582px no-repeat;
	display:inline-block;
	height:97px;
	width:163px;
}

.icon_fr_numbers-game_blue_f
{
	background:url(//dedhk00m7fqyl.cloudfront.net/ms/images/mssprite130301.png) 0 -485px no-repeat;
	display:inline-block;
	height:97px;
	width:163px;
}
.icons_ms
{
	display:inline-block;
	float:left;
	height:144px;
	margin:6px;
	width:144px;
}

.activitybutton
{
	float:left;
	margin:6px;
}

/* -- class tag editor -- */
.tag-editor {
	border: 1px solid #ced4da !important;
	border-radius: .25rem !important;
	font-size: 1rem !important;
	line-height: 1.5 !important;
	padding: .375rem .75rem !important;
}
.tag-editor .placeholder {
	background-color: white !important; /* 22/07/24 BS5 SJ */
}
/* -- end class tag editor -- */

/* -- random -- */

.randomgroups .card-title {
text-align: center;
}
.randomgroups .card-text {
margin: 0;
}
.randomgroups .card-body {
padding: 5px 20px;
}
.card-columns {
  @include media-breakpoint-only(md) {
    column-count: 4;
  }
  @include media-breakpoint-only(xl) {
    column-count: 5;
  }
}

.randomgroups #groupbox {
	display: none;
}
.randomgroups #groups, .randomgroups #loader {
	display: none;
}
.randomgroups #loader {
	padding: 50px;
	text-align: center;
}
.randomgroups #loader p {
	font-size: 0.7em;
}

.randomgroups .card {
	transition:left 1s ease;
}


.yellow {
text-shadow: 0.5px 0.5px 0 #999, -0.5px 0.5px 0 #999, 0.5px -0.5px 0 #999, -0.5px -0.5px 0 #999;
}
body.randomclass {
	background: black url(https://mathsstarters.net/images/bkg_swirl_pattern.png);
}

body.randomclass .jumbotron {
background-color: black;
text-align: center;
color: white;
}
body.randomclass .jumbotron img {
	opacity: 0;
}
body.randomclass h1, body.randomclass h2, body.randomclass p#instruction, body.randomgroups h1, body.randomgroups #classname, body.randomgroups .card-text{
font-family: 'Baloo Bhaijaan', cursive;
}
body.randomclass h1, body.randomgroups h1 {
	text-shadow: 2px 2px 2px #7802DA,2px -2px 2px #7802DA,-2px 2px 2px #7802DA,-2px -2px 2px #7802DA;
}
body.randomclass h2 {
min-height: 1em;
}
body.randomclass p#instruction {
min-height: 1em;
}

.give-min-height {
min-height: 400px;
}

/*-- activity name chooser --*/
#namechooser {
	width: 20rem;
	background-color: rgba(30,30,30,0.8);
	padding: 1rem 2rem;
	-moz-border-radius: 1rem;
	-webkit-border-radius: 1rem;
	border-radius: 1rem;
	border: 1px solid #009100;
	box-shadow: 2px 2px 2px #000;
	font-size: 1.8rem;
	position: absolute;
	z-index: ;
	right: 1rem;
	top: 3rem;
}
#nameloader {
	position: absolute;
	top: 30px;
	left: 1.5rem;
	z-index: 1;
}
#namechooser button {
	float: right;
}
#nameshuffle {
	opacity: 0;
	position: absolute;
	top: 20px;
	left: 1.5rem;
	z-index: 1;
}
/*-- end activity name choose --*/


/* -- input type range -- */
input[type=range] {
    /*removes default webkit styles*/
    -webkit-appearance: none;
    
    /*fix for FF unable to apply focus style bug */
    border: 1px solid black;
    
    /*required for proper track sizing in FF*/
    width: 200px;

    background-color: black;
}
input[type=range]::-webkit-slider-runnable-track {
    width: 200px;
    height: 5px;
    background: #ddd;
    border: none;
    border-radius: 3px;
}
input[type=range]::-webkit-slider-thumb {
    -webkit-appearance: none;
    border: none;
    height: 16px;
    width: 16px;
    border-radius: 50%;
    background: goldenrod;
    margin-top: -4px;
}
input[type=range]:focus {
    outline: none;
}
input[type=range]:focus::-webkit-slider-runnable-track {
    background: #ccc;
}

input[type=range]::-moz-range-track {
    width: 200px;
    height: 5px;
    background: #ddd;
    border: none;
    border-radius: 3px;
}
input[type=range]::-moz-range-thumb {
    border: none;
    height: 16px;
    width: 16px;
    border-radius: 50%;
    background: goldenrod;
}

/*hide the outline behind the border*/
input[type=range]:-moz-focusring{
    outline: 1px solid white;
    outline-offset: -1px;
}

input[type=range]::-ms-track {
    width: 200px;
    height: 5px;
    
    /*remove bg colour from the track, we'll use ms-fill-lower and ms-fill-upper instead */
    background: transparent;
    
    /*leave room for the larger thumb to overflow with a transparent border */
    border-color: transparent;
    border-width: 6px 0;

    /*remove default tick marks*/
    color: transparent;
}


input[type=range]::-ms-thumb {
    border: none;
    height: 16px;
    width: 16px;
    border-radius: 50%;
    background: goldenrod;
}
input[type=range]:focus::-ms-fill-lower {
    background: #888;
}
input[type=range]:focus::-ms-fill-upper {
    background: #ccc;
}
/* END -- input type range -- */

/* random */

/* startup */
body.random #activitybox {
display: none;
}

.random #range, .random #time, .random #numbox {
clear: both;
}
.random .smallnum{
display:block;
width: 2em;
text-align: center;
border: 2px solid white;
float:left;
font-weight: bold;
font-family: monospace;
padding: 0.4em 0;
font-size: 1.1em;
}
.random #numbox {
	margin: 0.5em auto;
	border: 2px solid white;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	text-align: center;
	font-family: 'Delius Unicase', cursive;
}
.random span#rannum{
	font-size: 120px;
	line-height: 150px;
	display: inline;
	text-shadow: 2px 2px 0 black, -2px 2px 0 black, 2px -2px 0 black, -2px -2px 0 black ;
	padding: 0 30px;
	
}
.rannumcol1 {background: #9E0901;} /*red*/
.rannumcol2 {background: #005E5E;} /*blue*/
.rannumcol3 {background: #D96300;} /*orange*/
.rannumcol4 {background: #57019E;} /*purple*/
.rannumcol5 {background: #007E00;} /*green*/
.rannumcol6 {background: #0C02DA;} /*blue*/

#minnum, #timeint {
float: left;
margin: 0 30px 0 0;
}
.random .slider {
width: 400px;
margin: 10px 0;
float: left;
}
.random #maxnum {
float: left;
margin: 0 0 0 30px;
}

.random #recordingbox h2 {
font-size: 90%;
font-weight: normal;
}
.random #results {
font-family: monospace;
font-size: 150%;
}
/* END random */


/*-- clrs.cc --*/
/* Colors */
.navy { color: #001F3F; }
.blue { color: #0074D9; }
.aqua { color: #7FDBFF; }
.teal { color: #39CCCC; }
.olive { color: #3D9970; }
.green { color: #2ECC40; }
.lime { color: #01FF70; }
.yellow { color: #FFDC00; }
.orange { color: #FF851B; }
.red { color: #FF4136; }
.fuchsia { color: #F012BE; }
.purple { color: #B10DC9; }
.maroon { color: #85144B; }
.white { color: #FFFFFF; }
.silver { color: #DDDDDD; }
.gray { color: #AAAAAA; }
.black { color: #111111; }
/*-- end clrs.cc --*/