#sectionP{
display:none
}
.anagram-margin{
  margin-left:-5px
}
.anagram-frame{
  width:315px;
  margin:auto
}
.selectDiv{
display:flex;
justify-content: space-between;
}

#texts{
display:flex;
justify-content: space-between;
margin-top:10px;
}

#pointsDiv{
display:flex;
justify-content: space-between;
}

#points, #highScore {
background: #fff;
height: 30px;
border: 1px solid #444;
font-size: 24px;
line-height:30px;
text-align:center;
width:61px;
}

#wordInput {
float:left;
width: 181px;
height: 30px;
margin:0;
font-size:1.4em;
opacity:1;
padding:1px 0 0 4px;
border: 1px solid #444;
border-radius: 4px;
}


.anagramBtn{
color: white;
font-size:16px;
width:63px;
height:63px;
border:1px solid #333;
padding:0
}
#startBtn{
  background: #006e00;
}
#stopBtn{
  background:#d46b1c;
}
#shuffleBtn{
background:#808000
}
#clearBtn{
  background:#FF8C00;
}
/* .anagramBtn.808000fake-hover */
.anagramBtn:hover{
border:1px solid #004000;

}
.anagramBtn:active {
background: #006e00
}


#tiles{
height:189px;

/*margin:0 auto 0 auto;*/

display:flex;
}
#newGdiv, #stopGdiv{
width:63px;
vertical-align:top;
}
#newGdiv{
float:left;
}

#squares{
width:189px;
height:189px;
float:left;
}

#stopGdiv{
float:right;
}
#clock {
background:#e4e4cf;
font-size:1.5em;
color:#000
}
.letter{
cursor: pointer;
width:63px;
height:63px;
border:1px solid #aaa;
float: left;
color:#000;
text-align: center;
background:#ebe8c7;
font-size: 30px;
text-transform: uppercase;
font-weight: bold;
}
.letter:hover {
background:#d6d5ad;
border:none
}
.letter:active,.letter:focus  {
background: #c5c49f;
border:none;
}
.buttonDiv{
  height:20px;
  margin:3px 0;
  
}
#error{
flex:5;
margin:auto;
display:none
}
#ratio{
 font-size:15px;
  flex:4;
font-weight:bold;
text-align:right;

}
#remaining, #foundWords, #unfound, #about{
margin:auto;
max-width:500px;
background: #eaead7;
border:1px solid #000;
padding:5px;
text-align:center;
}
#remaining {
margin:5px auto 0 auto;
display:none;
}
#foundWords {
margin:auto;
font-size:16px;
display:none;
}
#unfound{
margin:auto;
display:none
}
#about{
margin:10px auto ;
font-size:14px;
}
#about p{
margin-top:5px
}
#about h3{
margin:10px;
text-align:center
}

.redBold{
color:#b9032e;
font-weight:bold
}
#byline {display:none}


 @media all and (min-width: 480px) {
#byline{
font-size:0.8em;
}
.anagram-margin{
  margin:auto
}
#sectionP{
display:block
}
#heading p{
font-size:1.4em;
margin-top:5px;
}
.anagram-frame{
  width:380px;
}
#top,#texts,#pointsDiv{
width:380px;
}

#points,#highScore{
width:74px ;
}

#wordInput {
width:220px;
font-size:1.3em;
}

#tiles{
width:380px;
height:228px;
}

#newGdiv,#stopGdiv{
width:76px;

}
#squares{
width:228px;
height:228px;
}
.letter{
  width:76px;
  height:76px;
}
.anagramBtn{
width: 76px;
height: 76px;
font-size:17px;
}


}
@media all and (min-width: 768px) {

}