.tutgrid
{
font-family:'Verdana','Arial',sans-serif;
border:none;
float:left;
border-spacing: 0;
}
.tutgrid TD
{
font-family:'Verdana','Arial',sans-serif;
border: 1px inset #5c3a2f;
text-align:center;
font-size: 160%;
width:40px;
height:40px;
}
.tutgrid .colheader
{
background-color:#FFFEF8;
border:none;
color:rgb(0,0,80);
font-size: 75%;
font-weight:400;
height:30px;
}
.tutgrid .rowheader
{
background-color:#FFFEF8;
border:none;
color:rgb(0,0,80);
font-size: 75%;
font-weight:400;
width:30px;
}
.tutgrid .odd
{
color:rgb(0,0,40);
background-color:rgb(221,235,251);
}
.restab .grideven
{
background-color:rgb(250,245,240);
}
.restab .celloccupied
{
background-color:rgb(237,209,155);
}

.tutgrid .even
{
color:rgb(0,0,40);
background-color:rgb(250,245,220);
}
.tutgrid .poss
{
font-size:60%;
text-align:left;
vertical-align:text-top;
}
.tutgrid .allocated
{
background-color:rgb(248,237,170);
}
.tutgrid .initial
{
color:rgb(60,0,0);
background-color:rgb(237,209,155);
}
.tutgrid .highlight
{
background-color:rgb(196,237,175);
background: radial-gradient(#3fec90, #c6f9ab);
}
.tutgrid .special1
{
background-color:rgb(219,178,244);
font-weight:600;
background: radial-gradient(#ca6cd4, #f9c6ec);
}
.tutgrid .special2
{
background-color:rgb(244,172,184);
font-weight:600;
background: radial-gradient(#f28365, #f2acb6);
}
.tutgrid .special3
{
background-color:rgb(152,185,248);
background: radial-gradient(#76a4f3, #c1c3fb);
font-weight:600;
}
.tutgrid .special4
{
background-color:rgb(255,248,131);
background: radial-gradient(#f5c86b, #fcff6e);
color:rgb(20,27,150);
font-weight:600;
}
.tutgrid .regr
{
border-right:4px solid #906050;
}
.tutgrid .regb
{
border-bottom:4px solid #906050;
}
.tutgrid .regt
{
border-top:4px solid #906050;
}
.tutgrid .regl
{
border-left:4px solid #906050;
}
.tutcomment
{
	border:1px inset #504010;
	border-radius:8px;
	background-color:#ffffe8;
	margin-left:8px;
	padding:5px;
	min-height:120px;
	text-align: left;
	float:left;
	width:350px;
}
.tutbox
{
	padding:5px;
	border:1px inset #504010;
	background-color:#fff8f0;
	border-radius:8px;
	font-size:100%;
	margin-left: 8px;
	width:350px;
}
.tutstep
{
	font-size:80%;
	margin-left:10px;
}
.tutnavbar
{
margin-top:10px;
margin-bottom:10px;
text-align:left;
width: 350px;
float:left;
}
#tutprog
{
width: 250px;
margin: 9px;
}
.progress-bar
{
background-color: whiteSmoke;
border-radius: 2px;
box-shadow: 0 2px 3px rgba(0, 0, 0, 0.25) inset;
width: 250px;
height: 20px; 
position: relative;
display: block;
}
.progress-bar > span 
{
background-color: blue;
border-radius: 2px;
display: block;
text-indent: -9999px;
}
.expander {transform:scale(0.85);transition-duration:0.25s;vertical-align:middle;}
.expander:hover {transform:scale(1.0);background-color:#fffffe;box-shadow:5px 5px 3px #402010;font-size:115%;}

#helppopup
{
left:5%;
top:15%;
width:85%;
position:fixed;
overflow:hidden;
z-index:12;
background-color: #eeffea;
border: 1px solid #2E4996;
padding:16px;
visibility:hidden;
display:none;
border-radius: 10px;
box-shadow:11px 10px 5px #4F4993;
}

@media screen and (max-width:477px) 
{
.tutnavbar {float:none;width:auto}
.tutbox {width:auto}
.tutcomment {float:none; width:auto}
}