html, body {
    margin: 0;
    padding: 0;
    border: none;
    height: 100%;
}

body
{
	margin: 0px;
	padding: 0px;

	font-family: Arial, Verdana, sans-serif;
	font-size: 12pt;
   font-weight: normal;
	background-color: #FFFFFF;
	background-repeat:repeat-x;
	background-position:center 0px;
	text-align: center;
}

ul
{
	padding: 0px;
   margin: 0px;
   border: 0px none;
}

ol
{
	padding: 0px;
   margin: 0px;
   border: 0px none;
}

img
{
	border-style: none;
}

p
{
	padding: 4px;
   margin: 0px;
   border: 0px none;
	font-family: Verdana, Arial, sans-serif;
	font-size: 12px;
   font-weight: normal;
   color:#000000;
   text-align:left;
}

#content-block
{
	float:left;
	width:100%;
	background-color: #F2E3ED;
   overflow: hidden;
}

#home-content-block
{
	width:980px;
   overflow: hidden;
   margin: 0 auto;
}

.content-block
{
	width:100%;
   max-width:980px;
   overflow: hidden;
   margin: 0 auto;
   text-align:center;
}

.main-content-block
{
	width:980px;
   overflow: hidden;
   margin: 0 auto;
}

.clearfix
{
    zoom:1;
}

.clearfix:after
{
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}

input:focus,
select:focus,
textarea:focus,
button:focus
{
    outline: none;
}


.button
{
	float: left;
   margin-top:0px;
   height:22px;
   border-radius:10px;
   border: solid 1px #CCCCCC;
	box-shadow: 3px 3px 2px #888888;
	background-color: #71CEAC;
   cursor:pointer;
}

.button:hover
{
	background-color: #81DEBC;
}

.button-text
{
	margin-top:3px;
	width:100%;
   font-size:14px;
   font-weight:400;
   color:#000000;
   text-align:center;
}

.assessment-button
{
	float: left;
   margin-top:0px;
   margin-left:17px;
   width:60px;
   height:16px;
   border-radius:10px;
   border: solid 1px #CCCCCC;
	box-shadow: 2px 2px 1px #CCCCCC;
   background-color:#EEEEEE;
   font-size:12px;
   font-weight:400;
   color:#000000;
   text-align:center;
   cursor:pointer;
}

.assessment-button:hover
{
   background-color:#E7E7E7;
}

.tile
{
	float: left;
   margin-left:0px;
   margin-top:0px;
	padding:0px;
	width:118px;
   height:62px;
   border-radius:10px;
   border: solid 1px #CCCCCC;
	box-shadow: 3px 3px 2px #CCCCCC;
}

.pointers
{
   background-color:#FFFFFF;
}

.adjectives
{
   background-color:#FF8C98;
}

.nouns
{
   background-color:#EF4A2A;
}

.adjectivals
{
   background-color:#F495BF;
}

.verbs
{
   background-color:#29429B;
}

.adverbs
{
   background-color:#0D86CA;
}

.adverbials
{
   background-color:#7BD2F2;
}

.joiners
{
   background-color:#188942;
}

.punctuations
{
   background-color:#FFF100;
}

.text-pointers
{
   color:#FFFFFF;
}

.text-adjectives
{
   color:#FF8C98;
}

.text-nouns
{
   color:#EF4A2A;
}

.text-adjectivals
{
   color:#F495BF;
}

.text-verbs
{
   color:#29429B;
}

.text-adverbs
{
   color:#0D86CA;
}

.text-adverbials
{
   color:#7BD2F2;
}

.text-joiners
{
   color:#188942;
}

.text-punctuations
{
   color:#FFF100;
}

.text-gians
{
   color:#993366;
}

.tile-function-strip
{
   float:left;
   padding-top:0px;
   width:720px;
   text-align:center;
   align:center;
}

.tile-column
{
   margin-top:10px;
   margin-left:45px;
   width:90px;
}

.tile-pointer
{
   float: left;
   margin-left:0px;
   margin-top:0px;
   padding:0px;
   width:40px;
   height:46px;
   border-radius:10px;
   border: solid 1px #CCCCCC;
   box-shadow: 3px 3px 2px #CCCCCC;
}

.tile-adjective
{
   float: left;
   margin-left:0px;
   margin-top:0px;
   padding:0px;
   width:88px;
   height:46px;
   border-radius:10px;
   border: solid 1px #CCCCCC;
   box-shadow: 3px 3px 2px #CCCCCC;
}

