/**
 * Short Desc: Mo'Blast homepage stylesheet
 *
 * Author: Mark White (mark@moblast.com)
 * Copyright: 2010 Mo'Blast, Inc 
 * Date: 9th April 2010
 * Version: 2.0
*/

/* Reset */

body,div,ul,ol,li,h1,h2,h3,h4,h5,h6,fieldset,input,textarea,p { 
  padding: 0;
  margin: 0;
}

fieldset,img { 
  border: 0;
}

ol,ul {
  list-style: none;
}

h1,h2,h3,h4,h5,h6 {
  font-weight: normal;
  font-size: 1em;
}

a {
  text-decoration: none;
  color: #404040;
}

a img {
  border:0;
}

/* slightly enhanced, universal clearfix hack */
.clearfix:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0;
}
.clearfix { display: inline-block; }
/* start commented backslash hack \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* close commented backslash hack */


/* Main Layout */

body{
  font-family: Verdana;
  background: #fdfdfd url(../images/bg_body.gif) repeat-x;
  color: #787878;
}

#preload {
  display: none;
  height: 0;
  width: 0;
  left: -9999px;
  overflow: hidden;
}

/* Fluid side columns, fixed centre */

#container_left {
  width: 50%;
  float: left;
  margin: 0 -495px 0 0;
}

#container_right {
  width: 50%;
  float: right;
  margin: 0 0 0 -496px;
}

#column_left {
  background: #fcfefd url(../images/bg_wrapper_left.png) right top repeat-x;
  margin: 0 495px 0 0;
  min-height: 900px;
}

#column_right {
  background: #fcfefd url(../images/bg_wrapper_right.png) left top repeat-x;
  margin: 0 0 0 494px;
  min-height: 900px;
}

#center {
  width: 990px;
  float: right;
  margin: 0 -495px 0 0;
  position: relative;
  background: #fcfefd url(../images/bg_center.png) no-repeat;
  min-height: 900px;
}

.page-layout {
  margin: 0 auto;
  width: 990px;
}

h1 {
  font-size: 132%;
  font-weight: bold;
  margin-top: 17px;
  margin-left: 20px;
}

h3 {
  font-size: 108%;
  font-weight: bold;
  text-align: center;
  margin: 0 0 15px;
}

/* Header */

body.home #header-holder{
  height: 464px;
}

#header {
  padding-top: 24px;
}

#header-subpage {
  margin: 24px auto 0 auto;
  width: 861px;
  height: 60px;
  background: url(../images/bg_header_subpage.png);
  padding: 10px 20px;
}

#title {
  float: left;
}

#header-image-holder{
  height: 318px;
  width: 901px;
  margin: 0 auto;
  position: relative;
  overflow: hidden;
}

.header-image-holder-inner{
  position: absolute;
  left: 0;
  top: 0;
  width: 901px;
  height: 318px;
  z-index: 89;
}

.header-image{
  height: 318px;
  width: 901px;
  position: absolute;
}

#header-image-mask{
  height: 318px;
  width: 901px;
  position: absolute;
  z-index: 100;
}

#poker, #flashcards, #taptin, #localshops, #tmp {
  z-index: 89;
}

.poker-graphics, .flashcard-graphics, .taptin-graphics, .localshops-graphics, .tmp-graphics {
  position: absolute;
  z-index: 95;
}

.poker-graphics {
  top: 320px;
}

#poker-badge1 {
  left: 510px;
}

#poker-badge2 {
  left: 585px;
}

#poker-badge3 {
  left: 665px;
}

#poker-badge4 {
  left: 740px;
}

#poker-cards {
  top: 200px;
  left: 755px;
  display: none;
}

#flash-logo {
  top: -150px;
  left: 37px;
  width: 203px;
  height: 150px;
}

#flash-tagline {
  top: -32px;
  left: 182px;
}

#flashcard1 {
  left: -150px;
  top: 60px;
}

#flashcard2 {
  left: 205px;
  top: -200px;
}

#flashcard3 {
  left: 375px;
  top: 318px;
}

#flashcard4 {
  left: 545px;
  top: -200px;
}

