body {
	background-color:silver;
	background-image:url('/Maths/Activity/Striped_Sweets/Background.png');
	text-align:center;
}
h1 {
	margin:2px;
	text-align:center;
}

div#MainContainer {
	background-color:white;
	background-image:url('BoardPent.png');
	background-position:210px 0px;
	height:530px;
	background-repeat:no-repeat;
	width:960px;
	margin:0px auto 0px;
	border:1px purple solid;
	border-radius:10px;
	position:relative;
	text-align:center;
	padding:0px;
}
div#MainContainer p{
	color:black;
	font-size:16px;
}
#Feedback {
	text-align:center;
	font-weight:bold;
	color:navy;
}

#InstructionsL, #InstructionsR {
	position:absolute;
	border: 0px silver solid;
	top:20px;
	width:180px;
	text-align:left;
}
#InstructionsL {left: 10px;}
#InstructionsR {right:10px;}
.Piece {
	position:absolute;
	width:70px;
	height:70px;
	border-radius:35px;
	background-color:yellow;
	border:5px black solid;
	box-shadow: inset 0 0 20px #000000;
}
#Piece1 {top:190px;left:430px; background-color:red;}
#Piece2 {top:190px;left:430px; background-color:red;}
#Piece3 {top:190px;left:430px; background-color:red;}
#Piece4 {top:190px;left:430px; background-color:red;}
#Piece5 {top:190px;left:430px;}
#Piece6 {top:190px;left:430px;}
#Piece7 {top:190px;left:430px;}
#Piece8 {top:190px;left:430px;}

div#MainContainer p.Red, p.Yellow, p.Lime{
	width:95%;
	background-color:red;
	color:white;
	text-align:center;
	border:1px black solid;
	border-radius:5px;
	padding-top:8px;
	padding-bottom:8px;
	margin:3px auto;
	font-weight:bold;
}
p.Yellow {
	background-color:yellow;
	color:black;
}
p.Lime {
	background-color:lime;
	color:black;
}
#Case1, #Case2 {
	display:none;
}
#Trophybutton {
	display:none;
	visibility:visible;
	background-color:red;
	color:white;
	font-weight:bold;
	font-size:18px;
	font-family:Arial, Helvetica, sans-serif;
	}
#CommentsEtc {
	width:1000px;
	margin:auto;
	text-align:left;
} 
#CommentsEtc p {
	margin:20px;	
}
#CommentsEtc a{
	color:aqua;
} 
.comment_invitation {
	color:white;
}
.comment_title {
	background-color:red;
	background-image:none;
	background: linear-gradient(to right, red 0%, #FFFFFF 1%, red 2%, white 95%, white 100%);
	font-weight:bold;
	color:white;
	margin-bottom:0px;
	padding:8px 20px 8px;
}
.comment_title::before {
	content:'Comment from ';
}

.comment_date {
	display:none;
}
.comment_body {
	color:white;
	text-align:left;
}

div#UnderContainer {
	width:1000px;
	height:310px;
	margin:auto;
	border: 0px solid black;
	position:relative;
	padding:0px;
}
div#LeftPanel, div#MiddlePanel, div#RightPanel {
	position:absolute;
	top:0px;
	margin:0px;
	border: 0px solid yellow;
	text-align:center;
}
div#LeftPanel {
	left:0px;
	width:340px;
}
div#MiddlePanel {
	left:350px;
	width:300px;
	padding-top:10px;
}
div#MiddlePanel p{
	color:white;
	font-weight:bold;
	text-align:left;
}
div#MiddlePanel h2 {
	color:white;
}
div#MiddlePanel li {
	text-align:left;
	color:white;
}
div#MiddlePanel a {
	color:aqua;
}
div#RightPanel {
	Right:0px;
	width:340px;
}
div#LowerPanel {
	width:998px;
	height:auto;
	margin:0px auto;
	border: 0px solid aqua;
	text-align:center;
}
div#LowerPanel p{
	text-align:left;
	color:white;
	margin:20px 20px;
	line-height:20px;
}
a.whitebutton {
	width:350px;
	height:70px;
	text-align:center;
	color:white;
	font-weight:bold;
	background-color:gray;
	border:2px white solid;
	border-radius:35px;
	text-decoration:none;
}
.ButNew {
	display: inline-block;
    white-space: nowrap;
    background-color: #ccc;
    border: 1px solid #777;
	padding: 0 1.5em;
	margin: 0.5em;
	font: bold 1em/2em Arial, Helvetica;
	text-decoration: none;
	color: black;
	border-radius: .2em;
	background: repeating-linear-gradient(0deg, red 40px, yellow 100px);
	cursor:pointer;  
	width:120px;
}   
.ButNew:hover {
	background-color: #eee;        
	background: repeating-linear-gradient(0deg, red 35px, yellow 90px);
}