body {
font-size:100%;
font-family:"Trebuchet MS";
background-color:#fbfbf8;
}

#wrapper { 
 margin: 100px auto 0px;
 width: 960px;
 font-size:90%; 
 background-image:url('pictures/tttcols.png');
 background-repeat:repeat;
}

* { padding: 0; margin: 0; }

#header {
 color: #FFFFCC;
 width: 938px;
 float: left;
 padding: 10px;
 border: 1px solid #ccc;
 margin: -95px 0px 5px 0px;
 background: #106635;
 text-align:center;
 background-image:url('pictures/tinyteflteacher.gif');
 background-repeat:no-repeat;
 background-position:8% 3%;
}

#leftcolumn { 
 color: #000;
 border-top: solid 1px #ccc;
 margin: 0px 5px 5px 0px;
 padding: 10px;
 width: 180px;
 float: left;
}

#content { 
 border-top: solid 1px #ccc;
 position:relative;
 float: left;
 color: #000066; 
 margin: 0px 5px 5px 0px;
 padding: 10px 12px;
 width: 526px;
 display: inline;
}
#rightcolumn { 
 border-top: solid 1px #ccc;
 color: #FFFFCC;
 margin: 0px 0px 5px 0px;
 padding: 10px 20px;
 width: 160px;
 float: left;
 text-align:center;
}
#footer { 
 width: 938px;
 clear: both;
 color: #000;
 border: 1px solid #ccc;
 background: #106635;
 margin: 0px 0px 0px 0px;
 padding: 10px;
}
/*
      Initial code for the above three columns created by Keith Donegan of Code-Sucks.com	  
	  E-Mail: Keithdonegan@gmail.com	    
*/
.left_three {
width: 150px;
margin: 0px 10px 0px 10px;
float:left;
}
.middle_three {
width: 150px;
float:left;
margin: 0px 10px 0px 10px;
}
.right_three {
width: 150px;
float:left;
margin: 0px 10px 0px 10px;
}

.left_thin {
width: 30%;
float:left;
margin:0px 5px 0px 5px;
}
.middle_thin {
width: 30%;
float:left;
margin:0px 5px 0px 5px;
}
.right_thin {
width: 30%;
float:left;
margin:0px 5px 0px 5px;
}

.left_two {
width: 235px;
margin:0px 10px 0px 10px;
float:left;
}

.board_column2 {
width:190px;
float:left;
margin: 0px 5px;
}


.whiteboard	{
	width:400px;
	padding:0px 50px 5px;
	margin:0px 13px;
	background:url('pictures/whiteboard.gif');
}

.whiteboardtop	{
	height:35px;
	padding:0px;
	margin:10px 13px 0px;
	background:url('pictures/whiteboard_t.gif');
	background-repeat: no-repeat;
}

.whiteboardbottom	{
	margin:-5px 13px 0px;
	height:34px;
	padding: 10px 50px 70px 70px;
	background:url('pictures/whiteboard_b.gif');
	font-weight:bold;
	color: #990033;
	font-size:80%;
	background-repeat: no-repeat;
}

.example {
color:#0000CC;
margin-left:20px;
margin-right:15px;
}

/* Links in header */
.blocklink {
border:1px solid black;
display:inline;
font-weight:bold;
color:#106635;
background-color:#FFFFCC;
width:120px;
text-align:left;
padding:3px 10px;
text-decoration:none;
margin-left:10px;
margin-right:10px;
}
a.blocklink:hover {
background-color:#FFCCCC;
}

