* { max-height: 10000px; }
html,body { height:100%; }
body {
background:#bec6fe url(../images/bg-body.jpg);
margin:0;
color:#6e707c;
font:17px/18px 'PT Sans Narrow', Arial, Helvetica, sans-serif;
-webkit-text-size-adjust:100%;
-ms-text-size-adjust: none;
min-width:320px;
}
h2 {
font-style: italic;
font-size: 30px;
color: #E08F41;
}
header, footer, article, section, nav, figure, aside { display: block; }
figure { margin:0; padding:0; }
img {border-style:none;}
a {
text-decoration:underline;
color:#e08f41;
outline:none;
}
a:hover {text-decoration:none;}
a:active {background-color: transparent;}
input,
textarea,
select {
font:100% Arial, Helvetica, sans-serif;
vertical-align:middle;
color:#000;
outline:none;
}
form, fieldset {
margin:0;
padding:0;
border-style:none;
}
input[type=text], input[type=password],input[type=email],input[type=tel], input[type=file], input[type=submit],input[type=search], textarea {
-webkit-appearance:none;
border-radius:0;
}
#wrapper{
width:100%;
height:100%;
display:table;
}
.w1 {
width:100%;
display:table-row;
}
.w2 {
width:100%;
position:relative;
overflow:hidden;
}
#header {
position:fixed;
top:0;
right:0;
z-index:50;
left:0;
background:#e08f41;
overflow:hidden;
}
.logo {
float:left;
background:url(../images/logo.jpg) no-repeat;
width:204px;
height:50px;
text-indent:-9999px;
overflow:hidden;
}
.logo a {
display:block;
height:100%;
}
/*#nav {float:right;}
#nav ul {
padding:0;
margin:0;
list-style:none;
float:left;
font-size:25px;
line-height:50px;
}
#nav ul li {float:left;}
#nav ul a {
color:#fff;
text-decoration:none;
display:block;
padding:16px 32px 17px;
}
.desktop #nav ul a:hover {background:#6e707c;}
#nav ul .active a {background:#e08f41;}
#nav ul .text-games {
display:block;
overflow:hidden;
text-indent:-9999px;
background: url('../images/text-sprite.png') no-repeat -539px -242px;
width: 62px;
height: 17px;
}
#nav ul .text-about {
display:block;
overflow:hidden;
text-indent:-9999px;
background: url('../images/text-sprite.png') no-repeat -299px -242px;
width: 67px;
height: 17px;
}
#nav ul .text-contact {
display:block;
overflow:hidden;
text-indent:-9999px;
background: url('../images/text-sprite.png') no-repeat -17px -242px;
width: 95px;
height: 17px;
}*/
#main {
margin:150px auto 0;
width:969px;
position:relative;
background: url('../images/bg-main.png') no-repeat 3px -124px;
z-index:1;
min-height:250px;
}
#main:after,
#main:before{
content:'';
position:absolute;
height:35px;
left:0;
bottom:0;
width:100%;
background: url('../images/bg-main.png') no-repeat -1961px -124px;
z-index:-1;
}
#main:after{
top:36px;
height:auto;
bottom:35px;
background: url('../images/bg-main.png') repeat-y -977px 0;
}
#main p {margin:0 0 18px;}
.mobileTopBanner {
position:absolute;
top:-75px;
left:50%;
margin-left: -234px;
}
.boxAd
{
max-width:320px;
height:auto;
float:none;
margin:0 auto;
}
.desktopAdTopBanner {
position:absolute;
top:-95px;
left:50%;
margin-left: -360px;
}
.desktopAdTopLeftSky {
position:absolute;
top:-92px;
left:50%;
margin-left: -610px;
}
.desktopAdTopRightSky {
position:absolute;
top:-92px;
left:50%;
margin-left: 485px;
}
.content {
padding:0px 45px 0px;
position:relative;
z-index:2;
}
.content:after,
.content:before {
}
.content:before {
left:auto;
right:-44px;
background-position: -304px -2px;
}
/*.text-happylander {
overflow:hidden;
text-indent:-9999px;
margin:0 auto 20px;
background: url('../images/text-sprite.png') no-repeat -27px -12px;
width: 645px;
height: 131px;
}
.text-webgames {
overflow:hidden;
text-indent:-9999px;
margin:0 auto 21px;
background: url('../images/text-sprite.png') no-repeat -17px -184px;
width: 506px;
height: 21px;
}*/
.games-list {
padding:0px;
margin:45px -15px 0 0;
list-style:none;
}
.games-list li {
display:inline-block;
vertical-align:top;
margin-right:-.3em;
width:33.2%;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding:0 10px 26px 0;
position:relative;
word-wrap: break-word;
}
#main .games-list p {margin:0 0 5px;}
.games-list .img-holder {
position:relative;
margin-bottom:7px;
display:inline-block;
vertical-align:top;
}
.games-list .img-holder img {
display:block;
width:100%;
height:auto;
}
.games-list .img-holder:hover .hover-block {display:block;}
.games-list .hover-block {
position:absolute;
left:0;
right:0;
top:0;
bottom:0;
background:rgba(0, 0, 0, 0.5);
z-index:5;
display:none;
}
.games-list .play {
position:absolute;
bottom:0;
left:0;
right:0;
text-align:center;
background:#e08f41;
text-decoration:none;
text-transform:uppercase;
color:#fff;
padding:18px 10px 13px;
font-size:25px;
line-height:29px;
font-weight:normal;
}
.text-play {
display:block;
overflow:hidden;
text-indent:-9999px;
background: url('../images/text-sprite.png') no-repeat -436px -243px;
width: 44px;
height: 19px;
margin:0 auto;
}
.container {
position:relative;
padding:45px 0 4px;
}
.container:after {
position:absolute;
content:'';
bottom:45;
left:-25px;
background:url(../images/divider.jpg) no-repeat;
background-size: 100% 100%;
right:-23px;
height:44px;
z-index:1;
}
.container * {
position:relative;
z-index:2;
}
.container img {
max-width:100%;
margin-bottom:10px;
display:block;
height:auto;
}
.container h2 {
margin-bottom: 13px;
margin-top: 0px;
text-align: center
}
.container h3 {
margin-bottom: 10px;
margin-top: 0px
}
.container p {
margin:0;
}
.prevPlay
{
max-width:480px;
height:auto;
float:none;
margin:0 auto;
}
/*#main .games-list p {margin:0 0 5px;}
.games-list .img-holder {
position:relative;
margin-bottom:7px;
display:inline-block;
vertical-align:top;
}*/
.container h2:after {
/*position:absolute;
content:'';
top:-9px;
left:0;
background: url('../images/sprite.png') no-repeat -11px -198px;
width: 57px;
height: 68px;*/
}
.text-about {
/*display:block;
overflow:hidden;
text-indent:-9999px;
background: url('../images/text-sprite.png') no-repeat -11px -312px;
width: 119px;
height: 46px;*/
}
.text-contact {
display:block;
overflow:hidden;
text-indent:-9999px;
background: url('../images/text-sprite.png') no-repeat -186px -312px;
width: 147px;
height: 42px;
}
.logos-list {
padding:0;
margin:0;
list-style:none;
}
.logos-list li {
padding:0 5px;
display:inline-block;
margin:0 -.3em 10px 0;
vertical-align:middle;
}
.logos-list img {
vertical-align:top;
max-width:100%;
display:block;
height:auto;
}
/*.contact-form {
position:relative;
max-width:551px;
padding:5px 0 0;
margin-left:-2px;
}
.contact-form .row {padding-bottom:7px;}
.contact-form input[type="text"],
.contact-form input[type="email"] {
display:block;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
width:350px;
height:38px;
color:#fff;
font:17px/38px 'PT Sans Narrow';
padding:1px 16px 2px;
border:1px solid #b7c0fe;
-webkit-box-shadow: none;
box-shadow: none;
background:#b7c0fe;
}
.contact-form textarea {
display:block;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
width:550px;
max-width:550px;
min-width:550px;
height:212px;
min-height:212px;
color:#fff;
font:17px/21px 'PT Sans Narrow';
padding:7px 5px 5px 16px;
border:1px solid #b7c0fe;
background:#b7c0fe;
overflow:auto;
}
.contact-form .error textarea,
.contact-form .error input[type="text"],
.contact-form .error input[type="email"] { border-color:#f00; }
.contact-form input[type="submit"] {
display:block;
overflow:hidden;
text-indent:-9999px;
padding:0;
border:none;
margin:0 0 0 auto;
background: url('../images/text-sprite.png') no-repeat -373px -312px;
width: 150px;
height: 50px;
cursor:pointer;
}*/
.desktop .contact-form input[type="submit"]:hover {background-position: -539px -312px;}
#footer {
width:100%;
display:table-footer-group;
overflow:hidden;
}
.footer-holder {
height:1%;
display:table-row;
}
.footer-block {
max-width:969px;
margin:0 auto;
text-align:center;
font-weight:bold;
padding:41px 0 10px;
}
.footer-block p {margin:0;}
.footer-logo {
float:none;
background:url(../images/footer-logo.png) no-repeat;
width:95px;
height:95px;
display:block;
margin:0 auto -5px;
}
.top {
position:fixed;
right:0;
bottom:0;
overflow:hidden;
text-indent:-9999px;
background: url('../images/sprite.png') no-repeat;
width: 50px;
height: 50px;
z-index:20;
}
.desktop .top:hover {background-position: 0 -75px;}
/*@media (max-width: 1070px) {
.content:before {right:-27px;}
.content:after {left:-27px;}
}*/
@media (max-width: 1300px) { /*1023px)*/
#nav ul a {padding:16px 23px 17px;}
#main {
margin-top:150px;
width:727px;
min-height:200px;
background: url('../images/bg-main02.png') no-repeat -9px -98px;
}
#main:after,
#main:before{
height:25px;
background: url('../images/bg-main02.png') no-repeat -1473px -98px;
}
#main:after{
top:25px;
height:auto;
bottom:25px;
background: url('../images/bg-main02.png') repeat-y -741px 0;
}
.desktopAdTopLeftSky {
position:absolute;
top:10px;
left:50%;
margin-left: -490px;
}
.desktopAdTopRightSky {
position:absolute;
top:10px;
left:50%;
margin-left: 365px;
}
.games-list {margin-right:-12px;}
.games-list .img-holder {margin-bottom:10px;}
.games-list li {padding-bottom:16px;}
.logos-list li {
padding:0;
width:12.5%;
}
.logos-list img {max-width:89%;}
.content {padding:0px 34px 43px;}
.content:after,
.content:before {
background-position: -98px -232px;
width: 137px;
height: 137px;
top:8px;
left:-20px;
}
.content:before {
left:auto;
right:-19px;
background-position: -279px -232px;
}
.text-happylander {
background-position: -27px -403px;
width: 484px;
height: 98px;
margin-bottom:14px;
}
.text-webgames {
background-position: -31px -538px;
height:17px;
width:405px;
margin-bottom:15px;
}
.text-about {
/*background-position: -568px -429px;
width: 89px;
height: 35px;*/
}
.text-contact {
background-position: -535px -521px;
width: 110px;
height: 31px;
}
.container {padding:30px 0 4px;}
.container:after {
left:-19px;
right:-18px;
height:33px;
}
.contact-form {
padding:0;
margin:-1px 0 0;
}
.contact-form input[type="submit"] {margin-top:-2px;}
.footer-block {padding:10px 0 25px;}
.footer-logo {margin-bottom:-4px;}
.top {
background-position: 0 -296px;
height:44px;
}
.desktop .top:hover {background-position: 0 -373px;}
}
@media (max-width: 1000px) { /*767px*/
/*#header .logo {display:none;}
#nav {float:none;}*/
#nav ul a {padding:16px 17px 17px;}
/*#nav ul {
float:none;
text-align:center;
}
#nav ul li {
float:none;
display:inline-block;
vertical-align:top;
margin-right:-.3em;
}*/
#main {
margin-top:150px;
width:453px;
background: url('../images/bg-main03.png') no-repeat 0px -55px;
}
#main:after,
#main:before{
height:25px;
background: url('../images/bg-main03.png') no-repeat -927px -55px;
}
#main:after{
top:28px;
height:auto;
bottom:25px;
background: url('../images/bg-main03.png') repeat-y -470px 0;
}
.desktopAdTopLeftSky {
position:absolute;
top:10px;
left:50%;
margin-left: -350px;
}
.desktopAdTopRightSky {
position:absolute;
top:10px;
left:50%;
margin-left: 225px;
}
.contact-form textarea {
width:418px;
max-width:418px;
min-width:418px;
}
.container {padding:25px 0 4px;}
.container:after {
height:20px;
right:-5px;
left:-8px;
}
.games-list {margin-right:-10px;}
.games-list li { width:50%;}
.games-list .img-holder {margin-bottom:6px;}
.content {padding:0px 15px 15px 17px;}
.content:after,
.content:before {
background-position: -98px -395px;
width: 86px;
height: 86px;
top:3px;
left:-13px;
}
.content:before {
left:auto;
right:-12px;
background-position: -221px -395px;
}
.text-happylander {
background-position: -17px -594px;
width: 302px;
height: 62px;
margin-bottom:6px;
}
.text-webgames {
background-position: -363px -584px;
height:13px;
width:304px;
margin-bottom:11px;
}
.text-about {
/*background-position: -372px -628px;
width: 55px;
height: 22px;*/
}
.text-contact {
background-position: -463px -628px;
width: 69px;
height: 20px;
}
.top {
background-position: 0 0;
height:50px;
}
.desktop .top:hover {background-position: 0 -75px;}
.contact-form {max-width:418px;}
.footer-block {padding-top:12px;}
}
@media (max-width: 650px) {
#nav ul a {padding:16px 17px 17px;}
#main {
margin-top:150px;
width:301px;
background: url('../images/bg-main04.png') no-repeat -3px -30px;
}
#main:after,
#main:before{
height:25px;
background: url('../images/bg-main04.png') no-repeat -619px -30px;
}
#main:after{
top:25px;
height:auto;
bottom:25px;
background: url('../images/bg-main04.png') repeat-y -310px 0;
}
.desktopAdTopLeftSky {
position:absolute;
top:10px;
left:50%;
margin-left: -270px;
}
.desktopAdTopRightSky {
position:absolute;
top:10px;
left:50%;
margin-left: 145px;
}
.contact-form textarea {
width:268px;
max-width:268px;
min-width:268px;
}
.contact-form input[type="text"],
.contact-form input[type="email"] {width:268px;}
.container {padding:25px 0 4px;}
.container:after {
height:14px;
right:-5px;
left:-8px;
}
.games-list {
margin-right:0;
padding-bottom:9px;
}
.games-list li {
width:100%;
padding:0 0 9px;
}
.games-list .img-holder {
margin:0 auto 8px;
display:block;
}
.logos-list li {width:25%;}
.content {padding:0px 14px 21px 13px;}
.content:after,
.content:before {
background-position: -369px -416px;
width: 57px;
height: 57px;
left:-9px;
top:2px;
}
.content:before {
left:auto;
right:-8px;
background-position: -458px -417px;
}
.text-happylander {
background-position: -29px -679px;
width: 201px;
height: 41px;
margin-bottom:5px;
}
.text-webgames {
background-position: -289px -689px;
height:14px;
width:125px;
margin-bottom:11px;
}
.contact-form {
max-width:268px;
margin-right:2px;
}
.footer-block {padding-top:10px;}
.footer-block p {margin:0 50px;}
}