@import "reset.css";

body {
font-family: Georgia,Cambria,"Times New Roman",Times,serif;
font-size:120%;
}
html {
overflow-y:scroll;
}

a, a:link, a:visited {
text-decoration:none;
color:#d45500;
}

a:hover {
color:#ff6600;
}



#container {
width:960px;
margin:0 auto;
position:relative;
padding-bottom:50px;
margin-top:106px;

}

#wrap {
padding:0 100px;
}

#top {
position:absolute;
top:0;
left:0;
width:100%;
height:98px;
background: url('img/topbg.png') 0% 0% repeat-x;
}

#top-wrap {
width:960px;

margin:0 auto;
position:relative;

}

#games {
position:absolute;
top:0;
right:0;
}


#games a {
float:left;
width:64px;
height:64px;
display:block;
border-radius: 32px;
text-align:center;
margin-right:10px;

opacity: 0.7;
filter: alpha(opacity=70);
}

#games a:hover, #games a.active {
opacity: 1;
filter: alpha(opacity=100);
}

#games a img {
width:100%;
height:100%;
}

#top #logo {
background:url('img/logo.png') 0% 0% no-repeat;
width:155px;
height:74px;
width:204px;
height:64px;
display:block;
margin-top:10px;
}

#front #logo {
margin:10px auto;

}

#top #logo a {
width:204px;
height:64px;
width:155px;
height:74px;
width:204px;
height:64px;
display:block;
text-indent:-9999px;
overflow:hidden;
}

* html  .game-item {display:inline}/* for ie*/
html>body .game-list {display:table}/*for mozilla */
html>body .game-item{display:table;float:left}/*for mozilla */
@media all and (min-width: 0px) {
/* opera 7 styles */
html > body .game-item {
    display: inline-block;
    float: none;
}
}

.game-list {
    width: 100%;
    text-align: center;
}

.game-list .game-item .wrap {
    padding: 10px;
}

.game-list .game-item .title {
    font-family: "Montserrat", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    font-weight: bold;
    text-transform: uppercase;
}

.game-list .game-item {
    width: 33.33%;
    width: 25%;
    text-align: center;
    vertical-align: top;
}

.game-list .game-item img {
    width: 100%;
    max-width: 200px;
}

.game-header h1 {
    line-height: 80%;
    font-size: 40px;
    padding-top: 5px;
}

.game-header .tagline {
    font-family: "Montserrat", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    margin-left: 2px;

}

.game-header img.icon {
    height: 70px;
    float: left;
    margin-right: 10px;

}

.game-header {
    position: relative;
    margin-top: 20px;
    height: 80px;
}

.game-header .title {
    float: left;
}

.content-block {
    margin-bottom: 15px;
}

.screenshots {
    padding: 0px;
    margin-left: -100px;
    margin-right: -100px;

    font-weight: bold;
}

.video-wrap {
}

.video {
}

.screenshot {
    display: inline-block;
    position: relative;
    vertical-align: top;
}

.screens-2 .screenshot {
    width: 50%;
}

.screens-3 .screenshot,
.screens-5 .screenshot {
    width: 33.33%;
}

.screens-4 .screenshot {
    width: 25%;
}

.screenshot .wrap {
    padding: 3px;

}

.screen-info-wrap {
    display: table;
    width: 100%;
    margin: 0 auto;
}

.game-list .title-wrap {
    display: table;
    width: 100%;
}

.game-list .title {

    height: 64px;
    display: table-cell;
    vertical-align: middle;
    text-align: center;
}

.screen-info {
    background: #9E9E9E;
    color: #fff;
    font-family: "Montserrat", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    font-size: 14px;
    font-weight: normal;
    padding: 8px;
    border-radius: 5px;
    position: relative;
    line-height: 130%;
    height: 36px;
    display: table-cell;
    vertical-align: middle;
}

.screen-info .triangle {
    position: absolute;
    top: -16px;
    left: 5px;
    width: 24px;
    background: #444;
    height: 24px;
    display: block;
    background: url('img/triangle2.png') 0% 0% no-repeat;
}

.download-sites {
    width: 100%;
    position: relative;
}

ul.downloads {
    position: absolute;
    top: 15px;
    right: 10px;
    height: 40px;
    float: left;
}

.download-sites {
    text-align: center;
    padding: 20px 0px;
}

.contacts {
    text-align: center;
}

ul.social {
    display: inline-block;
}

ul.social li {
    float: left;
    margin: 5px;
}

ul.social li img {
    opacity: 0.7;
    filter: alpha(opacity=70);
}

ul.social li:hover img {
    opacity: 1.0;
    filter: alpha(opacity=100);
}

.download-sites ul.downloads {
    top: 0;
    left: 0;
    margin: 0;
    float: none;
    position: relative;
    display: inline-block;
    height: 50px;
}

.download-sites ul.downloads a {
    height: 50px;
    width: 50px;
}

ul.downloads li {
    float: left;
}

ul.downloads img {
    height: 100%;
}

ul.downloads a img {
    opacity: 0.7;
    filter: alpha(opacity=70);
}

ul.downloads a:hover img {
    opacity: 1.0;
    filter: alpha(opacity=100);
}

ul.downloads a {
    height: 40px;
    width: 40px;
    display: block;
}

h1, h2 {
    font-family: "Montserrat", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    font-size: 24px;
}

p, h2, li {
    line-height: 150%;
}

h2.block-title {
    text-align: center;
    text-transform: uppercase;
}

.intro {
    padding: 20px 20px;

    font-family: "Montserrat", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    text-transform: uppercase;
    font-weight: bold;

    font-size: 18px;

    text-align: center;
    border-radius: 10px;
    /*
    background:#c5e9f1;
    */
    color: #536c67;
}

.description p {
    margin-bottom: 10px;
}

.features, .details {
    float: left;
}

.features {
    width: 68%;
}

.details {
    width: 30%;
    font-size: 14px;
    background: #f7f7f7;
}

.features ul {
    list-style-position: outside;
    list-style-image: url('img/snout.png');
    padding-left: 24px;
}

.features ul li {

    line-height: 130%;
    margin-top: 5px;
    margin-bottom: 10px;
}

.details li.label {
    font-weight: bold;
    font-family: "Montserrat", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    color: #444;
}

.details ul li {
    padding: 2px 5px;
}

.details ul li.value {
    border-bottom: 3px solid white;
}