#warmers {
background-image:url('pictures/warmer.PNG');
background-repeat:no-repeat;
background-position:right;
}
#games {
background-image:url('pictures/games.png');
background-repeat:no-repeat;
background-position:right;
}
#ITresources {
background-image:url('pictures/ITresources.PNG');
background-repeat:no-repeat;
background-position:right;
}
#pronunciation {
background-image:url('pictures/pronunciation.png');
background-repeat:no-repeat;
background-position:right;
}
#lessons {
background-image:url('pictures/lessons.png');
background-repeat:no-repeat;
background-position:right;
}
#student {
background-image:url('pictures/student-pages.png');
background-repeat:no-repeat;
background-position:right;
}
#grammar {
background-image:url('pictures/student-pages.png');
background-repeat:no-repeat;
background-position:right;
}
#vocabulary {
background-image:url('pictures/vocabulary.png');
background-repeat:no-repeat;
background-position:right;
}
#prepositions {
background-image:url('pictures/prepositions.png');
background-repeat:no-repeat;
background-position:right;
}
#fce {
background-image:url('pictures/fce.png');
background-repeat:no-repeat;
background-position:right;
}
#blockbusters {
background-image:url('pictures/abc-quiz-menu.png');
background-repeat:no-repeat;
background-position:right;
}
#speaking-games {
background-image:url('pictures/speaking-games.png');
background-repeat:no-repeat;
background-position:right;
}
#question-cards {
background-image:url('pictures/question-cards.png');
background-repeat:no-repeat;
background-position:right;
}
#other-games {
background-image:url('http://www.tinyteflteacher.co.uk/pictures/other-games.png');
background-repeat:no-repeat;
background-position:right;
}
#powerpoint-games {
background-image:url('pictures/powerpoint-menu.png');
background-repeat:no-repeat;
background-position:right;
}

.picturemenu {
float:left; 
width:480px;  
margin:5px 10px; 
padding:15px 10px; 
border-style:solid;
border-color:#106635;
border-width: 2px;
}

.picturelink {
border: 2px solid #000000;
}
.picturelink:hover {
border: 2px solid #106635;
}

/* left menu items */

.leftmenu {
border:1px solid black;
display:block;
font-weight:bold;
color:#ffffcc;
background-color:#333366;
width:140px;
text-align:left;
padding:8px 10px;
text-decoration:none;
margin-left:10px;
margin-right:10px;
}

a.leftmenu:hover {
background-color:#330099;
}

.subheading {
border:1px solid black;
display:block;
font-weight:bold;
color:#333366;
background-color:#ffffcc;
width:140px;
text-align:left;
padding:1px 10px;
text-decoration:none;
margin-left:10px;
margin-right:10px;
}

a.subheading:hover {
background-color:#6699cc;
}

.activesubheading {
border:1px solid black;
display:block;
font-weight:bold;
color:#ffffcc;
background-color:#333366;
width:140px;
text-align:left;
padding:1px 10px;
text-decoration:none;
margin-left:10px;
margin-right:10px;
}

a.activesubheading:hover {
background-color:#330099;
}

.heading {
background-color:#333366;
color:#FFFFEE;
padding:1px 4px;
}

img {
margin:2px 5px;
}

/*cluelink - for tooltip thing*/
.cluelink {
text-decoration:none;
color:#006633;
font-weight:900;
cursor:help;
}

.cluenolink {
cursor:help;
}

/*littlelink = link on teachers' pages*/
a.littlelink:link {
text-decoration:none;
color:#006633;
font-weight:900;
}
a.littlelink:visited {
text-decoration:none;
color:#003333;
font-weight:900;
}
a.littlelink:hover {
text-decoration:none;
color:#009900;
font-weight:900;
}
a.littlelink:active {
text-decoration:none;
font-weight:900;
color:#000099;
}
/*leftcollink = link in left column*/
a.leftcollink:link {
text-decoration:none;
color:#CCCC99;
}
a.leftcollink:visited {
text-decoration:none;
color:#CCCC99;
}
a.leftcollink:hover {
text-decoration:none;
color:#FFFFCC;
}
a.leftcollink:active {
text-decoration:none;
color:#FFFFCC;
}

/*textlink = invisible text link*/
a.textlink:link {
text-decoration:none;
color: #000066;
}
a.textlink:visited {
text-decoration:none;
color: #000066;
}
a.textlink:hover {
text-decoration:none;
color: #106635;
}
a.textlink:active {
text-decoration:none;
color: #000066;
}


/* proper buttons!!!*/
.indexlink {
text-decoration:none;
float:left;
line-height:160%;
display:inline;
width:222px;
color:#FFFFCC;
background-color:#106635;
padding:0px 6px;
margin:2px 0px;
}
.indexlink:hover {
background-color:#003300;
}
.indextext {
text-decoration:none;
color:#FFFFCC;
font-weight:bold;
}

