#search,.mobile-search,.socialicons{display: none;}
.sidebar-mobile {
    display: none;
}

#menuToggle
    {
      display: none;
      position: static;
      top: 10px;
      left: 40px;
      
      z-index: 1;
      
      -webkit-user-select: none;
      user-select: none;
      padding-left: 10px;
      padding-top: 25px;
    }
    
    #menuToggle a
    {
      width: 50%;
      float: left;
      text-decoration: none;
      color: #232323;
      
      transition: color 0.3s ease;
    }
    
    #menuToggle a:hover
    {
      color: tomato;
    }
    
    
    #menuToggle input
    {
      display: block;
      width: 40px;
      height: 32px;
      position: absolute;
      top: -7px;
      left: -5px;
      
      cursor: pointer;
      
      opacity: 0; /* hide this */
      z-index: 2; /* and place it over the hamburger */
      
      -webkit-touch-callout: none;
    }
    
    /*
     * Just a quick hamburger
     */
    #menuToggle span
    {
      display: block;
      width: 38px;
      height: 4px;
      margin-bottom: 7px;
      position: relative;
      
      background: #fab737;
      border-radius: 3px;
      
      z-index: 1;
      
      transform-origin: 4px 0px;
      
      transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
                  background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
                  opacity 0.55s ease;
    }
    
    #menuToggle span:first-child
    {
      transform-origin: 0% 0%;
    }
    
    #menuToggle span:nth-last-child(2)
    {
      transform-origin: 0% 100%;
    }
    
    /* 
     * Transform all the slices of hamburger
     * into a crossmark.
     */
    #menuToggle input:checked ~ span
    {
      opacity: 1;
      transform: rotate(45deg) translate(-2px, -1px);
      background: #232323;
    }
    
    /*
     * But let's hide the middle one.
     */
    #menuToggle input:checked ~ span:nth-last-child(3)
    {
      opacity: 0;
      transform: rotate(0deg) scale(0.2, 0.2);
    }
    
    /*
     * Ohyeah and the last one should go the other direction
     */
    #menuToggle input:checked ~ span:nth-last-child(2)
    {
      transform: rotate(-45deg) translate(0, -1px);
    }
    
    /*
     * Make this absolute positioned
     * at the top left of the screen
     */
    #menu
    {
      position: absolute;
      width: 100%;
      margin: -100px 0 0 -50px;
      padding: 50px;
      padding-top: 125px;
      
      background: #ededed;
      list-style-type: none;
      -webkit-font-smoothing: antialiased;
      /* to stop flickering of text in safari */
      
      transform-origin: 0% 0%;
      transform: translate(-100%, 0);
      
      transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);
    }
    
    #menu li
    {
      padding: 10px 10px 0px 5px;
      font-size: 18px;
    }
    
    /*
     * And let's slide it in from the left
     */
    #menuToggle input:checked ~ ul
    {
      transform: none;
    }


/* 
  ##Device = Desktops
  ##Screen = 1281px to higher resolution desktops
*/

@media (min-width: 1281px) {
  
  /* CSS */

  
}

/* 
  ##Device = Laptops, Desktops
  ##Screen = B/w 1025px to 1280px
*/

@media (min-width: 1025px) and (max-width: 1280px) {
  
  /* CSS */
  #search,#mobile-search{display: none;}
}

/* 
  ##Device = Tablets, Ipads (portrait)
  ##Screen = B/w 768px to 1024px
*/

@media (min-width: 768px) and (max-width: 1024px) {
  #menuToggle{display: none;}
  #search,#mobile-search{display: none;}
/* 
  ##Device = Tablets, Ipads (landscape)
  ##Screen = B/w 768px to 1024px
*/
}

@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
  
  /* CSS */
  #menuToggle{display: none;}
  #search,#mobile-search{display: none;}
}

/* 
  ##Device = Low Resolution Tablets, Mobiles (Landscape)
  ##Screen = B/w 481px to 767px
*/

@media (min-width: 481px) and (max-width: 767px) {
  
  /* CSS */
  #menuToggle{display: none;}
  #search,#mobile-search{display: none;}
}


/* 
  ##Device = Most of the Smartphones Mobiles (Portrait)
  ##Screen = B/w 320px to 479px
*/

