/* ------------------------------------------
   Filename          : style.css
   Description       : adom.de stylesheet
   Author            : Krzysztof "Ravenmore" Dycha - http://dycha.net
   Website           : adom.de
   Created           : 2014.09.10

   == COLORS: ===============================

   Background        : #FFFFFF;  White
   Core Text         : #5f5f5f;  Dark Grey

   == TABLE OF CONTENTS: =====================
   $__general        : Style elements that apply to the whole site
   $__structure      : Basic structural building blocks
   $__downloads      : Downloads section of adom.de
*/

/*
   ==========================================
   $__general
   ==========================================
 */

html{
}

body{
    font-family              : 'Source Sans Pro', sans-serif;
    margin:0;
    padding:0;
}

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

a:hover{
    text-decoration:underline;
}

a img{
    border                   : none;
    outline                  : none;
}

h3{
    margin                   : 0px;
    margin-top               : 10px;
    color                    : #D34A4A;
}

td{
    text-align               : center;
}

p b{
color :#555;
}

div#preload { display: none; }

.downloadsVersionHeader{
        background              : url(img/h4BackgroundLarge.png);
    width                   : 432px;
    height                  : 93px;
    color                   : #9a9a9a;
    text-align              : center;
    margin                  : 0px;
    position                : relative;
    background-position     : top;
}

/*
   ==========================================
   $__structure
   ==========================================
 */

#header{
    width                   : 100%;
    background-color        : #FFF;
    height                  : 640px;
    z-index                 : 1;
    min-width               : 1000px;
    position                : relative;
}


#social{
    position                : fixed !important;
    right                   : 50px;
    bottom                  : 20px;
    background              : url(img/socialBG.png);
    width                   : 96px;
    height                  : 129px;
    z-index                 : 13;
    backface-visibility     : visible;
    -webkit-transform       : translateZ(0);
    background-repeat       : no-repeat;
    background-attachment   : local;

}

#footer{
      width               : 100%;
      background          : #999;
      min-height          : 40px;
      text-align          : center;
      color               : #fff;
      font-family         : Raleway;
      padding-top         : 20px;
      font-size           : 15px;
}

#imprintLink{
	color: #fff;
}

#buyOnSteam{
    width                   : 96px;
    height                  : 48px;
    background              : url(img/buyOnSteam.png);
    position                : absolute;
    transition              : background 0.2s ease;
    display                 : block;
}

#buyOnSteam:hover{
    background              : url(img/buyOnSteamHover.png);
}

#fbLink{
    width                   : 42px;
    height                  : 42px;
    background              : url(img/icon_fbOff.png);
    transition              : background 0.2s ease;
    position                : absolute;
    top                     : 48px;
    left                    : 4px;
}

#fbLink:hover{
    background              : url(img/icon_fbOver.png);
}

#googleLink{
    width                   : 42px;
    height                  : 42px;
    background              : url(img/icon_googleOff.png);
    transition              : background 0.2s ease;
    position                : absolute;
    top                     : 48px;
    left                    : 48px;
}

#googleLink:hover{
    background              : url(img/icon_googleOver.png);
}

#twitterLink{
    width                   : 42px;
    height                  : 42px;
    background              : url(img/icon_twitterOff.png);
    transition              : background 0.2s ease;
    position                : absolute;
    top                     : 86px;
    left                    : 4px;
}

#twitterLink:hover{
    background              : url(img/icon_twitterOver.png);
}


#headerImage{
    background-image        : url(img/background.jpg);
    background-repeat       : no-repeat;
    background-position     : center bottom;
    width                   : 1000px;
    height                  : 550px;
    margin                  : 0 auto;
}

#menu{
    width                   : 100%;
    border-top              : 1px solid #CCC;
    border-bottom           : 1px solid #CCC;
    height                  : 51px;
    background-color        : #FFF;
    z-index                 : 13;
    margin                  : 0 auto;
}

#menuButtons{
    width                   : 100%;
    margin                  : 0 auto;
    overflow:hidden;
}

