/**
* Wordfind.js 0.0.1
* (c) 2012 Bill, BunKat LLC.
* Wordfind is freely distributable under the MIT license.
* For all details and documentation:
*     https://github.com/bunkat/wordfind
*/


	body {
	  background: gray;
	}
	
	#puzzleWrap {
		width: 500px;
		position: relative;
		z-index:1;
	}
/**
	.puzzleWrap .cover {
		position: relative;
		display: block;
		width: 500px;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background-color: rgba(0,0,0,0.5);
		z-index: 999;
		cursor: pointer;
	}
**/	
	p {
	  font: 22pt sans-serif;
	  margin: 20px 20px 0px 45px;
	  //color: lightblue;
	}

	#puzzle {
	  border: 1px black solid;
	  width: 500px;
	  min-height: 292px;
	  color: black;
	  text-align: center;
	  margin-top: 10px;
	  padding-top:10px;
	  padding-bottom:10px;
	}

	#puzzle div {
	  width: 100%;
	  margin: 0 auto;
	}

	#puzzle .puzzleSquare {
	  height: 30px;
	  width: 30px;
	  text-transform: uppercase;
	  background-color: #fff;
	  border: 0;
	  outline: none;
	  font: 1em sans-serif;
	  color:   black;
	}

	button::-moz-focus-inner {
	  border: none;
	  outline: none;
	}

	#solSection {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-content: flex-start;
		width: 500px;
		overflow: hidden;
		//padding: 10px 0 15px;
	}

	#wordSection {
		//border: black 1px solid;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-content: flex-start;
		width: 500px;
		overflow: hidden;
		padding: 5px 0 25px;
	}
	
	#puzzle .selected {
	  color: #ee5426 !important;
	  outline: none !important;
	  
	  &:focus {
		border: none !important;
	  }
	}

	#puzzle .found {
	  background-color: #A9A9A9 !important;
	  color: #fff !important;
	}

	#puzzle .solved {
	  color: red;
	}

	#puzzle .complete {
	  background-color: lightblue;
	}

	#words {
	  width: 500px;
	  color: black;
	  text-align: center;
	  margin-top: 10px;
	}

	#words ul {
	  list-style-type: none;
	}

	#words li {
	  padding:  0 0 7px;
	  font: 1em sans-serif;
	  display: inline-block;
	  float: left;
	  width: 100px;
	  margin: 3px 15px;
	}

	#words .wordFound {
	  text-decoration: line-through;
	  font-weight: bold;
	  color: #ee5426;
	}


	#solve {
	  margin: 10px 10px 0 10px;	  
	  background: transparent;
	  color: red;
	  padding: 10px 20px;
	  border: 2px solid $red;
	  border-radius: 25px;
	  opacity: .5;
	  transition: opacity .25s ease-in;
	  
	  &:hover, &.gameSolved {
		opacity: 1;
	  }
	  
	