.tile-noun
{
   float: left;
   margin-left:0px;
   margin-top:0px;
   padding:0px;
   width:88px;
   height:46px;
   border-radius:10px;
   border: solid 1px #CCCCCC;
   box-shadow: 3px 3px 2px #CCCCCC;
}

.tile-verb
{
   float: left;
   margin-left:0px;
   margin-top:0px;
   padding:0px;
   width:88px;
   height:46px;
   border-radius:10px;
   border: solid 1px #CCCCCC;
   box-shadow: 3px 3px 2px #CCCCCC;
}

.tile-adverb
{
   float: left;
   margin-left:0px;
   margin-top:0px;
   padding:0px;
   width:88px;
   height:46px;
   border-radius:10px;
   border: solid 1px #CCCCCC;
   box-shadow: 3px 3px 2px #CCCCCC;
}

.tile-punctuation
{
   float: left;
   margin-left:0px;
   margin-top:0px;
   padding:0px;
   width:22px;
   height:46px;
   border-radius:10px;
   border: solid 1px #CCCCCC;
   box-shadow: 3px 3px 2px #CCCCCC;
}

.tile-joiner
{
   float: left;
   margin-left:0px;
   margin-top:0px;
   padding:0px;
   width:40px;
   height:46px;
   border-radius:10px;
   border: solid 1px #CCCCCC;
   box-shadow: 3px 3px 2px #CCCCCC;
}

.tile-caption-black
{
   float: left;
   margin-left:0px;
   margin-top:15px;
   width: 100%;
   font-size:14px;
   font-weight:800;
   color:#000000;
   text-align:center;
}

.tile-caption-white
{
   float: left;
   margin-left:0px;
   margin-top:15px;
   width: 100%;
   font-size:14px;
   font-weight:800;
   color:#FFFFFF;
   text-align:center;
}

.reveal-modal-bg {
	position: fixed;
	height: 100%;
	width: 100%;
	background: rgba(218,218,218,.8);
	z-index: 100;
	display: none;
	top: 0;
	left: 0;
}

.radio-font input[type=radio] {
  display: none; }

.radio-font input[type=radio]:checked + span .radio-unchecked {
  display: none; }

.radio-font input[type=radio]:checked + span .radio-checked {
  display: inline-block; }

.radio-font input[type=radio] + span .radio-checked {
  display: none; }

.radio-font input[type=radio] + span .radio-unchecked {
  display: inline-block; }


.radio-font span {
	cursor:pointer;
}

.lesson-canvas input[type=radio] {
  display: none; }

.lesson-canvas input[type=radio]  * {
  display: inline-block;
  vertical-align: top; }

.lesson-canvas input[type=radio] + span .radio-checked {
  display: none; }

.lesson-canvas input[type=radio] + span {
   width: 100%;
   display: inline-block;
  	font-size: 14px;
   text-align: center;
   cursor:pointer;
  	color: #A74787;
}

.lesson-canvas input[type=radio]:checked + span .radio-unchecked {
  display: none; }

.lesson-canvas input[type=radio]:checked + span .radio-checked {
  display: inline-block; }


.results-area input[type=radio] {
  display: none; }

.results-area input[type=radio]  * {
  display: inline-block;
  vertical-align: top; }

.results-area input[type=radio] + span .radio-checked {
  display: none; }

.results-area input[type=radio] + span {
   width: 100%;
   display: inline-block;
  	font-size: 14px;
   text-align: center;
   cursor:pointer;
  	color: #A74787;
}

.results-area input[type=radio]:checked + span .radio-unchecked {
  display: none; }

.results-area input[type=radio]:checked + span .radio-checked {
  display: inline-block; }


.lesson-row input[type=radio] {
  display: none; }

.lesson-row input[type=radio]  * {
  display: inline-block;
  vertical-align: top; }

.lesson-row input[type=radio] + span .radio-checked {
  display: none; }

.lesson-row input[type=radio] + span {
   display: inline-block;
  	font-size: 14px;
   text-align: center;
   cursor:pointer;
  	color: #F2E3ED;
}

.lesson-row input[type=radio]:checked + span .radio-unchecked {
  display: none; }

.lesson-row input[type=radio]:checked + span .radio-checked {
  display: inline-block; }


@media only screen and (max-width : 448px)
{
	.content-block
	{
   	width:100%;
   }
}