#menuContainer{
    width                   : 1000px;
    margin                  : 0 auto;
}

#buyButton{
    width                   : 156px;
    height                  : 156px;
    position                : absolute;
        top: 480px;
    left: 432px;
    overflow: hidden;
}

.buyFlag{
    background              : url(img/buyNow.png);
     width                  : 156px;
    height                  : 156px;
    display                 : block;
    transition              : background 0.2s ease;
}

.buyFlag:hover{
    background              : url(img/buyNowOver.png);

}

#pressKit{
    width                   : 100px;
    height                  : 94px;
    position                : absolute;
    top                     : 60px;
    left                    : 900px;
    overflow: hidden;
    background              : url(img/pressKitOff.png);
}

.pressKit{
    background              : url(img/pressKitOff.png);
     width                  : 100px;
    height                  : 94px;
    display                 : block;
    transition              : background 0.2s ease;
}

.pressKit:hover{
    background              : url(img/pressKitOver.png);

}

#donorsButton{
    width                   : 100px;
    height                  : 94px;
    position                : absolute;
    top                     : 60px;
    left                    : 800px;
    overflow: hidden;
    background              : url(img/donorsOff.png);
}

.donorsButton{
    background              : url(img/donorsOff.png);
     width                  : 100px;
    height                  : 94px;
    display                 : block;
    transition              : background 0.2s ease;
}

.donorsButton:hover{
    background              : url(img/donorsOver.png);

}

#playButton{
    width                   : 95px;
    height                  : 95px;
    position                : absolute;
        top: 355px;
    left: 453px;
    opacity                 : 0.8;
    transition              : opacity ease 0.3s;
}

#playButton:hover{
    opacity                 : 1.0;
}

.menuButton{
    width                   : 190px;
    height                  : 50px;
    display                 : inline-block;
    font-weight             : 400;
    font-size               : 20px;
    text-align              : center;
    margin                  : 0px;
    padding                 : 0px;
}



.menuButton a{
    width                   : 190px;
    height                  : 51px;
    display                 : block;
    margin                  : 0px;
    background-image        : url(img/buttonWhite.png);
    transition              : background-image 0.2s ease;

}


#menuContainer:first-child{
    margin:0 auto;
}

.menuButton a:hover{
    background-color        : #ff6b37;
    z-index                 : -1 !important;
    background-image        : url(img/buttonHighlight.png);
    color                   : #fff;
}

.menuButton span{
    display                 : inline-block;
    vertical-align          : middle;
    margin-top              : 10px;
}

#quoteContainer{
    width                   : 1000px;
    min-height              : 412px;
    margin                  : 0 auto;
    position                : relative;
}

#playerQuotes{
    margin-top              : 180px;
    float                   : right;
}

#gameSummary{
    position                : absolute;
    top:200px;
}

.playerQuote{
    max-width               : 220px;
    text-align              : center;
    font-size               : 12px;
    font-style              : italic;
    margin                  : 0px;
}

.playerSignature{
    font-weight             : 700;
    text-align              : right;
    font-size               : 15px;
    margin                  : 0px;
}

.quoteMark{
    font-family             : serif;
    font-weight             : 700;
    font-style              : italic;
    font-size               : 30px;
    margin                  : 0px;
    display                 : inline-block;
    float                   : top left;
    height                  : 10px;
}

#parallax01{
    position                : fixed;
    top                     : 0px;
    right                   : 0;
    bottom                  : 0;
    left                    : 0;
    background              : url(img/parallax01.png);
    z-index                 : -13;
    height                  : 1800px;
    background-repeat       : repeat;
    width                   : 100%;
    min-width               : 1000px;
}


.parallaxBreak{
    width                   : 100%;
    height                  : 500px;
    z-index                 : 12;
    background              : url(img/reflection.png);
    background-position     : center;
    background-repeat       : repeat-x;
    text-align              : center;
    min-width               : 1000px;
}

.contentList{
    width                   : 100%;
    min-height              : 300px;
    background-color        : #fff;
    padding-top             : 3px;
    min-width               : 1000px;
}

