/* This will override w3CSS */

@font-face {
  font-family: 'Comfortaa';
  src: url('Fonts/comfortaa-bold.eot'); /* IE9 Compat Modes */
  src: url('Fonts/comfortaa-bold?#iefix') format('embedded-opentype'),/*  IE6-IE8 */
       url('Fonts/comfortaa-bold.woff2') format('woff2'), /* Super Modern Browsers */
       url('Fonts/comfortaa-bold.woff') format('woff'), /* Pretty Modern Browsers */
       url('Fonts/comfortaa-bold.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('Fonts/comfortaa-bold.svg#comfortaabold') format('svg'); }

@font-face {
  font-family: 'helveticaneuemedium';
  src: url('Fonts/helveticaneue_medium.eot');
  src: url('Fonts/helveticaneue_medium.eot?#iefix') format('embedded-opentype'),
      url('Fonts/helveticaneue_medium.woff2') format('woff2'),
      url('Fonts/helveticaneue_medium.woff') format('woff'),
      url('Fonts/helveticaneue_medium.ttf') format('truetype'),
      url('Fonts/helveticaneue_medium.svg#helveticaneuemedium') format('svg');
  font-weight: normal;
  font-style: normal;
}

.HiddenTemporary{
  display:none;
}

.AdHover{
  z-index:5;
  opacity: 0.8;
  position: relative;
  margin-right: 10px;
  padding: 1px 5px 1px 5px;
  color: #61554E;
  border-radius: 5px;
  background-color: #ffffff;
  float:right;
  font-size:10px;
  border: 1px solid #61554E;
  font-weight:normal;
  color:inherit}
.AdHover .nontooltip{  display:inline-block;}
.AdHover:hover .nontooltip {    display:none;}
.AdHover .tooltip{  display:none;}
.AdHover:hover .tooltip {    display:inline-block;}

@font-face {
  font-family: 'helveticaneueheavy';
  src: url('Fonts/helveticaneuehv.eot');
  src: url('Fonts/helveticaneuehv.eot?#iefix') format('embedded-opentype'),
      url('Fonts/helveticaneuehv.woff2') format('woff2'),
      url('Fonts/helveticaneuehv.woff') format('woff'),
      url('Fonts/helveticaneuehv.ttf') format('truetype'),
      url('Fonts/helveticaneuehv.svg#helveticaneueheavy') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'Icons';
  src: url('Fonts/Icons.eot');
  src: url('Fonts/Icons.eot?#iefix') format('embedded-opentype'),
      url('Fonts/Icons.woff') format('woff'),
      url('Fonts/Icons.ttf') format('truetype'),
      url('Fonts/Icons.svg#Icons') format('svg');
  font-weight: normal;
  font-style: normal;
}


button { outline: none; } /* REMOVES CLICK HILIGHTS*/

body {  font-family: "helveticaneuemedium", Arial, sans-serif;
        font-weight: normal;
        background-color: #F5F3EE;
        vertical-align: middle;
        margin:0px 0px 0px 0px;
        padding:0px 0px 0px 0px;
        line-height: 110%;      }

p { line-height: 100%; }

input[type=radio].w3-radio{
  vertical-align:middle;
}

/*modifications to w3-css*/
.w3-container{padding:0;}
.w3-sidenav{z-index:9; width:auto;}
.w3-sidenav a {padding:0px; line-height: 130%; padding-right: 16px;}
.w3-modal{z-index:10;width:100%;height:100%;min-height:100%;min-width:100%;vertical-align: middle;text-align: center;-webkit-align-content: center; align-content: center; background-color:rgb(0,0,0);background-color:rgba(0,0,0,0.4);}
.w3-modal-content{margin:0 auto;background-color:#fff;max-width:95%;width:95%;vertical-align: middle;text-align: center;-webkit-align-content: center; align-content: center; }
.paginationLink:hover,.paginationLink:focus{cursor:pointer}

.btn {
  position: relative;
  height: 20px;
  padding: 3.5px 5px 1px 5px;
  font-weight: 500;
  color: #fff;
  cursor: pointer;
  background-color: #1b95e0;
  border-radius: 3px;
  border: none;
  box-sizing: border-box;
  display: inline-block;
  overflow: hidden;
  text-align: left;
  white-space: nowrap;
  vertical-align: top;
  font: normal normal normal 11px 'Helvetica Neue',Arial,sans-serif;
}

.btn:focus,.btn:hover,.btn:active {
  background-color: #8BB7D3;
}

.btn img {
  text-align: left;
  vertical-align: top;
  display: inline-block;
  width: 12px;
  height: 12px;
  margin-bottom: 2px;
}

.CanvasBase{
  opacity:1;
  border-radius:5%;
  position: relative;
  z-index:0;
  padding:0px 0px 0px 0px;
}

.CenterText{
  font-family: 'helveticaneueheavy', Arial, sans-serif;
  font-weight: bold;
  position: absolute;
  text-align:center;
  width:100%;
  vertical-align:middle;
  z-index: 3;
  border-radius:5px;
  left: 0px;
  top: 0px;
}

.Centralise{
  text-align: center;
  vertical-align: middle;
}

.FBBtn {
  position: relative;
  height: 20px;
  padding: 3.5px 5px 1px 5px;
  font-weight: 500;
  font-size: 14px;
  color: #fff;
  cursor: pointer;
  background-color: #3b5998;
  border-radius: 3px;
  border: none;
  box-sizing: border-box;
  display: inline-block;
  overflow: hidden;
  text-align: left;
  white-space: nowrap;
  vertical-align: top;
  font: normal normal normal 11px 'Helvetica Neue',Arial,sans-serif;
}

.FBBtn:focus,.FBBtn:hover,.FBBtn:active {
  background-color: #6d84b4;
}

.GridOverlayGO{
  opacity: 1;
}

.GridOverlayNM{
  opacity: 1;
}

.GridOverlayRN{
  opacity: 1;
}

.Header {
  line-height: 300%;
  vertical-align: bottom;
}

.HTPDiv {
  z-index:11;
  vertical-align:
  middle;border-radius:5px;
}

.HTPHI{
  z-index:14;
}

.HTPLO{
  border-radius:5px;
  z-index:12;
  display:inline-block;
}

.HTPNewTile{
  float:left;
  margin: 5px;
}

.IcoFont{
  font-family: 'Icons';
}

.LeftIndentBox{
  margin: 16px;
}

.LPMC13{
  margin-left: 2px;
  margin-right: 2px;
  }

.LPMCFixed{
  display: inline-block;
  border-radius:5%;
  padding:0px 0px 0px 0px;
  font-family: "helveticaneuemedium", Arial, sans-serif;
  font-weight: bold;
  text-align:center;
  position:relative;
  margin-top: 8px;
  margin-bottom: 8px;
  z-index: 0;        }

.LPMCTable{
  border: none;
  z-index:1;
  text-align: center;
  vertical-align: middle;
  width:100%;
  min-width: 100%;
  padding:0px 0px 0px 0px;
  margin: 0px 0px 0px 0px;   }

.LPMCTable td{
  border: none;
  z-index:1;
  text-align: center;
  vertical-align: middle;
  width:100%;
  min-width: 100%;
  padding:0px 0px 0px 0px;
  margin: 0px 0px 0px 0px;   }

.MessageLines {
  font-family: "helveticaneuemedium", Arial, sans-serif;
  border: none;
  width:100%;
  text-align: center;
  vertical-align: middle;
  border-radius: 5px; }

.MessageLines td {
  font-family: "helveticaneuemedium", Arial, sans-serif;
  border: none;
  width:50%;
  text-align: center;
  vertical-align: middle;
  border-radius: 5px; }

.MessagesAndReset{
  font-family: "helveticaneuemedium", Arial, sans-serif;
  font-weight: normal;
  margin: 0px 0px 0px 0px;
  padding: 8px 0px 0px 0px;
  text-align: center;
  vertical-align: middle;
}

.NavColumn{
  line-height: 100%;
}

.NoPaddingOrMargin{
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
}

.OutgoingLink{
  text-decoration: underline;
}

.OutgoingLink:hover,.OutgoingLink:focus{cursor:pointer}

.ResetButton{
  font-size:14px;
}

.Selectable{
  -webkit-user-select: text;
  -moz-user-select: text;
  -ms-user-select: text;
  user-select: text;
}

.SmallText{
  line-height: 100%;
}

.SpanL{
  align:left;
  text-align: left;
}

.SpanR{
  align:right;
  text-align: right;
}

.Subtext{
  line-height: 100%;
  font-style: italic;
}

.TinyText{
  line-height: 100%;
}

.Underline{
  text-decoration: underline;
}

.UndoButton{
  font-size:14px;
}

#DonateModal{
  -webkit-user-select: text;
  -moz-user-select: text;
  -ms-user-select: text;
  user-select: text;
}

#GridOverlay{
  font-family: 'Comfortaa','helveticaneuemedium', Arial, sans-serif;
  vertical-align:middle;
  display: table;
  font-weight: bold;
  text-align:center;
  position:relative;
  border-radius:10px;
  position: absolute;
  opacity:0
  left: 0;
  top: 0;
  z-index: 7;
  margin:0px 0px 0px 0px;
  padding:0px 0px 0px 0px;
}

#GridOverlayText{
  word-wrap: break-word;
  display: table-cell;
  vertical-align: middle;
  border-radius:5px;
  white-space: initial;
  line-height: 120%;
}

