/*
Theme Name: 	azplaygames
Theme URI: 		azplaygames
Description: 	azplaygames
Version: 		1.0
Author: 		azplaygames
Author URI: 	azplaygames
License:
License URI:
Tags: azplaygames
*/
* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
@font-face {
  font-family: 'Pacifico';
  font-style: normal;
  font-weight: 400;
  src: local('Pacifico Regular'), local('Pacifico-Regular'),
    url(https://fonts.gstatic.com/s/pacifico/v12/FwZY7-Qmy14u9lezJ-6H6MmBp0u-.woff2)
      format('woff2');
  font-display: swap;
}
[class^="icon-"],
[class*=" icon-"] {
    font-family: FontAwesome;
    font-weight: normal;
    font-style: normal;
    text-decoration: inherit;
    -webkit-font-smoothing: antialiased;
    *margin-right: .3em;
}


.search {
  width: 100%;
  position: relative;
  display: flex;
  margin-top: -10px;
}

.searchTerm {
  width: 350px;
  height: 40px;
  border: 2px solid #154c79;
  padding: 10px;
  border-radius: 5px 0 0 5px;
  outline: none;
  color: #154c79;
  margin-top: 10px;
  margin-left: 100px;
  margin-right: -6px;
}

.searchTerm:focus{
  color: #00B4CC;
}

.searchButton {
  width: 40px;
  height: 40px;
  border: 2px solid #154c79;
  background: #154c79;
  color: #000;
  border-radius: 0 5px 5px 0;
  cursor: pointer;
  margin-top: 10px;
}




.icon-close:before {
    content: "\f00d";
    color: red;
    font-size: 20px;
}
.icon-search:before {
    content: "\f002";
}
.icon-full-screen:before {
    content: "\f0b2";
}
.icon-item:before {
    content: "\f0e7";
}
.icon-item29:before {
    content: "\f0e7";
}
.icon-item30:before {
    content: "\f030";
}
.icon-item32:before {
    content: "\f12e";
}
.icon-home:before {
    content: "\f015";
}
#close-full-screen {
    display: none;
    position: fixed;
    right: 20px;
    top: 20px;
    z-index: 99999;
}
h1 {color: black; font-size: 20px; padding-left: 10px;}
h2, h3 { padding:0; margin:0;     color: black; font-size: 15px;}

a {color: #06538b; text-decoration:none;}
body {
    background-color:#212121;
    margin: 0 auto;
    padding: 0 inherit;
    color: #06538b;
    font-family: sans-serif;
    font-weight: normal;
    font-style: normal;
    font-size: 14px;
    line-height: 1;
    position: relative;
    -webkit-font-smoothing: antialiased;
}
.clear-both {
    clear: both;
}
 /* container */
 #container {
     /*max-width:1120px;*/
	max-width: 1150px;
     padding:0;
     background-color:#e3e3e1;
     margin: 0 auto;
	 color: #222223;
 }
 #container .logo, .search {
    display: inline-block; /* Display elements in a line */
}
 #container .header {
     width:100%;
     height:90px;
     border-bottom: 1.2px solid #C6C2C2;
     background-color:#e3e3e1;
    display: flex;
    align-items: center; /* Center items vertically */
    justify-content: space-between; /* Add space between logo and search form */
	padding-top: 5px;
	padding-left: 10px;
}
 }
 #container .header .logo {
     display: inline-block;
    z-index: 1;
    position: relative;
    vertical-align: top;
 }
 #container .header .head-title {
     display:inline-block;
     height:53px;
     padding-left:10px;
	padding-top: 15px;
     width:300px;
     text-align:Left;
 }
  #container .header .head-search {
     display:inline-block;
     height:53px;
     padding-left:10px;
	 padding-top: 15px;
     width:300px;
     text-align:right;
 }
  #container .header .head-title h1 {
      font: inherit;
      font-size: 27px;
    color: #e3e3e1;
    margin: 8px 0 10px;
    white-space: nowrap;
	text-transform: capitalize;
	font-weight: bold;
  }
  #container .content {
      
      width:100%;
      background-color:#e3e3e1;
	  margin-top:-10px;
      
  }
