*{box-sizing: border-box;margin:0;}
body{
	background-color: #e0c7a1; 
	max-width: 1200px;
	margin: auto;
	border: 0px solid red;

	font-family: 'PT Sans Narrow', sans-serif;

	font-size: 1.2rem;
	color: #4a1801;


}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}


button{
    border: 3px solid white; 
    -webkit-box-shadow: 
      inset 0 0 8px  rgba(0,0,0,0.1),
            0 0 16px rgba(0,0,0,0.1); 
    -moz-box-shadow: 
      inset 0 0 8px  rgba(0,0,0,0.1),
            0 0 16px rgba(0,0,0,0.1); 
    box-shadow: 
      inset 0 0 8px  rgba(0,0,0,0.1),
            0 0 16px rgba(0,0,0,0.1); 
    padding: 1px 15px;

    background: #4a1801ad;
    color: #fff;
    margin: 15px 0 15px 5px;

    text-align: center;	
    font-size: 1.3rem;
    /*letter-spacing: 3px;*/
    /*width: 58px;*/
    cursor: pointer;
    border-radius: 26px;
    /*font-weight: bold;*/
    font-family: 'Nunito', sans-serif;
}
button:focus {outline:0;}

input{
    border: 5px solid white; 
    -webkit-box-shadow: 
      inset 0 0 8px  rgba(0,0,0,0.1),
            0 0 16px rgba(0,0,0,0.1); 
    -moz-box-shadow: 
      inset 0 0 8px  rgba(0,0,0,0.1),
            0 0 16px rgba(0,0,0,0.1); 
    box-shadow: 
      inset 0 0 8px  rgba(0,0,0,0.1),
            0 0 16px rgba(0,0,0,0.1); 
    padding: 6px;
    background: rgba(255,255,255,0.5);
    margin: 10px 0 10px 0;

    text-align: center;	

    font-size: 1.6rem;
    letter-spacing: 3px;
    width: 200px;
}

label{
	text-align: center;
	font-size: 1.6rem;
	line-height: 1.5rem;
}

p{
  text-align: center;
  font-size: 1.8rem;
  /*line-height: 1.8rem;*/
  /*margin:1rem 0px;  */
}

hr{
    border: 0;
    height: 1px;
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
    display: block;width: 100%;
    margin:10px 0px;
}

h1{
	text-align: center;
	line-height: 2.4rem;
	margin:1rem 0px;

  width: 100%;
}

#getLvl{
	background-color: #ddd;
	padding: 0.4rem;
	border-radius: 5px;
	display: none;	
}
.lvlNr{
	/*border: 1px solid #fff;*/
	/*width: 120px;*/
	font-size: 1.5rem;
	/*background-color: #ddd;*/
	/*border-radius: 3px;*/
	/*margin: 0.5rem 0px;*/
}


.lvlLinks{
   display: flex;
   flex-direction: row;
   flex-wrap: wrap;
   justify-content: center;
   align-items: flex-start;
   align-content: flex-start;

   width: 100%;
   text-align: center;
}


a.aLvlLinks:link,a.aLvlLinks:visited{
	padding: 5px;
	border: 1px solid #4a1801;
	background-color: #4a180129;
	margin:5px;
	color: #4a1801;
	border-radius: 10px;
	font-weight: bold;
	text-decoration: none;
  width:105px;text-align:center
}

a.lvlLink:link,a.lvlLink:visited{
  padding: 5px;
  border: 1px solid #4a1801;
  background-color: #4a180129;
  margin:5px;
  color: #4a1801;
  border-radius: 10px;
  font-weight: bold;
  text-decoration: none;
}

.content{
   display: flex;
   flex-direction: column;
   flex-wrap: nowrap;
   justify-content: flex-start;
   align-items: center;
   align-content: center;
   padding: 0px 5px;
}
.letterBox{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
	align-items: flex-start;
	align-content: stretch;	
}

.letter{
	font-family: 'Nunito', sans-serif;
	background-image: url("/letter1_bg_50t.png");
	border: 0px solid red;
	/*background-color: #cccccc;*/
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;

	width: 36px;
	height: 36px;

	text-align: center;

	font-size: 1.6rem;



text-shadow: 0px -1px 0px rgba(255,255,255,.5);

/*display: inline-block;*/

margin: 1px;
}