.ADOMIcon{
    width                   : 145px;
    height                  : 145px;
    background              : url(img/ADOMIcon.png);
    margin                  : 0 auto;
    margin-top              : -30px;
    z-index                 : 13;

}


.chapterHeader{
    width                   : 100%;
    height                  : 70px;
    background              : url(img/headerPattern.png);
    background-repeat       : no-repeat;
    background-position     : center;
    margin-bottom           : 3px;
    border-bottom           : 1px solid #ccc;
    border-top              : 1px solid #ccc;
    text-align              : center;
    font-size               : 30px;
    margin                  : 0px;
    clear                   : both;
}

.chapterContent{
    width                   : 1000px;
    margin                  : 0 auto;
    min-height              : 300px;
    text-align              :center;
}

.chapterColumn{
    display                 : inline-block;
    vertical-align          : top;
    font-weight             : lighter;
    max-width               : 310px;
    margin                  : 10px;
    text-align:center;
}

.faqColumn{
    display                 : inline-block;
    vertical-align          : top;
    font-weight             : lighter;
    max-width               : 910px;
    margin                  : 10px;
    text-align:center;
}

.chapterColumn2{
    display                 : inline-block;
    vertical-align          : top;
    font-weight             : lighter;
    max-width               : 460px;
    margin                  : 10px;
    text-align              : justify;
    text-justify            : newspaper;

}

.ADOMIcon{
    width                   : 145px;
    height                  : 145px;
    margin-top              : -90px;
}

.listHeader{
    text-align              : center;
    color                   : #9a9a9a;
    font-weight             : 400;
    font-size               : 24px;
    margin-bottom           : 25px;
    line-height             : 93px;
    min-width               : 160px;
    background              : url(img/h4BackgroundSmall.png);
    background-position     : center;
    background-repeat       : no-repeat;
    display                 : block;
    vertical-align          : middle;
}

li{
    margin-top              : 15px;
    font-size               : 15px;
    font-family             : Raleway;
    color                   : ##5f5f5f;
    text-align              : left;
}

li strong{
    color                   : #366;
    font-weight             : 600;
}

.paragraphEnd{
    width                   : 220px;
    height                  : 26px;
    background              : url(img/endUp.png);
    background-position     : center;
    background-repeat       : no-repeat;
}

.paragraphEndBottom{
    width                   : 220px;
    height                  : 26px;
    background              : url(img/endDown.png);
    background-position     : center;
    background-repeat       : no-repeat;
}

div.pressKitTemp{
    text-align              : center; !important
}

.featurePair{
    text-align              : left;
    width                   : 1000px;
    margin                  : 0 auto;
    padding-top             : 50px;
    background              : url(img/bgSplash2.png);
    background-repeat       : no-repeat;
    background-position     : top;
    padding-bottom          : 50px;
    min-height: 300px;
}

.featurePair.top{
    background              : url(img/bgSplash1.png);
    background-repeat       : no-repeat;
    background-position     : top;
}


.featurePromo{
    display                 : inline-block;
    text-align              : center;
    width                   : 490px;
    vertical-align          : top;
}

.introImages{
  text-align                : center;
  width                     : auto;
}

.introImages img{
  margin-left               : 10px;
  margin-right              : 10px;
}

p.introText{
  font-weight             : 300;
  text-align              : justify;
  text-justify            : newspaper;
  font-size               : 15px;
  width                   : auto;
  margin                  : 0 auto;
  line-height             : 24px;
  color                   : ##5f5f5f;
  margin-bottom           : 20px;
  margin-top              : 30px;
  font-family             : Raleway;
 }

.featurePromo p{
    font-weight             : 300;
    text-align              : justify;
    text-justify            : newspaper;
    font-size               : 15px;
    width                   : 420px;
    margin                  : 0 auto;
    line-height             : 24px;
    color                   : ##5f5f5f;
    margin-bottom           : 20px;
    font-family             : Raleway;
}