#container .content .top-bar {
    width:100%;
    background-color:#e3e3e1;
    padding:10px;
}
#container .content .top-bar ul {
    padding:0;
    margin:0;
    display:table;

}
#container .content .top-bar ul li {
    float:left;
    display:inline-block;
    /*padding:5px;*/
}
#container .content .top-bar ul li a {
    /*margin-right:20px;*/
}
#container .content .top-bar ul li a  i {
  margin-right: 5px;
}
#container .content .content-box {
    width:100%;
    min-height:100%;
    margin-top:10px;
}
#container .content .content-box .content-game {
    margin:0 auto;
    width:990px;
    background-color:#fff;
    padding:10px;
    float:left;
    margin-left:10px;
}
#container .content .content-box .content-game .top-left {
    width:130px;
    padding-top:30px;
    float:left;
}
#container .content .content-box .content-game .top-left ul {
    padding:0;
    margin:0;
    display:table;
}
#container .content .content-box .content-game .top-left ul li {
    float:left;
    display:inline-block;
    margin-bottom:10px;
}
#container .content .content-box .content-game .top-left ul li span {
    display: block;
    font-size: 13px;
    font-weight: bold;
    padding: 6px 8px;
    height: 32px;
    line-height: 20px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    transition: all .3s;
    background-color: #d3f0f9;
}

#container .content .content-box .content-game .top-right {
    width:130px;
    padding-top:30px;
    float:left;
}
#container .content .content-box .content-game .top-right ul {
    padding:0;
    margin:0;
    display:table;
}
#container .content .content-box .content-game .top-right ul li {
    float:left;
    display:inline-block;
    margin-bottom:10px;
}
#container .content .content-box .content-game .top-right ul li span {
    display: block;
    font-size: 13px;
    font-weight: bold;
    padding: 6px 8px;
    height: 32px;
    line-height: 20px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    transition: all .3s;
    background-color: #d3f0f9;
}
#container .content .content-box .content-game .game-show {
    width:960px;
    padding:0 10px 10px 10px;
    float:left;
}
#container .content .content-box .content-game .game-show  .head-game {
    width:100%;
    padding: 3px 0px;
    height: 30px;
}
#container .content .content-box .content-game .game-show  .head-game .breadcrumbs {
    float:left;
}
#container .content .content-box .content-game .game-show  .head-game .control {
    float:right;
}
#container .content .content-box .content-game .game-show .play-game {
    width: 960px;
	height: 650px;
}
#container .content .content-box .content-game .game-show .play-game .game-content {
/*display:flex;*/
justify-content: center;
    padding-bottom: 5px;
    text-align: center;
    max-height: 780px;
    overflow: hidden;
}
#container .content .content-box .ads-left {
    height: 600px;
    width: 160px;
    float:left;
}
#container .content .content-box .ads-right {
    height: 600px;
    width: 160px;
    float:left;
    margin-left:10px;
}
#container .content .content-box .content-game .social {
    width:100%;
    padding:10px;
    display:inline-block;
}
#container .content .content-box .content-game .game-info {

}
#container .content .content-box .content-game .game-info .thumb {
    float:left;
    margin-top:10px;
}
#container .content .content-box .content-game .game-info .thumb img {
    height: auto;
	width: 100%;
}
#container .content .content-box .content-game .game-info .description {
    margin-left: 170px;
    line-height: 1.5em;
    margin-top:5px;
}
#container .content .content-box .content-game .game-info .tags {
    margin-left: 170px;
    padding-top: 20px;
}
#container .content .content-box .content-game .game-info .tags a {
    text-decoration:underline;
    font-style:italic;
}
#container .content .content-games {
	
    width:100%;
    min-height:100%;
    margin-top:10px;
}
#container .content .content-games .inner-container {
    width:100%;
    padding: 20px;
    background-color:#fff;
}

