@font-face {
    font-family: Chalk;
    src: url(/fonts/EraserRegular.ttf);
}
body{
	text-align:center;
	background-color:#FFFF9E;
	background-image: -moz-repeating-radial-gradient(top center,circle, #FFFF9E, #FFCC00 5%, yellow 10%);
	background-image: -webkit-repeating-radial-gradient(top center,circle, #FFFF9E, #FFCC00 5%, yellow 10%);
	background-image: -0-repeating-radial-gradient(top center,circle, #FFFF9E, #FFCC00 5%, yellow 10%);
	background-image: -ms-repeating-radial-gradient(top center,circle, #FFFF9E, #FFCC00 5%, yellow 10%);
	background-image: repeating-radial-gradient(top center,circle, #FFFF9E, #FFCC00 5%, yellow 10%);
	box-sizing:border-box;
}
h1 {
	font-size:72px;
	font-family:Chalk, "Courier New", Courier, monospace;
	color:red;
	
	text-shadow:
       3px 3px 0 white,
     -1px -1px 0 white,  
      1px -1px 0 white,
      -1px 1px 0 white,
       1px 1px 0 white;
    margin:3px;
}
div#MainContainer {
	position:relative;
	background-color:white;
	border:3px black solid;
	border-radius:10px;
	box-shadow:5px 3px 6px 8px #FFCC00;
	margin:32px auto 10px;
	width:900px;
	height:510px; /*Needs to be high enough to fit in te extra instructions for some topics*/
}
div#TugContainer {
	position:absolute;
	top:10px;
	left:0px;
	width:900px;
	height:115px;
	border-bottom:8px green solid;
}
div#ScoreBoard {
	position:absolute;
	bottom:10px;
	right:10px;
	width:300px;
	height:150px;
}
.ButNew {
	display: block;
	white-space: nowrap;
	background-color: #ccc;
	border: 1px solid #777;
	padding: 7px 15px;
	margin: 4px auto;
	font: bold 16px/20px Arial, Helvetica;
	text-decoration: none;
	color: black;
	border-radius: 4px;
	background: repeating-linear-gradient(0deg, red 40px, yellow 100px);
	cursor:pointer; 
	width:140px; 
}   
.ButNew:hover
    {
	background-color: #eee;        
	background: repeating-linear-gradient(0deg, red 35px, pink 90px);
}
@keyframes animatedBackground {
	from { background-position: 0 0; }
	to { background-position: 880px 0; }
}
#WinnersPanel {
	position:absolute;
	background-color:yellow;
	width:880px;
	height:354px;
	top:140px;
	left:6px;
	border:4px red solid;
	border-radius:20px;
	/*background-image:url('/Software/SW/Starter_of_the_day/Images/Backgrounds/YellowSwirl.png');
	background-image:url('/Software/SW/Starter_of_the_day/bkplastr.jpg');*/
	background-image: -moz-repeating-radial-gradient(top center,circle, #FFFF9E, #FFCC00 5%, yellow 10%);
	background-image: -webkit-repeating-radial-gradient(top center,circle, #FFFF9E, #FFCC00 5%, yellow 10%);
	background-image: -0-repeating-radial-gradient(top center,circle, #FFFF9E, #FFCC00 5%, yellow 10%);
	background-image: -ms-repeating-radial-gradient(top center,circle, #FFFF9E, #FFCC00 5%, yellow 10%);
	background-image: repeating-radial-gradient(top center,circle, #FFFF9E, #FFCC00 5%, yellow 10%);
	animation: animatedBackground 10s linear infinite;
	display:none;
}
#WinnersPanel td{
	padding:20px;
}
table#UnderContainer {
	background-color:rgba(255,255,255,0.8);
	width:1000px;
	margin:auto;
}
table#UnderContainer td{
	padding:5px 20px;
}
#MiddlePanel p, #LowerPanel p {
	text-align:left;
}
#Trophybutton {
	background-color:red;
	color:white;
	font-weight:bold;
	font-size:18px;
	font-family:Arial, Helvetica, sans-serif;
	}
.comment_date {
	display:none;
}
.comment_title::before {
	content: "Comment from ";
}
.LevelTabs {
	margin-top:-18px;
	margin-bottom:1px;
	text-align:center;
	width:900px;
}
.LevelTabs a{
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
	color:#444;
	background-color:silver;
	background: repeating-linear-gradient(0deg, silver 30px, white 60px);
	border:2px black solid;
	padding:2px 5px 0px 5px;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
	text-decoration:none;
	cursor:pointer;
}
.LevelTabs a.ThisOne {
	color:red;
	background-color:white;
	background-image:none;
	margin-top:10px;
	font-size:16px;
	border-bottom:0px #FFF solid;
	font-weight:bold;
	/*box-shadow: inset 0 0 10px #000000;*/
}
div#TopBlackBar { background-color:black;padding:3px;margin-bottom:5px;}
/* Style below only required for LevelTabsBig (Remove the class from h5 if small tabs required) */
#MainContainer {box-shadow:none;margin-top:10px;}
.LevelTabsBig {margin-top:-23px;margin-bottom:15px;}
.LevelTabsBig a{font-size:18px;}
.LevelTabsBig a.ThisOne {background-color:white;font-size:18px;background-image:none;border-bottom:4px white solid;}
/*End of Big Tabs Style*/

div.Tugger {
	position:absolute;
	top:0px;
	border:0px green solid;
	width:95px;
	height:120px;
	background-repeat:no-repeat;
}
div.Tugger1 {background-image:url('RedTeam.png'); background-position:0px 0px;}
div.Tugger2 {background-image:url('RedTeam.png'); background-position:-110px 0px;}
div.Tugger3 {background-image:url('RedTeam.png'); background-position:-230px 0px;}
div.Tugger4 {background-image:url('BlueTeam.png'); background-position:0px 0px;}
div.Tugger5 {background-image:url('BlueTeam.png'); background-position:-120px 0px;}
div.Tugger6 {background-image:url('BlueTeam.png'); background-position:-230px 0px;}

div#Rope {
	border:0px purple solid;
	position:absolute;
	top:50px;
	width:450px;
	height:36px;
	background-image:url('Rope.png');
	background-repeat:no-repeat;
	background-position:0px 0px;
}
div.Post{
	position:absolute;
	bottom:0px;
	background-color:yellow;
	width:6px;
	height:30px;
	border:1px black solid;
}
div#Post1{left:210px;}
div#Post2{left:447px;}
div#Post3{left:684px;}