.featureImage{
    padding                 : 5px;
    border                  : 1px solid #ccc;
    border-radius           : 5px;
}

div.featureHeader{
    background              : url(img/h4BackgroundLarge.png);
    width                   : 432px;
    height                  : 93px;
    line-height             : 85px;
    color                   : #9a9a9a;
    text-align              : center;
    margin                  : 10px;
    margin-left             : 25px;
    position                : relative;
    background-position     : top;
}

.featureHeader h4{
    display                 : inline;
    vertical-align          : middle;
    background              : none;
    font-weight             : 400;
    font-size               : 24px;
}

.promoIcon{
    position                : absolute;
    top                     : 16px;
    left                    : 10px;
}

.featurePair.last{
    padding-bottom          : 40px;
}

.communitySiteContainer{
    text-align              : left;
}

.communitySiteContainer h4{
    font-weight             : 300;
    font-size               : 24px;
    color                   : #555;
    background              : url(img/h4BackgroundRepeat.png);
    background-position     : -60px -23px;
    width                   : 490px;
    height                  : 40px;
    padding-top             : 7px;
    vertical-align          : middle;
    position                : relative;
}

.communitySiteContainer p{
    font-size               : 15px;
    width                   : 490px;
    margin                  : 0 auto;
    line-height             : 24px;
    color                   : ##5f5f5f;
    margin-bottom           : 20px;
    font-family             : Raleway;
    text-align:justify;
    text-justify:newspaper;
}

.changelogContainer{
    text-align              : left;
}

.sitePic{
    display                 : inline-block;
    margin-top              : 30px;
    border                  : 1px solid #ccc;
    border-radius           : 5px;
    margin-right            : 28px;
    padding                 : 5px;
    float:left;
}

.siteDescription{
    display                 : inline-block;
    vertical-align          : top;
}

img.seal{
    position                : absolute;
    top                     : -22px;
    right                   : -40px;

}

h4.noseal{
    width                   : 520px;
}

h4.blogPost{
    background              : url(img/h4BackgroundTall.png);
    background-position     : top;
    padding-top             : 2px;
    width                   : 960px;
}

h4.blogPost, h4.blogPost a{


    width                   : 960px;
    height                  : 52px;
    text-align              : left;
    padding-top             : 0px;
    font-weight             : 400;
    color                   : #8b8b8b;
    font-size               : 24px;
    float                   :left
}

p.link a{
    color                   : #e01d28;
}

p.readMoreLink a{
    color                   : #e01d28;
}

p.readMoreLink{
    width                   : 100%;
    text-align              : right;
}

p.link a:hover{
    color                   : #f4472a;
}

.blogPost{
    text-align              : center;
    margin-bottom           : 60px;
}

.blogExcerpt p{
    width                   : 960px;
}

.date{
    position                : absolute;
    right                   : 0px;
    top                     : 3px;
    font-size               : 16px;
    margin-top              : -28px;
    font-weight             : 300;
}

.blogPostFooter{
    width                   : 100%;
    min-height              :100px;
    background-color        : #fbfbfb;
    padding                 : 5px;
    border-radius           : 5px;
    margin-left             : -5px;
    margin-bottom           : 20px;
    border                  : 1px solid #eee;

}

.blogPostFooter p, p.blogPostFooterNote{
     font-size              : 13px;
     margin-bottom          : 0px;
}

p.blogPostFooterNote img{
    float                   :left;
    margin-top              : 5px;
    margin-right            : 10px;
}

.blogPosts{
    padding-bottom          :120px;
}

.labelLinks{
    color                   : #c13d14;
}

/*
   ==========================================
   $__downloads
   ==========================================
 */

.downloadsPair{
    background              : none;
}

.downloadsContainer{
    width                   : 960px;
    text-align              : center;
    margin                  : 0 auto;
}
.downloadsContainer p{
    width                   : 100%;
}

.downloadsContainer h4{
    width                   : 100%;
    text-align              : center;
}

.downloads{
    width                   : 960px;
}