#container .content .content-games .inner-container ul {
    padding:0;
    margin:0;
    display:table;
    border-left: 1px solid #b5b5b5;
    border-bottom: 0px;
    border-top: 0px;
    border-right:0px;
}
#container .content .content-games .inner-container ul li {
    position: relative;
    float: left;
    width: 160px;
    height: 165px;
    border: 1px solid #b5b5b5;
    overflow: hidden;
    text-decoration: none;
    background: #f6f6f6;
    background: linear-gradient(to bottom, #f6f6f6, #e8e8e8 50%, #ddd);
}
#container .content .content-games .inner-container ul li img {
    height: auto;
	width: 100%;
    border:0;
	padding-left: 5px;
	padding-right: 5px;
	padding-top: 5px;
}
#container .content .content-games .inner-container ul li span {
    display: block;
    font-size: 13px;
    font-weight: bold;
    padding: 6px 8px;
    height: 32px;
    line-height: 20px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    transition: all .3s;
    background-color: #ddd;
}
#container .content .content-games .inner-container ul li span:hover{
    background-color:#006399;
    color:white;
}
#container .content .content-games .inner-container .information h2 {
	padding-bottom:10px;
	padding-left: 20px;
}
#container .content .content-games .inner-container .information p {
	padding: 0px 10px 0px 10px;
	margin:0;
}
#container .content .content-games .info {
	background-color:#e3e3e1;
}
#container .footer {
    padding:10px;
    background-color:#c1c1c1;
    min-height:50px;
    color:#222223;
}
#container .footer a{
    padding:10px;
    background-color:#c1c1c1;
    min-height:50px;
    color: black;
}

.ui-widget-overlay {
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    background: #000!important;
    opacity: 0.8;
    display: none;
    z-index: 99;
}
/*----- Paging  ----- */
.paging {padding:15px;}
.paginate {margin:0; padding:0;}
.paginate li {display: inline; font-weight: bold; height: 30px; list-style: outside none none; width: 20px;}
.paginate  .title { margin-right: 4px;}
.paginate  .current {background-color: red;border-radius: 50%;color: white; margin-right: 4px;padding: 4px 8px;}
.paginate  a {;margin-right: 4px;padding: 4px 8px;text-align: center;text-decoration: none;}
/*----- Ads  ----- */
#ads-loading { background: #333 none repeat scroll 0 0; bottom: 0;height: 600px;text-align: center;top: 0; width: 100%;z-index: 99;}
#ads-status-loading { color: #999;padding-top: 30px;}
#ads-status-loading span {color: red;}
#ads-loading #ads-pre-loading {background: #fff none repeat scroll 0 0; height: 2px; left: 0; margin-left: 10%; margin-top: 30px; width: 80%;}
#ads-loading #ads-line-loading { background: #ccc none repeat scroll 0 0; border-radius: 40px; box-shadow: 0 0 10px 2px #0ff; height: 1px; margin: 0 auto;
  width: 0; z-index: 50;}
#ads-content {height: 480px; margin: 10px auto;padding-top: 20px;position: relative;width: 336px;z-index: 100;}
.ui-widget-overlay {
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    background: #000!important;
    opacity: 0.8;
    display: none;
    z-index: 99;
}
/*----- PC -----*/
@media only screen and (min-width: 1365px) and (max-width: 5000px) {
    #container {
	/*width:1365px;*/
	max-width:1020px;
    }
}
/*----- Mobile -----*/
@media only screen and (max-width: 604px) {
    #container .header {
        height: 85px;
        text-align:center;
    }
     #container .header .head-title {
         padding-top:0;
         width:100%;
         text-align:center;
         height:30px;
         
     }
     #container .header .head-title h1 {
         font-size: 15px;
         margin:0;
     }
}
@media only screen and (max-width: 990px) {
    #container .header {
        overflow:hidden;
    }
    #container .content .content-box .content-game {
        width:100%;
        margin-left:0;
    }
    #container .content .content-box .content-game .top-left {
        width:100%;
    }
    #container .content .content-box .content-game .top-left ul li {
        margin-right:10px;
    }
    #container .content .content-box .content-game .top-right {
        width:100%;
    }
    #container .content .content-box .content-game .top-right ul li {
        margin-right:10px;
    }
    #container .content .content-box .content-game .game-show {
        width:100%;
        padding-left:0;
    }
    #container .content .content-box .ads-left {
        width:100%;
        padding:10px;
        height:auto;
    }
    #container .content .content-box .ads-right {
        width:100%;
        padding:10px;
        height:auto;
        margin-left:0;
    }
}




