html, body {
  width: 100%;
  height: 100%;
  overflow: hidden;
}

body {
background-image: url(copy.png) , url(kavir.gif);
background-color: #172638;
background-position: bottom center, left top;
background-repeat: no-repeat, no-repeat;
background-size: auto, 100% auto;
-webkit-font-smoothing: antialiased;
}

#login {
z-index:999999;
width:100%;
height:100%;
}

#login_error, .login .message{
    margin: 0 auto 20px;
    padding: 12px;
    width: 295px;
	border-radius: 3px;
	font-size:11px
}

.pg-canvas{
height:300px;position:absolute;top:0px;z-index:9
}

@media only screen and (max-width: 1366px) {

body {background-size: auto}
}

@media only screen and (max-width: 959px) {
.pg-canvas{height:200px;width:500px}
}

@media only screen and (max-width: 767px) {
.pg-canvas{height:200px;width:300px}
}

@media only screen and (max-width: 479px) {
body {
background-image: url(kavir.gif);
background-color: #172638;
background-position: left top;
background-repeat: no-repeat;
background-size: auto;
-webkit-font-smoothing: antialiased;
}
.pg-canvas{height:200px;width:200px}
}