p.downloadNote{
    display                 : inline-block;
    vertical-align          : middle;
    line-height             : 40px;
    font-size               : 15px;
}

p.footnote{
    margin                  : 0px;
    font-size               : 13px;
}

table{
    width                   : 960px;
    margin                  : 0 auto;
    padding                 : 0 px;
    border                  : 0px;
    border-spacing          : 0px;
    font-weight             : 300;
    margin-top              : 30px;
}

tr{
    height                  : 32px;


}

th{
    font-weight             : 400;
}

td{
    vertical-align          : top;
    line-height             : 32px;
    position                : relative;
}

.downloadsTable td img{
    position                : absolute;
        left                : 10px;

}

.grey{
    background-color        : #eee;
}

div.table{
    margin-top              : 40px;
    text-align              : center;
    background-repeat       : no-repeat;
    background-position-x   : center;
    width                   : 960px;
    height                  : 70px;

}

.communitySiteContainer p a{
    color: #E64343;
}

.tilesIcon{
    position                : absolute;
    left                    : 310px;
    top                     : 10px;
}

.downloadSubInfo{
    font-size               : 16px;
    font-weight             :300;
    margin                  : 0 px;
    margin-top              : 10px;
    display                 :block;
}

.platform{
    text-align              :right;
}

p.downloadLink{
    width                   :100%;
    text-align              :center;
    font-size               : 16px;
    color                   : #e01d28;
    text-align              : center;
    font-size               : 15px;
    width                   : 420px;
}

.blogPic{
    display                 : block;
    border                  : 1px solid #ccc;
    border-radius           : 5px;
    margin-right            : 28px;
    padding                 : 5px;
    float                   : left;
}

.blogEntryIcon{
    position                : absolute;
    left                    : 190px;
    top                     : 10px;
}

.blogPost h4{
    width :960px;
}

.downloadsHeader{
    margin-top:20px;
}


/*
   ==========================================
   $__320px layout (320px-520px)
   ==========================================
 */



@media (max-width: 540px) {

    p.footnote{
        margin:auto;
    }
    p.downloadNote{
        margin-bottom:20px;
        line-height: 20px;
    }

    .tilesIcon{
        left: 0px;
    }
th.redundant,td.redundant{display:none}
    table{
        width: 300px;
    }
    #header {
        min-width            : 320px;
        padding-top          : 0px;
        height               : 350px;
    }
#menuContainer:first-child{
    margin:0 auto;
    padding-left:0px;
    table{width:auto}
}

    #headerImage{
        background-image    : url(img/background320.png);
        width               : 320px;
        height              : 356px;
    }

    #menu{
        min-width           : 320px;
        height              : auto;
    }

        div.featureHeader{
        margin              : 0px;
        padding             : 0px;
        width               : 320px;
    }

    .chapterColumn  {
        margin              : 0px;
        max-width           : 320px;
    }
    .featurePromo   {
        max-width           : 320px;
        width               : 320px;
    }
    .featurePromo p, .siteDescription p{
        width               : 270px;
        font-size           : 13px;
    }

.communitySiteContainer h4{
        width               : 320px;
        text-align          : center;
        line-height: 36px;
    margin-bottom: 20px;
}
    .featurePair, .featurePair.top    {
        width      : 320px;
        background: none;
    }

    .menuButton a   {
        width      : 320px;
        background : white;
    }

    .menuButton a:hover {
    background-image: url(img/buttonHighlight320.png);
    }



    #gameSummary    {display    : none;  }
    #playerQuotes   {display    : none;  }
    #quoteContainer {display    : none; }
    #buyButton      {left       : 130px;
                     top        : 503px;
    }
    #menuContainer  {width      : 320px; }
    .menuButton     {display    : block; }

    .parallaxBreak  {display    : none;  }
    #social         {display    : none;  }
    .chapterContent {width      : 320px; }
    .chapterHeader  {height     : auto;  }

    .contentList    {min-width  : 320px; }
    .sitePic        {display    : none;  }
    .siteDescription{width      : 320px; }
    .seal           {display    : none;  }
    #parallax01{    display     : none;  }
    .promoIcon      {display    : none;  }
    .featureImage   {max-width  : 280px; }
    li              {max-width  :270px   }
    ul              {-webkit-padding-start: 10px;    margin-left: 20px;}
    .communitySiteContainer{width:auto};
    table{width:auto};
    div.FAQ {width: 90px;}
    #playButton img{
            width: 66px;
            height: 66px
    }
    #playButton{
        left: 220px;
            top: 245px;
    }
 }

 #header {
        min-width            : 0px;!important
        padding-top          : 0px;
        padding-bottom       : 0px;

    }