.img-ratio {
  aspect-ratio: 16/9;
}

/*menu*/

 
  

 *,
:after,
:before {
  box-sizing: border-box
}

.clearfix:after,
.clearfix:before {
  content: '';
  display: table
}

.clearfix:after {
  clear: both;
  display: block
}
ul{
	list-style:none;
	margin: 0;
	padding: 0;
}
a, a:hover, a.active, a:active, a:visited, a:focus{
	/*color:#fefefe;*/
	text-decoration:none;
}




/*mega menu*/

.mega-menu {
  left: 0px;
  right: 0px;
  padding: 15px;
  display:none;
  padding-top: 0;
  min-height: 100%;
  flex-wrap: wrap;
  justify-content: space-between;

}
h4.row.mega-title {
  color: #eee;
  margin-top: 0px;
  font-size: 14px;
  padding-left: 15px;
  padding-bottom: 13px;
  text-transform: uppercase;
  border-bottom: 1px solid #547787;
  padding-top: 15px;
  background-color: #365670
  }
 .mega-menu ul li a {
  line-height: 25px;
  font-size: 90%;
  display: block;
}
ul.stander li a {
    padding: 3px 0px;
}

ul.description li {
    padding-bottom: 12px;
    line-height: 8px;
}

ul.description li span {
    color: #ccc;
    font-size: 85%;
}
a.view-more{
  border-radius: 1px;
  margin-top:15px;
  background-color: #009FE1;
  padding: 2px 10px !important;
  line-height: 21px !important;
  display: inline-block !important;
}
a.view-more:hover{
	color:#fff;
	background:#0DADEF;
}
ul.icon-des li a i {
    color: #fff;
    width: 35px;
    height: 35px;
    border-radius: 50%;
    text-align: center;
    background-color: #009FE1;
    line-height: 35px !important;
}

ul.icon-des li {
    width: 100%;
    display: table;
    margin-bottom: 11px;
}

/*common*/
.flyout-right ul>li>a ,
.flyout-left ul>li>a,
.flyout-mega-wrap,
.mega-menu{
	background-color: #547787;
}

/*hover*/
.Blog:hover,
.Images:hover,
.mega-menu:hover,
.drop-down-ul:hover,
.flyout-mega-wrap:hover,
li.drop-down>a:hover +.drop-down-ul,
.images-drop-down>a:hover +.Images,
.mega-drop-down a:hover+.mega-menu,
li.flyout-mega>a:hover +.flyout-mega-wrap{
	display:contents;
}
/*responsive*/
 @media (min-width:767px){
	.exo-menu > li > a{
	display:block;
	padding: 12px 12px;
 }
.mega-menu, .flyout-mega-wrap, .Images, .Blog,.flyout-right>ul,
.flyout-left>ul, li.drop-down>ul{
		position:absolute;
}
 .flyout-right>ul{
	left: 100%;
	}
	.flyout-left>ul{
	right: 100%;
}
 }
@media (max-width:767px){

	.exo-menu {
		min-height: 58px;
		background-color: #23364B;
		width: 100%;
	}
	
	.exo-menu > li > a{
		width:100% ;
	    display:none ;
	
	}
	.exo-menu > li{
		width:100%;
	}
	.display.exo-menu > li > a{
	  display:block ;
	  	padding: 20px 22px;
	}
	
.mega-menu, .Images, .Blog,.flyout-right>ul,
.flyout-left>ul, li.drop-down>ul{
		position:relative;
}

}


#menu ul {
  background: #1F568B;
  list-style-type: none;
  text-align: center;
}
#menu li {
  color: #f1f1f1;
  font-weight: 700;
  display: inline-block;
  width: 100px;
  height: 40px;
  line-height: 40px;
  margin-left: -5px;
}
#menu a {
  text-decoration: none;
  color: #fff;
  display: block;
}
#menu a:hover {
  background: #F1F1F1;
  color: #333;
}