#HiddenPreDraw{
  display:none;
}

#HighScoreButton{
  font-family: "helveticaneuemedium", Arial, sans-serif;
  background-color: #56182E;
  border: none;
  border-radius: 5px;
  height:20px;
  max-width: 250px;
  color: white;
  margin: 0px 0px 0px 0px;
  padding: 0px 10px 0px 10px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
}

#HTP03_2{
  z-index:13;
  position:absolute;
}

#LeftColumn01{
  padding:0px 0px 0px 0px;
  border-radius:10px;
  position:relative;
}

#LPMCContainer {
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
  z-index:0;
  text-align: center;
  vertical-align: middle;
}

#LPMCOverlayDiv{
  position: absolute;
  z-index: 3;
  padding:0px 0px 0px 0px;
}

#LPMCOverlayDivText{
  word-wrap: break-word;
  white-space: initial;
  text-align: center;
  vertical-align: middle;
  z-index:4;
}

#MenuButton{
  font-family: Arial, 'Icons',sans-serif;
  vertical-align:top;
  text-align:left;
}

#PageHeader{
  font-family: 'Comfortaa';
  margin:0px 0px 0px 0px;
  padding:0px 0px 0px 0px;
  vertical-align:middle;
}

#PrimaryColumn{
  margin:0px 0px 0px 0px;
  padding:0px 0px 0px 0px;
}