/*
   ==========================================
   $__480px layout (540px-720px)
   ==========================================
 */

@media (min-width: 540px) and (max-width: 720px){
    #menuContainer:first-child{
    margin:0 auto;
    padding-left:60px; !important;
    }
    th.redundant,td.redundant{display:none}
    table{
        width: auto;!important;
    }
    #parallax01{
        background-position-x: -1500px; !important;
    }
    #header{
        height               : 480px;
    }
    .parallaxBreak{
        min-width             :480px;
    }

    #playButto
    #header {
        min-width            : 480px;
        padding-top          : 0px;
        padding-bottom       : 0px;
        height: 480px;
    }

    #headerImage{
        background-image    : url(img/background480.png);
        width               : 480px;
    }

    #menu{
        min-width           : 480px;
        height              : auto;
    }

    div.featureHeader{
        margin              : 0px;
        padding             : 0px;
        width               : 440px;
    }

    .chapterColumn  {
        margin              : 0px;
        max-width           : 480px;
    }
    .featurePromo   {
        max-width           : 480px;
        width               : 480px;
    }
    .featurePromo p, .siteDescription p{
        width               : 480px;
        font-size           : 15px;
    }

    .communitySiteContainer h4{
        width               : 480px;
        text-align          : center;
    }
    .menuButton     {
        display    : inline-block;
        width: 220px;
    }
    #menuButtons{
        text-align:center;
    }

    .featurePair, .featurePair.top    {
        width      : 480px;
        text-align :center;
        background:none;
    }

    #pressKit{
    width                   : 100px;
    height                  : 100px;
    position                : absolute;
    top                     : 160px;
    left                    : 390px;
    overflow: hidden;
    background              : url(img/pressKitOff.png);
    display:block;

}
    #headerImage{
        height:400px;
    }

    #header{
        height: 450px;
    }



    #playButton img{
        width: 66px;
        height: 66px;
    }
    #playButton{
        top:235px;
        left:225px;
    }
    #gameSummary    {display    : none;  }
    #playerQuotes   {display    : none;  }
    #quoteContainer {width      : 480px; }
    #buyButton      {    left: 192px;
    top: 339px;}
    #menuContainer  {width      : 200px; padding-top:30px }
    #social         {display    : none;  }
    .chapterContent {width      : 480px; }
    .chapterHeader  {height     : auto;  }
    .contentList    {min-width  : 480px; }
    .siteDescription{width      : 480px; }
    .seal           {display    : none;  }
    .promoIcon      {display    : none;  }
    .featureImage   {max-width  : 480px; }
    li              {max-width  : 440px   }
    .ADOMIcon       {display    : none;}
    ul              {-webkit-padding-start: 10px;}
    .communitySiteContainer{text-align:center;width:auto}
    .sitePic        {float:none;}
    table{width:auto};

    #pressKit{
    top: 160px;
    left: 420px;
    }

}





    /*
   ==========================================
   $__720px layout (720px-990px)
   ==========================================
 */