@media (min-width: 320px) and (max-width: 980px) {
	.hideonmobile{display: none;}
	.sidebar-mobile {
    display: block;
}
            .socialicons{display: block;}
            .socialicons{margin-top: 15px;
background: #fff;
width: 100%;
padding: 0px;}
            
            /* CSS */
            .logo{top: -100px;
          left: 0;
          bottom: 0;
          right: 0;
          margin: auto;
          width: 250px;
		height: 203px;
      }
          .socialicons img {
              width: 30px;
              height: 30px;
              display: block;
              position: relative;
              margin-top: 5px;
			  padding:10px;
          }

          .advancedsearchbtn {
              position: absolute;
              top: 70%;
              
              color: #fff;
              text-align: center;
              width: 72%;
          }
          #submit {
              width: 82%;
              display: block;
              background: #e3a526;
              padding: 0;
              margin: 0;
			  margin-top:30px;
			  margin-left:40px;
                  margin-right: 0px;
              border: 0;
              font-size: 19px;
              line-height: 39px;
              height: 44px;
              border-radius: 5px;
              margin-right: 10px;
              color: #fff;
              position: relative;
          top: 57%;
		  cursor:pointer;
		  
          }

            #menuToggle{display: block;}
            #search,.mobile-search{display: block;}
            .toplinks{display: none;}
            .topsite,.mainsite,.bottomsite{width: 100%;padding:0;}
            .topsite{height: auto;}
            .bottomsite{padding: 0!important; padding-top: 15px !important;}
            .content{max-width: 97%;
              display: flex;
              flex-wrap: wrap; 
              justify-content: center; 
              align-items: center; 
              float:none;
              margin: 0 auto;
            }
            .sitewidth{width: 100%;padding: 0;}
            .mainheadertext{width: 100%;display: none;}
            .mainimage0{width: 100%;}
			.mainimage1{width: 100%;}
			.mainimage2{width: 100%;}
			.mainimage3{width: 100%;}
			.mainimage4{width: 100%;}
            .indexsearchbackground{
             padding-top: 115px;
              position: static;
          float: none;
          transform:  none;
          display: none;
          }
          .mainimage0{background-color: #F9B42B;background-position: 63% 0%;background-size: cover; height: 230px;padding-bottom:10px;}
		  .mainimage1{background-color: #F9B42B;background-position: 63% 0%;background-size: cover; height: 230px;padding-bottom:10px;}
		  .mainimage2{background-color: #F9B42B;background-position: 63% 0%;background-size: cover; height: 230px;padding-bottom:10px;}
		  .mainimage3{background-color: #F9B42B;background-position: 63% 0%;background-size: cover; height: 230px;padding-bottom:10px;}
		  .mainimage4{background-color: #F9B42B;background-position: 63% 0%;background-size: cover; height: 230px;padding-bottom:10px;}
          a.category:link, a.category:visited{width: 99%;}
          
		  .bannerad{display:none;}
		  //.bannerad{width: 100%;padding: 5px 0px 0px 0px;text-align: center; float: left; display:none;}
          //.bannerad img {width: 100%;}
          .contentboxes{width: 100%;}
          .h1textcentered{width: 100%;} 
          .sidebar{width: 95%;position: unset;display:block;margin:0 auto;float: none; }
          .newgames{width: 100%;float: none;margin-top: 30px;}
          .newgames span {
              display: block;
              float: left;
              width: 100%;
          }
          .listedgames a{font-size: 12px;}
          img.listedimages{width: 100%; height: auto;padding: 1px;margin-top:30px;}
          .indexleftbox{width: 95%;}
          .indexrightbox{width: 95%;}
          .indexsmall{float: left;width: 100%;}
          .h1text{width: 100%;text-align: left;}
          .h1text img{width: auto; padding: 0;margin:0;}
          .h1text ul{clear: both;}


          .board-games{width: 100%;overflow: hidden; display: none;}
          
          h1{font-size: 33px;}

          #search {
            align-items: center;
            background: rgb(251, 182, 42);
            height: 0;
            display: flex;
            justify-content: center;
            opacity: 0;
            position: fixed;
            transition: all 0.5s;
            width: 100vw;
            will-change: transform, opacity;
            z-index: -1;
          }
          #search:target {
            height: 100vh !important;
            opacity: 1;
            width: 100vw !important;
            z-index: 2;
          }
          #search:target .close-btn {
            display: block;
          }
          #searchbox {
            background: transparent;
            border: solid #fff;
            border-width: 0 0 1px 0;
            color: #fff;
            flex: 1 0 auto;
            font-size: 2rem;
            height: 2rem;
            
            outline: 0;
            padding: 2rem 1rem;
            text-align: center;
			
          }
          #search p {
              color: #fff;
              font-weight: bolder;
              font-family: Roboto;
              position: absolute;
              top: 10%;
              font-size: 40px;
          }

          .close-btn {
            display: none;
            color: #fff;
            font-size: 2rem;
            position: absolute;
            top: 0.5rem;
            right: 2rem;
          }

          .close {
            position: absolute;
            right: 32px;
            top: 32px;
            width: 32px;
            height: 32px;
            
          }
          .close:hover {
            opacity: 1;
          }
          .close:before, .close:after {
            position: absolute;
            left: 15px;
            content: ' ';
            height: 33px;
            width: 2px;
            background-color: #fff;
          }
          .close:before {
            transform: rotate(45deg);
          }
          .close:after {
            transform: rotate(-45deg);
          }

          .svg-icon.search-icon {
            position: absolute;
          right: 10px;
          top: 24px;
            display: inline-block;
            width: 30px;
            height: 30px;
            /* On hover: blue strokes */
            /* On click: thicker black strokes  */
          }
          .svg-icon.search-icon:focus .search-path, .svg-icon.search-icon:hover .search-path {
            stroke: #fab737;
          }
          .svg-icon.search-icon:active .search-path {
            stroke: #fab737;
            stroke-width: 4px;
          }


          .svg-icon.search-icon:focus .search-path, .svg-icon.search-icon:hover .search-path {
            stroke: #fab737;
          }
          .svg-icon.search-icon:active .search-path {
            stroke: #fab737;
            stroke-width: 4px;
          }

          .whiteborder.hugelist center {
              font-size: 30px;
              text-align: center;
              padding-top: 20px;
          }
          .wrapper {
              overflow: hidden;
          }
          .contentboxes.gamelists .blackcategories {width: 100%;height: 50px;}
          .blackcategories.gameicon img{width: 50px; height: 50px; position: absolute;left: 0;padding-left: 15px;}
          .categorytext,.categorytext2{position: unset;width: 50%; text-align:center; margin:0 auto;transform: unset;font-size: 22px;}
          hr.bcategories{display: none;}