/* greenlink and inline = links on grammar main page */
a.greenlink {
text-decoration:none;
/*color:#FFFFCC;*/
color:#000099;
font-weight:bold;
}

a.greenlink:visited {
text-decoration:none;
color:#000055;
font-weight:bold;
}

.blueinline {
float:left;
display:inline;
line-height:160%;
width:255px;
color:#FFFFCC;
background-color:#000066; 
padding:0px 2px;
margin:2px 4px 2px 0px;
}

.blueinline:hover {
background-color:#000099;
}

.nobullets {
float:left;
width:100%;
padding:0;
margin:0;
list-style-type:none;
}

.inline {
float:left;
display:inline;
/*line-height:160%*/
line-height:150%;
width:255px;
/*color:#FFFFCC;
background-color:#106635;*/
color:#000099;
padding:0px 2px;
/*margin:2px 4px 2px 0px;*/
margin:0px 4px 0px 0px;
}

.inline:hover {
/*background-color:#003300;*/
background-color:#CCEECC;
}

p {
margin-bottom: 0.3em;
}

.top_border {
border-top:3px solid #000066;
}
.emph_table {
border:3px solid #000066;
border-collapse:collapse;
}

.tinypadding td {
padding:2px 5px;
text-align:left;
}

.collapsetable {
border-collapse:collapse;
}
table, td, th
{
border:1px solid #000066;
}
th {
padding:2px 10px;
}

th.left {
padding:2px 10px;
text-align:left;
}

td {
padding:2px 10px;
text-align:left;
}

table.mcCloze, td.mcCloze, td.mcClozeNumber {
border:0px;
width:100%;
}
td.mcCloze {
width:19%;
padding:2px 5px;
}
td.mcClozeNumber {
width:5%;
padding:2px 5px;
}


table.invisitable, td.invisitable  {
border:0px;
width:100%;
}
td.invisitable {
width:20%;
padding:2px 5px;
}

.emph {
background-color:#99CC99;
}
.emph2 {
background-color:#FFFF66;
}
.tableheader {
background-color:#106635;
color:#ffffff;
}

.phonemes {
background-color:#106635;
font-size:1.4em;
color:#FFFFCC;
padding:1px 8px;
width:55px;
text-align:center;
font-family:"Lucida Sans Unicode";
}
.phonfont {
font-family:"Lucida Sans Unicode";
}


ul {
margin-left:20px
}
ol {
margin-left:20px
}

h1 {
padding:0px 0px 10px 0px;
}
h2 {
color:#000066;
padding:0px 0px 10px 0px;
text-align:center;
}
h3{
color:#000066;
}

.active {
border:1px solid black;
display:inline;
font-weight:bold;
color:#003366;
width:120px;
text-align:center;
padding:3px 10px;
text-decoration:none;
margin-left:10px;
margin-right:10px;
background-color:#FFCC99;
}


.centered {
text-align:center;
margin-top:0px;
margin-bottom:0px;
padding:0px;
}




/* Go to language practice button*/
#practice {
float:left;
width:15em;
padding:2px 4px;
background-color:#106635;
color:#FFFFCC;
text-decoration:none;
font-weight:bold;
border:1px solid black;
}
#practice:hover {
background-color:#003300;
}
/* Go back to grammar page button*/
#goback {
float:right;
/*position:absolute;
right:4px;*/
width: 15em;
padding:2px 4px;
background-color:#106635;
color:#FFFFCC;
text-decoration:none;
font-weight:bold;
border:1px solid black;
}
#goback:hover {
background-color:#003300;
}

div.panel, p.flip {
margin:0px;
padding:5px;
background-color:#ffffee;
border:solid 1px #000066;
}

td.panel, tr.panel {
text-align:left;
}

p.flip {
background-color:#106635;
color:#FFFFCC;
text-align:center;
font-weight:bold;
}

.tick {
color:#33CC33;
font-weight:bold;
}
.cross {
color:#CC3333;
font-weight:bold;
}