@media (min-width: 720px) and (max-width: 990px){
    #parallax01{
        background-position-x: -1500px; !important;
    }

    #playButton{
        left: 304px;top:292px;
    }

    .parallaxBreak{
        min-width             :680px;
    }

    table{width:auto};

    #menu{
        min-width           : 480px;
        height              : auto;
    }

    div.featureHeader{
        margin              : 0 auto;
        padding             : 0px;
        width               : 440px;
    }

    .chapterColumn  {
        margin              : 0px;
        max-width           : 680px;
    }
    .featurePromo   {
        max-width           : 680px;
        width               : 680px;
    }
    .featurePromo p, .siteDescription p{
        width               : 620px;
        font-size           : 13px;
    }

    .communitySiteContainer h4{
        width               : 680px;
        text-align          : center;
    }
    .menuButton     {
        display    : inline-block;
        width: 220px;
    }


    #menuButtons{
        text-align:center;
    }

    .featurePair, .featurePair.top    {
        width      : 680px;
        text-align :center;
        background:none;
    }

    #pressKit{
    width                   : 100px;
    height                  : 100px;
    position                : absolute;
    top                     : 10px;
    left                    : 580px;
    overflow: hidden;
    background              : url(img/pressKitOff.png);
    }
    #menu{height:auto}
    #gameSummary    {display    : none;  }
    #playerQuotes   {display    : none;  }
    #quoteContainer {width      : 680px; }
    #buyButton      {       left: 282px;
    top: 420px;}
    #menuContainer  {width      : 480px; }
        #menuContainer:first-child{
    margin:0 auto;  !important;
    padding-left:50px; !important;

    }
    .chapterContent {width      : 680px; }
    .chapterHeader  {height     : auto;  }
    .contentList    {min-width  : 680px; }
    .siteDescription{width      : 680px; }
    .seal           {display    : none;  }
    .promoIcon      {display    : none;  }
    .featureImage   {max-width  : 680px; }
    .ADOMIcon       {display    : none;}
    ul              {-webkit-padding-start: 10px;}
    .communitySiteContainer{text-align:center;width:auto}
    .sitePic        {float:none;}

    #header {
        min-width            : 0px;!important
        padding-top          : 0px; padding-bottom       : 0px;
    }

    #headerImage{
        background-image    : url(img/background680.png);
        width               : auto;!important
    background-repeat: no-repeat;
    background-position: center top;
    height: 485px;
    margin: 0 auto;
    z-index: 1;
    }
     #header{
        height               : 480px;!important
    }

}


    /*
   ==========================================
   $__720px layout (990px-1200px)
   ==========================================
 */

@media (min-width: 990px) and (max-width: 1200px){
    #parallax01{
        background-position-x: -1500px; !important;
    }
    #header{
        height               : 550px;
    }
    #buyButton{
                top: 481px;
    left: 432px;
    }
    #playButton{
        top: 356px;
    left: 456px;
    }

    .parallaxBreak{
        min-width             :680px;
    }

    table{width:auto};

    #menu{
        min-width           : 480px;
        height              : auto;
    }

    .menuButton     {
        display    : inline-block;
        width: 220px;
    }


    #menuButtons{
        text-align:center;
    }

    .featurePair, .featurePair.top    {
        width      : auto;
        text-align :center;
        background:none;
    }

    #pressKit{
    width                   : 100px;
    height                  : 100px;
    position                : absolute;
    top                     : 60px;
    left                    : 840px;
    overflow: hidden;
    background              : url(img/pressKitOff.png);
    }
    #menu{height:auto}
    #menuContainer  {width      : 480px; }
    #menuContainer:first-child{
    margin:0 auto;  !important;
    padding-left:50px; !important;

    }
    #playerQuotes   { margin-right: 30px;}
    }





}


.featurePairFAQ{
    text-align:center;
    background:none;
}

.featureHeaderFAQ h4{
    padding-top:6px;
}

/*
   ==========================================
   $__PressKit
   ==========================================
 */

.screenshot{
    width:300px;
    display:inline-block;
    padding:5px;
    border-radius:5px;
    border: 1px solid #bbb;
    margin:10px;
}

.pp_pic_holder{
    position:fixed; !important
}

p.center{
    text-align: center;
}

.logos_icons{
    width: 150px;
}

p.indieDBStamp{
    text-align:center;
}