/* embed mongoose font */

@font-face {
 font-family: "Geometric231HeavyBT";
 src: url("../fonts/Geometric231HeavyBT.eot") /* EOT file for IE */
}
@font-face {
 font-family: "Geometric231HeavyBT";
 src: url("../fonts/Geometric231HeavyBT.ttf") format("truetype"); /* TTF file for CSS3 browsers */
}

/* embed OS racing number font */
@font-face {
 font-family: "clarendonBoldCondensedBT";
 src: url("../fonts/clarendonBoldCondensedBT.eot") /* EOT file for IE */
}
@font-face {
 font-family: "clarendonBoldCondensedBT";
 src: url("../fonts/clarendonBoldCondensedBT.ttf") format("truetype"); /* TTF file for CSS3 browsers */
}

/* mongoose colors 
lime-green: #5CE738; 
yellow green: #CDFD0B;
*/

/* element styles */ 
html,body {margin: 0px; padding: 0px;}
body {color: white; font-weight: bold; text-shadow: #000000 2px 2px 3px; margin: 0px; padding: 0px; font-family: "Geometric231HeavyBT", helvetica, arial, sans-serif, sans, serif; color: <?php echo $textColor; ?>; background: #666666 url('https://www.bmxmongoose.com/php/phpDraw/Mongoose-BMX.jpg') no-repeat fixed top right;}
div#topNav{margin: 0px; padding: 0px; position: absolute; top: 8px;}
h1.blogTitle{text-shadow: none; margin: 0px; padding: 8px; color: black; background-color: #5CE738; border: black solid 5px; -webkit-border-radius: 20px 20px; -moz-border-radius: 20px; border-radius: 20px; clear: both;}
p {margin: 0px; padding: 16px; color: white;}      

img {border: 0px;}
img.rounded {border: 0px; border-radius: 18px; -webkit-border-radius: 18px 18px; -moz-border-radius: 18px; }

div#header {text-shadow: #000000 2px 2px 1px; font-size: 18px; font-weight: bold; text-align: left; position: absolute;}
.randomProduct {text-shadow: #000000 2px 2px 1px;}
div#profileImage {text-shadow: #000000 2px 2px 1px; margin: 0px; padding: 0px; font-size: 14px; text-align: right; position: absolute; right: 368px; top: 73px; font-weight: bold;}

#twitterHeader {position: absolute; z-index: 11; top: 187px; left: 218px;}
#facebookLike {position: absolute; z-index: 21;  top: 194px; left: 305px;}
#googlePlusOne {position: absolute; z-index: 13; top: 191px; left: 405px;}

div#blogBorderBackground {color: white; position: absolute; border-bottom-left-radius: 20px; -webkit-border-bottom-left-radius: 20px 20px; -moz-border-radius-bottomleft: 20px;}
div#blogBackgroundAlpha {padding: 0px; margin: 0px; background-color: rgba(0, 0, 0, .5)}
#blackScreen {background-image: url('../images/alpha_50.gif');}
#blogHeaderContainer {height: 183px; background-image: url('../images/chain_fence.gif');}
.grabIt {text-shadow: none; margin: 0px; padding: 3px; border: black solid 3px; background: white; color: black; font-weight: bold; text-align: center; border-radius: 8px; -webkit-border-radius: 8px 8px; -moz-border-radius: 8px; font-size: 15px;}
div#blogHeader {position: absolute; z-index: 4; width: 270px; right: -127px;} 
#dailyFeatureContainer {float: left; width: 545px; height: 183px; text-align: left;}
#dailyFeature {text-align: center; padding: 0px; width: 175px;}
#coloredFlags {background-image: url('../images/coloredFlags.gif'); background-repeat: repeat-x; background-position: right top; height: 100px; position: relative; top: -6px; left: -3px;}
div#footer {text-align: center; font-size: 14px; width: 100%; border-bottom-left-radius: 20px; -webkit-border-bottom-left-radius: 20px 20px; -moz-border-radius-bottomleft: 20px; background-image: url('../images/chain_fence.gif'); clear: both;}

/* blogNav div styles */
#blogNav {text-shadow: none; z-index: 10; position: absolute; text-align: left;}

/* blogNav dropdown styles */
#blogNav ul{width: 100px; height: 24px; float:left; margin:0px; padding-left: 3px; padding-right: 3px; list-style:none;}
#blogNav ul .item{display: none; cursor: pointer; color: black; background-color: #5CE738; border: black solid 2px;}
#blogNav .child {display: none; background-image: none; position: absolute; left: 154px; top: 24px;}
#blogNav .child li {width: 140%; background: #ffcc00; padding: 5px; border: black solid 2px; border-radius: 8px; -webkit-border-radius: 8px 8px; -moz-border-radius: 8px;}
#blogNav li:hover .item{background-color: pink}
#blogNav ul:hover .item{display:block; padding: 5px; margin: 0px; width: 140%; border-radius: 8px; -webkit-border-radius: 8px 8px; -moz-border-radius: 8px;}
#blogNav .item:hover .child {display: block;}
#blogNav .item:hover  {background-color: black; border-color: yellow; color: yellow;}
.clear{clear:both; height:10px;} /* currently, there is no .clear class in the html but perhaps it's useful in subdirectory-dropdowns? */
.top {cursor: pointer; text-align: center; color: black; padding: 2px; padding-bottom: 3px;}

/* social networking div styles */
#socialNetworking {position: absolute; top: 830px; right: -140px; width: 125px; background-image: url('../images/alpha_75.gif'); background-color: rgba(0, 0, 0, 0.6); border-radius: 20px; -webkit-border-radius: 20px 20px; -moz-border-radius: 20px;}

/* Image Grabber div styles */ 
#imageGrabber {position: absolute; top: 330px; text-align: right; padding: 6px; color: white; background: rgba(0, 0, 0, 0.6);}

/* digg div styles */ 
#digg {position: absolute; text-align: center; margin: 2px;}

/* latest news ticker div styles */
#newsTicker {padding: 6px; margin: 6px; background: rgba(0, 0, 0, 0.6); background-image: url('../images/alpha_75.gif'); position: absolute; border-top-right-radius: 20px; -webkit-border-top-right-radius: 20px 20px; -moz-border-radius-topright: 20px; border-top-left-radius: 8px;}
#ticker {padding: 6px; margin: 6px; background: rgba(0, 0, 0, 0.6);}

/* link styles */
a:link {color: aqua; text-decoration: none; font-weight: bold;}
a:visited {color: aqua; text-decoration: none; font-weight: bold;}
a:hover {color: yellow; text-decoration: underline; font-weight: bold;}
a:active {color: white; text-decoration: none; font-weight: bold;}

a.linkWhite:link {color: white; text-decoration: none; font-weight: bold;} 
a.linkWhite:visited {color: white; text-decoration: none; font-weight: bold;}
a.linkWhite:hover {color: red; text-decoration: underline; font-weight: bold;}
a.linkWhite:active {color: orange; text-decoration: none; font-weight: bold;}

a.linkBlack:link {color: black; text-decoration: none; font-weight: bold;} 
a.linkBlack:visited {color: black; text-decoration: none; font-weight: bold;}
a.linkBlack:hover {color: white; text-decoration: underline; font-weight: bold;}
a.linkBlack:active {color: orange; text-decoration: none; font-weight: bold;}

a.linkBlackRed:link {color: black; text-decoration: none; font-weight: bold;} 
a.linkBlackRed:visited {color: black; text-decoration: none; font-weight: bold;}
a.linkBlackRed:hover {color: red; text-decoration: underline; font-weight: bold;}
a.linkBlackRed:active {color: white; text-decoration: none; font-weight: bold;}

a.linkYellow:link {color: yellow; text-decoration: none; font-weight: bold;} 
a.linkYellow:visited {color: yellow; text-decoration: none; font-weight: bold;}
a.linkYellow:hover {color: white; text-decoration: none; font-weight: bold;}
a.linkYellow:active {color: #CDFD0B; text-decoration: none; font-weight: bold;}

a.linkRed:link {color: red; text-decoration: none; font-weight: bold;} 
a.linkRed:visited {color: red; text-decoration: none; font-weight: bold;}
a.linkRed:hover {color: #5CE738; text-decoration: none; font-weight: bold;}
a.linkRed:active {color: #CDFD0B; text-decoration: none; font-weight: bold;}

/* numberPlate link styles */ 
#numberPlateZ {z-index: 1; position: relative; top: -100px; padding: 3px;}
// div.numberPlate:hover {background: aqua; text-decoration: underline; font-weight: bold;}
// div.numberPlate:active {background: yellow; text-decoration: underline; font-weight: bold;}

/* ticker styles */
.ticker_latest {color: white;}
a.ticker_link {color: white; font-size:13px; text-decoration:none;}
a.ticker_link:visited {color: white; text-decoration:none;}
a.ticker_link:hover {color: red; text-decoration:underline;}
a.ticker_link:active {color: yellow; text-decoration: underline;}
.ticker_div {height:18px; overflow:hidden;}

/* adsense styles */
#adsense {position: absolute;}

#mongooseCereal {position: absolute;}

#adsenseTopLeft {position: absolute; top: 75px; right: 908px;}

/* playlistAJAX div style */
#playlistId {margin: 0px; padding: 0px; z-index: 12; position: absolute; top: 7px; left: 7px;}
#playlistPrevId {margin: 0px; padding: 0px; z-index: 11; position: absolute; top: 7px; left: 7px; width:433px; height: 268px; background-image: url('../images/alpha_50.gif'); text-align: center; color: white; font-size: 70px; border: #5CE738 solid 1px; font-family: helvetica, arial, sans; font-weight: normal; text-shadow: #000000 2px 2px 3px;}

/* movie previewer styles */
#moviePreviewer {position: absolute; z-index: 9; text-align: left; right: 0px; top: 0px; text-shadow: #000000 2px 2px 3px; background-image: url('../images/alpha_75.gif'); width: 200px; padding: 12px; border: ridge #666666 2px; color: white; background-color: rgba(0, 0, 0, 0.75)}

.dropShadow {-webkit-filter: drop-shadow(11px 11px 4px #222); filter: drop-shadow(11px 11px 4px #222);}
.bikeShadow {-webkit-filter: drop-shadow(9px -3px 4px #222); filter: drop-shadow(9px -3px 4px #222);}