﻿/*  position;
    display;
    top, right, bottom, left;
    width;
    height;
    float;
    margin;
    padding;
    background-color;
    background-image;
    border;
    text-indent;
*/

* {
    margin: 0px;
    padding: 0px;
}

@font-face {
    font-family: LeagueGothic;
    src: local(BasicTitle), url('/Fonts/leaguegothic-regular-webfont.ttf') format('truetype');
    src: local(BasicTitle), url('/Fonts/leaguegothic-regular-webfont.eot');
    src: local(BasicTitle), url('/Fonts/leaguegothic-regular-webfont.eot?#iefix') format('embedded-opentype');
    src: local(BasicTitle), url('/Fonts/leaguegothic-regular-webfont.woff') format('woff');
}

/* Monitors larger than 1920px, image has "soft" edges to blend into background */
@media (min-width: 1921px){
    html, body{
        background: url('/Images/Layout/Bid4GoldBackground1920Shade.jpg') no-repeat center top fixed #000000;
        background-size: 100% auto;
    }
}

/* Monitors ranging from 1367px - 1920px */
@media (min-width: 1367px) and (max-width: 1920px){
    html, body{
        background: url('/Images/Layout/Bid4GoldBackground1920.jpg') no-repeat center top fixed #000000;
        background-size: 100% auto;
    }
}

/* Monitors ranging from 769px - 1366px */
@media (min-width :769px) and (max-width: 1366px){
    html, body{
        background: url('/Images/Layout/Bid4GoldBackground1366.jpg') no-repeat center top fixed #000000;
        background-size: 100% auto;
    }
}
/* Tablets like the iPad 2 and iPad Mini */
@media (max-width: 768px){
    html, body{
        background: url('/Images/Layout/Bid4GoldBackground768.jpg') no-repeat center top fixed #000000;
        background-size: 100% auto;
    }
}

/* At a certain point, background images become irrelevant as they are hidden behind other elements. Changed to a solid BG */
@media handheld, only screen and (max-width: 640px) {
    html, body{
        background:#000000;
    }
}

body {
    font-family: Verdana, Arial, Sans-Serif;
    font-size: 11px;
    color: #707070;
    z-index: -1; 
}

#wrapper {
    width: 960px;
    margin-top: 0px;
    margin-right: auto;
    margin-left: auto;
    padding-bottom: 20px;
    background-color: #000000;
    border-right: 1px solid #ffb400;
    border-left: 1px solid #ffb400;
    border-bottom: 1px solid #ffb400;
}

#logo, #socialShare {
    width: 450px;
    height: 100px;
    float: left;
    margin-left: 20px;
}

#socialShare {
    background-image: url('/Images/Layout/FacebookLikes.jpg');
    background-repeat: no-repeat;
}

#facebookLikes {
    float: left;
    width: 140px;
    height: 50px;
    margin-top: 10px;
    margin-left: 10px;
    font-family: LeagueGothic;
    font-size: 40px;
    text-align: center;
    color: #ffffff;
    
}

#facebookTalkingAbout {
    float: left;
    width: 140px;
    height: 50px;
    margin-top: 10px;
    margin-left: 150px;
    font-family: LeagueGothic;
    font-size: 40px;
    text-align: center;
    color: #ffffff;
}

#logo {
    background-image: url('/Images/Layout/Bid4GoldLogo.jpg');
    background-repeat: no-repeat;
    background-size: 450px 100px;
}

#rotationalBanner {
    position: relative;
    width: 920px;
    height: 300px;
    margin-top: 20px;
    margin-left: 20px;
}

#breadCrumbTrail {
    width: 920px;
    margin-top: 20px;
    margin-left: 20px;
}

#tagLine {
    width: 920px;
    margin-top: 20px;
    margin-left: 20px;
    font-size: 32px;
    font-family: LeagueGothic;
    text-align: center;
    color: #ffb400;
}

    #tagLine .greyedOut {
        color: #4a4a4a;
    }

.leftColumn, .rightColumn {
    width: 220px;
    float: left;
    margin-top: 20px;
    margin-left: 20px;
    background-color: #141414;
}

.leftColumnContent, .rightColumnContent {
    width: 198px;
    padding: 10px;
    border: 1px solid #212121;
}

.leftColumnHeader, .rightColumnHeader, .middleColumnHeader {
    border: 1px solid #fdde32;
    -webkit-border-radius: 4px 4px 0px 0px;
    -moz-border-radius: 4px 4px 0px 0px;
    border-radius: 4px 4px 0px 0px;
    background-color: #eba600;
}

.middleColumn {
    width: 440px;
    float: left;
    margin-top: 20px;
    margin-left: 20px;
    background-color: #141414;
}

.middleColumnContent {
    width: 418px;
    padding: 10px;
    border: 1px solid #212121;
}

#footer {
    width: 920px;
    margin-top: 20px;
    margin-left: 20px;
    background-color: #ffffff;
}

#footer table {

    margin-left: 5px;
}


.clearLeftFloat {
    clear: left;
}

.clearRightFloat {
    clear: left;
}

.clearAllFloats {
    clear: both;
}