#cardPile, #cardSlots {
	position:absolute;
	top:150px;
	width: 700px;
	height: 130px;
  padding:5px;
  text-align:center;
  background-color:green;
  margin: 5px auto 0 auto;
  border:2px black solid;
  border-radius:10px;
  box-shadow: inset 0 0 10px #000000;
  overflow:hidden;
}
#cardPile {
	left:10px;
	width:132px;
}
#cardSlots {
  	background-color:yellow;
	left:170px;
}

#cardPile div, #cardSlots div {
  background: white;
  overflow:hidden;
  position:relative;
  margin:3px;
  padding:5px;
  width: 113px;
  height: 113px;
  border:2px black solid;
  border-radius:10px;
  display:inline-block;
}
#cardPile div p, #cardSlots div p{
	font-size:32px;
}
.response {
	box-sizing:border-box;
	position:absolute;
	width:140px;
	height:50px;
	border:1px grey solid;
	border-radius:10px;
	background-color:red;
	padding:5px;
	box-shadow:0px 0px 5px 3px black inset;
}
.response p{
	color:white;
	margin:0px;
	text-align:center;
	font-size:36px;
	font-weight:bold;
}
#Response6, #Response7, #Response8, #Response9, #Response10 {
	background-color:blue;
}
.TeamTitle {
	position:absolute;
	left:10px;
	font-size:16px;
	font-weight:bold;
}
#RedTitle {
	top:332px;
}
#BlueTitle {
	top:392px;
}
#Instructions {
	top:430px;
}
#Instructions p{
	margin:10px;
	text-align:left;
}
.Tick {
	position:absolute;
	top:-20px;
	left:30px;
	width:98px;
	height:93px;
	display:none;
}
.Cross {
	position:absolute;
	top:-20px;
	left:30px;
	width:100px;
	height:86px;
	display:none;
}
#NextButton {
	position:absolute;
	bottom:5px;
	right:30px;
	display:none;
}
.Another {
	display:inline-block;
	border:1px grey solid;
	width:180px;
	height:190px;
	box-shadow:3px 3px 3px silver;
	margin:5px;
	vertical-align:top;
	background-color:beige;
}
.Another h3{
	text-align:center;
	height:40px;
	color:black;
}
.Another img{
	width:162px;
	height:100px;
	display:block;
	margin:auto;
	border:1px black solid;
}