/*
#ProgressBar {
  vertical-align:middle;
  margin:0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
  display:inline-block;
}*/

#ResetButton{
  font-family: "helveticaneuemedium", Arial, sans-serif;
  background-color: #56182E;
  border: none;
  border-radius: 5px;
  height:20px;
  width: 35%;
  max-width: 250px;
  color: white;
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
}

#RightColumn01{
  padding:0px 0px 0px 0px;
}

#RightColumn02{
  padding:0px 0px 0px 0px;
}

#SecondaryColumn{
  float: left;
  margin:0px 0px 0px 0px;
  padding:0px 0px 0px 0px;
}

#SpanHowToPlay{
  color:white;
}

#UndoButton{
  font-family: "helveticaneuemedium", Arial, sans-serif;
  background-color: #aaaaaa;
  border: none;
  border-radius: 5px;
  height:20px;
  width: 35%;
  max-width: 250px;
  color: white;
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
}

#VanityCircle{
  align:left;
  text-align:left;
}


.CloseSpanGlow{
    -moz-animation: SpanGlow 0.4s 3;
    -webkit-animation: SpanGlow 0.4s 3; /* Chrome, Safari, Opera */
    animation: SpanGlow 0.4s 3;}
    @-webkit-keyframes SpanGlow { /* Chrome, Safari, Opera */
        100% {text-shadow: 0px 0px 20px white;
              opacity:0.5;}}
    @-moz-keyframes SpanGlow { /* Chrome, Safari, Opera */
        100% {text-shadow: 0px 0px 20px white;
              opacity:0.5;}}
    @keyframes SpanGlow { /* Standard syntax */
        100% {text-shadow: 0px 0px 20px white;
              opacity:0.5;}}

.GameOverGlow{
    -moz-animation: GOGlow 1s 3;
    -webkit-animation: GOGlow 1s 3; /* Chrome, Safari, Opera */
    animation: GOGlow 1s 3;}
    @-webkit-keyframes GOGlow { /* Chrome, Safari, Opera */
        100% {-webkit-box-shadow: 0px 0px 2px 2px #61554E;}}
    @-moz-keyframes GOGlow {
        100% {box-shadow: 0px 0px 2px 2px #61554E;}}
    @keyframes GOGlow { /* Standard syntax */
        100% {box-shadow: 0px 0px 2px 2px #61554E;}}