#flashcard5 {
  top: 60px;
  left: 901px;
}

#taptin-logo {
  top: 121px;
  left: 231px;
  width: 182px;
  height: 183px;
}

#taptin-logo img {
  width: 0;
  height: 0;
}

#taptin-cards {
  top: 133px;
  left: 690px;
}

#taptin-title {
  top: 255px;
  left: 230px;
  width: 220px;
  height: 41px;
}

#taptin-title img {
  width: 0;
  height: 0;
}

#taptin-tap {
  top: 235px;
  left: 120px;
  display: none;
}

#taptin-in {
  top: 235px;
  left: 278px;
  display: none;
}

#taptin-and {
  top: 265px;
  left: 705px;
}

#taptin-win {
  top: 265px;
  left: 778px;
}

.localshops-graphics {
  position: absolute;
  top: 150px;
  left: 902px;
}

#localshops-logo {
  position: absolute;
  right: 18px;
  top: 18px;
}

#localshops-tagline {
  width: 520px;
  height: 50px;
  position: absolute;
  left: 902px;
  top: 240px;
}

#tmp-others {
  top: -86px;
  left: 665px;
}

#tmp-offers {
  top: -86px;
  left: 520px;
}

#tmp-directory {
  top: -86px;
  left: 665px;
}

#tmp-chances {
  top: -86px;
  left: 520px;
}

#tmp-photos {
  top: -86px;
  left: 665px;
}

#tmp-hours {
  top: -86px;
  left: 520px;
}

#tmp-tagline {
  top: 254px;
  left: 740px;
}

/* Top Menus */

#top-menu-holder {
  margin-top: 18px;
}

#top-menu-left {
  float: left;
}

#top-menu-right-wrapper {
  padding-top: 60px;
}

#top-menu-right {
  float: right;
  background: url(../images/bg_top_menu.png);
  height: 21px;
  font-size: 76%;
  padding: 5px 8px 0 18px;
}

#top-menu-right a:link, #top-menu-right a:active, #top-menu-right a:visited {
  color: #787878;
}

#top-menu-right a:hover {
  text-decoration: underline;
}

#top-menu-right-endcap {
  background: url(../images/bg_top_menu_right.png);
  height: 26px;
  width: 10px;
  float: right;
}

#top-menu-hint {
  font-size: 76%;
  margin-bottom: 6px;
}

#icon-wrapper {
  padding: 0;
  height: 86px;
}

.icon-holder {
  float: left;
  background: url(../images/bg_icon_holder.png);
  height: 74px;
  padding: 8px 0 4px 8px;
  display: none;
}

.icon-holder.social-games{
  display: block;
}

#icon-holder-endcap {
  background: url(../images/bg_icon_holder_right.png);
  height: 86px;
  width: 8px;
  float: left;
}

.icon-image {
  float: left;
  margin-right: 16px;
  text-align: center;
}

.icon-image.last {
  margin-right: 0px;
}

.icon-legend {
  font-size: 68%;
  display: block;
  padding-top: 1px;
}

.icon-image a:link, .icon-image a:active, .icon-image a:visited {
  color: #787878;
}
  
/* Navbar */

#navbar {
  height: 56px;
  width: 100%;
  color: #4e4e4e;
  background: url(../images/bg_navbar.gif) repeat-x;
  position: absolute;
  top: 464px;
  left: 0px;
}

#navbar ul {
  padding: 0;
  list-style: none;
  height: 56px;
  width: 788px
}

#navbar li {
  display: block;
  float: left;
  height: 56px;
  width: 197px;
  text-align: center;
  font-weight: bold;
  cursor: pointer;
  font-size: 92%;
}

#navbar span {
  display: block;
  padding: 18px 10px;
}

#navbar li:hover {
}

#navbar li.active {
  background: url(../images/bg_navbar_active.gif) bottom center no-repeat;
  color: #ffffff;
}

/* Main body */

#content {
  padding-top: 35px;
}


body.home #content {
  margin-top: 56px;
  padding-top: 18px;
}