.blackcategories.gameicon{position: absolute;
    top: 0; left: 0;
    background: black;
    height: 100%;
    width: 100%;}
.listedgames{display: block;text-align: center;margin-top: 10px;margin-bottom: 40px;}
.indexleftbox{width: 48%;margin-right: 0;}
.indexrightbox{width: 48%;}
.viewall{    
	transform-origin: 0 0;
    transform: rotate(270deg);
    color: #FFFFFF;
    top: 62px;
position: absolute;
font-weight: bold;
font-size: 14px;
right: -25px;
}
.viewall::before {
    content: "";
    border: 1px solid #fff;
    transform-origin: 0 0;
    transform: rotate(270deg);
    position: absolute;
    height: 57px;
    margin: -5px;
}

.whiteborder.firstadv{text-align: center;}
.secondadv {
              text-align: center;
          }
.whiteborder a img{padding: 1px;
display: inline-block;
margin: 0 5px;}


a:link, a:visited {
	display:inline-block;
  color:#000000; 
  text-decoration:underline;
  padding:0px;
  font-size:20px;
}

a.rlink:link, a.rlink:visited{
	display:inline;
  color:#000000; 
  text-decoration:underline;
  padding:0px;
}

.blacktable{
  background-color: #000000;
  color: white;
  padding: 10px 25px;
  
  margin-right:10px;
  margin-top:10px;
  margin-bottom:10px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-weight:bold;
  font-size:16px;
  width:87px;
  height:55px;
}
.gimage{
float: none;
padding:0px;
	margin:0px;

	
}
.gameheader{
	width:100%;
	//border:1px solid #000000;
	//height:auto;
	min-height:250px;
	margin-bottom:20px;
	text-align:center;
}

.column1{
   display:none;
}
.column2{
    float:left;
    width:100%;   
    text-align: center;
	padding:30px;
}