/* Horizontal Drop Down Menu */
#horizontalMenu {
    width: 918px;
    height: 38px;
    margin-top: 20px;
    margin-left: 20px;
    border: 1px solid #363636;
    background-image: url('/Images/Layout/HorizontalMenuBackground.jpg');
    background-repeat:repeat-x; 
}

#dropDownMenu {
    width: 904px;
    height: 38px;
    margin-right: auto;
    margin-left: auto;
}

#horizontalMenu ul {
    list-style: none;
}

#horizontalMenu a {
    display: block;
    font-size: 12px;
    font-weight: bold;
}

#horizontalMenu a:link, #horizontalMenu a:visited {
    display: block;
    height: 38px;
    color: #ffffff;
    text-decoration: none;
}

#horizontalMenu a:hover {
    color: #ffb400;  
}

#horizontalMenu li {
    position: relative;
    width: 180px;
    height: 38px;
    line-height: 38px;
    float: left;
    text-align: center;
    vertical-align: middle;
}

    #horizontalMenu li:nth-child(1), #horizontalMenu li:nth-child(2), #horizontalMenu li:nth-child(3), #horizontalMenu li:nth-child(4){
        border-right: 1px solid #363636;
    }
    
#horizontalMenu li li {
    width: 180px;
    background-color: #222222;
    border-right: 1px solid #363636;
    border-bottom: 1px solid #363636;
    border-left: 1px solid #363636;
}

#horizontalMenu li li:nth-child(1) {
        margin-top: 0px;
        border-top: 1px solid #363636;
    }

#horizontalMenu li:hover {
    z-index: 999;
}

#horizontalMenu li li:hover {
 background-color: #2e2e2e;
 z-index: 999999;   
}

#horizontalMenu ul ul {
    position: absolute;
    visibility: hidden;
    margin-left: 20px;
    -moz-box-shadow: 2px 2px 2px 0px #0e0e0e;
    -webkit-box-shadow: 2px 2px 2px 0px #0e0e0e;
    box-shadow: 2px 2px 2px 0px #0e0e0e;
}

#horizontalMenu li:hover > ul {
    visibility: visible;
}

#welcomeBonusButtonWrapper {
    position: absolute;
    top: 90px;
    left: 419px;
    z-index: 999;
}

#auctionArenaButtonWrapper {
    position: absolute;
    top: 158px;
    left: 442px;
    z-index: 999;
}

#moneyDenButtonWrapper {
    position: absolute;
    top: 158px;
    left: 599px;
    z-index: 999;
}

#goldZoneButtonWrapper {
    position: absolute;
    top: 158px;
    left: 721px;
    z-index: 999;
}

/* Url's */
#breadCrumbTrail a:link  {
  text-decoration: none;
  color: #ff9000;
}
  
#breadCrumbTrail a:visited {
  text-decoration: none;
  color: #ff9000;
}
   
#breadCrumbTrail a:hover   {
  text-decoration: none;
  color: #ffa838;
} 
  
#breadCrumbTrail a:active  {
  text-decoration:  none;
  color: #ff9000;
}

.errorMessage {
    font-size: 11px;
    color: #dd3c05;
}

.statusMessage {
    font-size: 11px;
    color: #dd3c05;
}

/* Tables */
table {
    color: #bababa;
    border: 0px;
    padding: 0px;
}

tr {
    height: 6px;
}

td {
    padding-top: 2px;
    padding-right: 5px;
    padding-bottom: 2px;
    padding-left: 5px;
}

.leftColumnHeader h2, .rightColumnHeader h2, .middleColumnHeader h2 {
    margin: 0px;
    padding: 10px;
    text-align: center;
    font-family: Verdana, Arial, Sans-Serif;
    font-size: 14px;
    font-weight: bold;
    letter-spacing: 0px;
    line-height: 14px;
    color: #ffffff;
    -webkit-text-stroke: initial;
}

.lightBoxImageLink {
  display: inline-block;
  margin-bottom: 4px;
  line-height: 0;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
  border-radius: 4px;
  border: 1px solid #333333;
  -webkit-transition: all 0.1s ease-out;
  -moz-transition: all 0.1s ease-out;
  -o-transition: all 0.1s ease-out;
  transition: all 0.1s ease-out;
}

.lightBoxImageLink:hover {
  border: 1px solid #ffb400;
}

.lightBoxImage{
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  -o-border-radius: 2px;
  border-radius: 2px;
}

#highRollers ul {
    list-style-type: none;
    text-decoration: none;
}

.highRollerWrapper {
    width: 198px;
    margin-bottom: 5px;
}

.highRollerThumbnail {
    float: left;
    width: 25px;
    height: 25px;
}

.highRollerUserName {
    float: left;
    width: 110px;
    margin-top: 2px;
    margin-left: 5px;
    height: 23px;
    font-size: 18px;
    font-family: LeagueGothic;
    color: #386cfc;
}

.highRollerAuctionArena {
    float: left;
    width: 58px;
    height: 22px;
    margin-top: 2px;
    font-size: 8px;
    color: #bababa;
}

.highRollerDateCaptured {
    float: left;
    width: 168px;
    height: 23px;
    margin-top: -2px;
    margin-left: 30px;
    color: #313131;
}

.help {
    color: #858585;
    font-size: 9px;
}