.disclaimer {
  margin: 0 auto;
  width: 860px;
  font-size: 84%;
}

.disclaimer p {
  margin: 1em 0;
}

.page {
  display: none;
  width: 865px;
  margin: 0 auto;
}

.page.social-games {
  display: block;
}

#columns-holder {
  float: left;
  background: url(../images/bg_column_bottom.png) left bottom repeat-x;
  padding-bottom: 9px;
}

.column-holder {
  float: left;
  overflow:hidden;
}

.column {
  width: 235px;
  float: left;
  margin-right: 20px;
  margin-bottom: -32758px;
  padding: 15px 20px 32768px;
  background: url(../images/bg_column_body.png) no-repeat;
  font-size: 78%;
}

.column.last {
  margin-right: 0px;
}

/* Footer */

#footer{
  clear: both;
  height: 25px;
  color: #a6a6a6;
  text-align: center;
  margin: 18px 0 0;
  font-size: 68%;
  padding-bottom: 30px;
}

#footer-copyright {
  padding: 0;
}

#footer, #footer a, #footer a:link, #footer a:active, #footer a:visited  {
  color: #a6a6a6;
}

#footer a:hover {
  text-decoration: underline;
}

/* Misc Styles */

.right {
  float: right;
}

.left {
  float: left;
}

.center {
  text-align: center;
}

.clear {
  clear: both;
}

.red {
  color: red;
}

/* Contact Form */

h2.contact {
  font-size: 92%;
  margin: 0 auto 10px;
  width: 860px
}

form {
  border-top: 1px dotted #cccccc;
  padding-top: 10px;
  width: 860px;
  margin: 0 auto;
}

form .field {
  padding-left: 150px;
  height: 24px;
}

form .field {
  clear: both;
  margin: 0 0 8px;
}

form .field label {
  float: left;
  margin-left: -150px;
  font-size: 0.8em;
  padding-top: 5px;
}

form input {
  border: 0;
  color: #7f7f7f;
  width: 300px;
}

form select {
  font-size: 0.8em;
}

textarea {
  overflow: auto;
  border: 0;
  background: url(../images/bg_textarea.png);
  width:  610px;
  padding: 20px;
  height: 301px;
}

form#contact-form p {
  margin-bottom: 10px;
  font-size: 74%;
}

p.contact-form-error {
  width: 860px;
  margin: 0 auto 10px;
  font-size: 92%;
}

form .vertical {
  float: none;
  margin: 10px 0 5px 0;
  font-size: 0.8em;
}

.centered {
  width: 610px;
  text-align: center;
}

form .field label.error{
  color: red;
  font-size: 0.6em;
  text-transform: uppercase;
  padding-top: 20px;
}

form .vertical label.error {
  color: red;
  text-transform: uppercase;
  display: block;
  font-size: 0.8em;
}

/* Feature Tour Tables */

td {
  line-height:1.3em;
  padding-bottom: 20px;
  vertical-align:top;
  width: 215px;
  font-size: 0.7em;
  padding: 20px 20px 0px 20px;
  color: #7f7f7f;
}

td.first {
  padding-left: 94px;
}

td b{
  color: #555555;
}

td img {

  margin-bottom: 5px;
}

#table-holder {
  min-height: 697px;
  margin-bottom: 40px;
}

/* Credits */

.credit-item {
  margin-bottom: 30px;
  width: 400px;
  float: left;
  margin: 0 20px 40px 20px;
  min-height: 175px;
}

.credit-item img {
  margin-bottom: 0.5em;
}

#content .credit-item p {
  margin: 0;
  float: left;
  width: 370px;
}

#content .credit-item p a{
  text-decoration: underline;
}

img.cc {
  vertical-align: top;
  margin-top: -2px;
  margin-right: 7px;
  float: left;
}

span.copyright-adjust {
  padding-left: 18px;
}

/* Localshops */

body.localshop {
  background: url(../images/bg_body_localshop.jpg) repeat;
  color: #4a4a4a;
  font-size: 92%;
  font-family: Trebuchet MS;
  font-weight: bold;
}