ul.gamecontents {
  moz-column-count:1;
  -webkit-column-count:1;
  column-count:1;
  margin-left:20px;
  margin-right:0px;
  padding-left:20px;
  padding-right:0px;
  margin-top:0px;
  padding-top:0px;
  text-align:left;
  list-style-type: square;
}

li.gamecontents{
-webkit-margin-before: 0;
  -webkit-margin-after: 0;
  -webkit-column-break-inside: avoid;
   page-break-inside: avoid;
  break-inside: avoid;
	padding-right:0px;
	margin:0px;
	text-align:left;
	padding-top:10px;
	padding-bottom:10px;
	vertical-align: text-top;
}

ul.funfacts {
  moz-column-count:1;
  -webkit-column-count:1;
  column-count:1;
  margin-left:20px;
  margin-right:0px;
  padding-left:20px;
  padding-right:0px;
  margin-top:0px;
  padding-top:0px;
  text-align:left;
  list-style-type: square;
  background-position:center;
  background-repeat:no-repeat;
  background-size: auto 100%;
}

li.funfacts{
-webkit-margin-before: 0;
  -webkit-margin-after: 0;
  -webkit-column-break-inside: avoid;
   page-break-inside: avoid;
  break-inside: avoid;
	padding-right:0px;
	margin:0px;
	text-align:left;
	padding-top:10px;
	padding-bottom:10px;
}

ul.rulelinks {
  moz-column-count:1;
  -webkit-column-count:1;
  column-count:1;
  margin-left:20px;
  margin-right:0px;
  padding-left:20px;
  padding-right:0px;
  margin-top:0px;
  padding-top:0px;
  text-align:left;
  list-style-type: square;
  //border:1px #000000 solid;
}

li.rulelinks{
-webkit-margin-before: 0;
  -webkit-margin-after: 0;
  -webkit-column-break-inside: avoid;
   page-break-inside: avoid;
  break-inside: avoid;
	padding-right:0px;
	margin:0px;
	text-align:left;
	padding-top:10px;
	padding-bottom:10px;
	vertical-align: text-top;
	//list-style-position:outside;
	//border:1px #000000 solid;
}
.desktopbanner{
display:none;
}
.mobilebanner{
display:block;
}

form.gsearch{

margin-left:-20px;

}
.mimage{
float: none;
padding-left:0px;
padding-right:0px;
margin-left:0px;
margin-right:0px;
  //border:10px #ffffff solid;
  display:block;
  position:relative;
  //top: 50%;
  left: 50%;
  -ms-transform: translate(50%, 0%);
  transform: translate(-50%, 0%);
  //left: -moz-calc(-50% - 100px);
    //left: -webkit-calc(50% - 100px);
    //left: calc(50% - 100px);

}

#myUL li a {
padding: 4px;
}


}

/*@media (min-width: 320px) and (max-width: 414px) {
  .mainimage0{height: 122px;}
  .logo{
top: -67px;
width: 160px;
height: 130px;

  }
  .bottomsite{padding: 0!important; padding-top: 15px !important;}

  }*/
  
  
  
@media (min-height: 200px) and (max-height: 400px) {
  
#search p {
              color: #fff;
              font-weight: bolder;
              font-family: Roboto;
              position: absolute;
              top: 8%;
              font-size: 25px;
}
#searchbox {
            background: transparent;
            border: solid #fff;
            border-width: 0 0 1px 0;
            color: #fff;
            flex: 1 0 auto;
            font-size: 1.2rem;
            height: 1.5rem;
            
            outline: 0;
            padding: 1rem .5rem;
            text-align: center;
			
          }
.close-btn {
            display: none;
            color: #fff;
            font-size: 2rem;
            position: absolute;
            top: 0.5rem;
            right: 2rem;
}

.close {
            position: absolute;
            right: 25px;
            top: 10px;
            width: 32px;
            height: 32px;
            
}
#submit {
              width: 82%;
              display: block;
              background: #e3a526;
              padding: 0;
              margin: 0;
			  margin-top:20px;
			  margin-left:25px;
                  margin-right: 0px;
              border: 0;
              font-size: 17px;
              line-height: 39px;
              height: 35px;
              border-radius: 5px;
              margin-right: 10px;
              color: #fff;
              position: relative;
          top: 57%;
		  cursor:pointer;
          }
.advancedsearchbtn {
              position: absolute;
              top: 70%;
			  font-size:10px;
              color: #fff;
              text-align: center;
              width: 72%;
          }
  
}