body.localshop #wrapper {
  width: 940px;
  margin: 20px auto;
  background: #bb8758 url(../images/bg_wrapper_localshop.png) repeat-x;
  border-radius: 40px;
  -webkit-border-radius: 40px;
  -moz-border-radius: 40px;
}

body.localshop #inside {
  padding: 20px;
}

body.localshop #header {
  padding: 0;
  width: 901px;
  margin: 0 auto 0px;
}

body.localshop #content {
  padding: 20px 20px 0;
  width: 640px;
  float: left;
  border-radius: 20px;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
}

body.localshop #screenshots-holder {
  background: #000000 url(../images/bg_screenshots.png) repeat-x;
  border-radius: 20px;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  padding: 20px;
  color: #d98200;
  text-transform: uppercase;
  font-weight: bold;
  font-size: 108%;
  margin: 20px 0 0 20px;
  position: relative;
  clear: both;
  width: 700px;
}

body.localshop #sidebar {
  float: right;
  width: 220px;
  padding-top: 20px;
}

body.localshop .sidebar-item {
  margin-bottom: 5px;
}

body.localshop h2.page-title {
  font-size: 156%;
  font-weight: bold;
  color: #333333;
  padding: 3px 0 5px;
}

body.localshop #content p {
  margin: 10px 0;
}

body.localshop #content p.small {
 font-size: 76%;
 margin: 20px 25px 0;
}

body.localshop #content ul {
  margin: 10px 0 0 25px;
  list-style: disc outside;
}

body.localshop #content li {
  margin-left: 43px;
}

body.localshop #content li.first {
  margin-top: 10px;
}


body.localshop .caption {
  color: #818181;
  text-transform: none;
  padding: 10px;
}

body.localshop #footer.page-layout{
  clear: both;
  padding: 20px 0;
  margin: 0;
  font-size: 0.8em;
  color: #333333;
  height: 0;
  width: 940px;
}

body.localshop .bottom-menu {
  display: inline;
  color: #515151;
}

body.localshop #footer a:link, body.localshop #footer a:active, body.localshop #footer a:visited  {
  color: #515151;
}

/* Language menu */

.language-menu {
  height: 20px;
  margin-bottom: 10px;
}

.dropdown-menu ul{
  float: right;
}

.dropdown-menu li {
  list-style: none;
  float: left;
  margin: 0;
  height: 20px;
}

.dropdown-menu li a {
  display: block;
  padding: 0 10px 0 10px;
}

.dropdown-menu a:link, .dropdown-menu a:active, .dropdown-menu a:visited {
  color: #4A4A4A;
}

.dropdown-menu span {
  cursor: pointer;
}

.dropdown-menu li img{
  display: inline;
  margin-left: 8px;
  vertical-align: top;
  margin-top: 1px;
}

.dropdown-menu li a:hover {
  text-decoration: underline;
}

.dropdown-menu li ul li.bottom {
  padding-bottom: 5px;
}

.dropdown-menu li ul {
  display: none;
  background: #bb8758;
  margin-left: -60px;
}

.dropdown-menu li ul li{
  padding: 5px 10px 0px 10px;
  z-index: 200;
}

.dropdown-menu li ul li a{
  padding: 0;
}

.dropdown-menu li:hover ul {
  display: block;
  position: absolute;
  text-align: left;
  z-index: 200;
}

.dropdown-menu li:hover li {
  float: none;
}

/* Scrollable */

#slider {
  margin: 20px;
}

body.localshop #slider ul, body.localshop #slider li{
  margin:0;
  padding:0;
  list-style:none;
}
body.localshop #slider li{
  width:320px;
  height:530px;
  overflow:hidden;
  margin-right: 20px;
}
#prevBtn, #nextBtn{
  display:block;
  width:30px;
  height:77px;
  position:absolute;
  left:8px;
  top:268px;
}
#nextBtn{
  left:707px;
}
#prevBtn a, #nextBtn a{
  display:block;
  width:30px;
  height:77px;
  background:url(../images/btn_prev.png) no-repeat 0 0;
}
#nextBtn a{
  background:url(../images/btn_next.png) no-repeat 0 0;
}