@charset "utf-8";
/* CSS Document */

* { margin: 0; padding: 0 }

body { background: #000; color: #ddd; font: 14px Arial, Helvetica, sans-serif }

a { color: #00CCFF; text-decoration: none }
a:hover { color: #fff }

hr { border-top: 1px solid #666666; border-bottom: 1px solid #333333 }

.txtleft { text-align: left }
.txtrght { text-align: right }
.left { float: left }
.right { float: right }
.undcon { height: 400px; }

div#wrapper { width: 100%; float: left; display: inline }

h1, h2, h3, h4, h5, h6 { margin-bottom: 5px; color: #fff; font-family: 'Oswald', sans-serif; text-shadow: 1px 1px 1px #777; }

h1 { margin-top: 20px; font-size: 50px; text-shadow: 2px 2px 2px #777; }
h2 { margin-top: 20px; font-size: 40px; text-shadow: 2px 2px 2px #777; }
h3 { margin-top: 20px; font-size: 30px; text-shadow: 2px 2px 2px #777; }
h1.title { margin-top: 30px; font-size: 60px; letter-spacing: 5px; text-transform: uppercase } 
h3.title { margin-bottom: 20px; font-size: 20px; letter-spacing: 10px; text-transform: uppercase } 

header { width: 100%; float: left; display: inline; background: #000 url(../images/bg/header.gif) top repeat-x; }
header img#logo { margin-top: 9px; border: none; }

div#contentarea { width: 100%; float: left; display: inline }
div.content { width: 960px; margin: 0 auto }
div.rightcol { width: 480px; float: right; display: inline }
div.leftcol { width: 480px; float: left; display: inline }
div.buy-online { margin: 30px 0; width: 480px; float: left; display: inline; text-align: center; }

div.content p { margin: 0 0 15px 0; line-height: 130%; text-shadow: 1px 1px 2px #aaa; }

footer { width: 100%; float: left; display: inline; background: #000 url(../images/bg/footer.gif) top repeat-x; font-size: 12px; }
footer div#socialmedia { margin-bottom: 30px; padding: 13px 0; }
footer p.copy { text-shadow: none; }
footer p.copy, footer p.copy a { color: #222  }
footer p.copy a:hover { color: #fff }

nav { margin-top: 40px; float: right; display: inline; font-size: 18px; font-family: 'Oswald', sans-serif; }
nav ul { list-style: none;  }
nav ul li { float: left; display: inline }
nav ul li a { color: #999; padding: 10px;  display: inline-block; float: left; text-transform: uppercase; text-shadow: 1px 1px 2px #777 }
nav ul li a:hover { color: #fff }
nav ul li a.active { color: #00CCFF } 

aside { margin: 0 20px 10px 0; padding: 0 20px 20px 0; border-right: 5px dotted #555;  float: right; display: inline; text-align: right; font: 18px 'Oswald', sans-serif;  }
aside h1 { margin-top: 8px; }
aside ul { list-style: none }
aside ul li { }
aside ul li a { color: #999 }
aside ul li a.active { color: #00CCFF }

ul#social { margin-top: 5px; list-style: none }
ul#social li { margin-right: 10px;  display: inline }
ul#social li a { padding: 5px 0 5px 30px; color: #999; }
ul#social li a:hover { color: #fff; }
ul#social li a.facebook { background: url(../images/icons/facebook_24.png) left center no-repeat; }
ul#social li a.myspace { background: url(../images/icons/myspace_24.png) left center no-repeat; }
ul#social li a.youtube { background: url(../images/icons/youtube_24.png) left center no-repeat; }

ul#moresocial { list-style: none; float: left; display: inline }
ul#moresocial li { float: left; display: inline;  }
ul#moresocial li a { margin-left: 6px; padding: 5px 0; width: 24px; display: inline-block; text-indent: -9999px; }
ul#moresocial li a.twitter { background: url(../images/icons/twitter_24.png) left center no-repeat; }
ul#moresocial li a.lastfm { background: url(../images/icons/lastfm_24.png) left center no-repeat; }
ul#moresocial li a.linkedin { background: url(../images/icons/linkedin_24.png) left center no-repeat; }
ul#moresocial li a.googleplus { background: url(../images/icons/google-plus_24.png) left center no-repeat; }

#gallery { margin-bottom: 20px; }
#gallery a img { border: 1px solid #444; margin: 4px; }

/* Form */
div.form { margin-top: 20px; }
div.form label { width: 130px; display: inline-block; vertical-align: top; }
div.form input { width: 300px; padding: 5px; border: 1px solid #999; background: #fff; -moz-border-radius: 2px; border-radius: 2px; font: bold 16px Arial, Helvetica, sans-serif; color: #222 }
div.form textarea { width: 300px; height: 140px; padding: 5px; border: 1px solid #999; background: #fff; -moz-border-radius: 2px; border-radius: 2px; font: bold 16px Arial, Helvetica, sans-serif; color: #222  }
div.form input.button { width: 120px; font-size: 14px; font-weight: bold; letter-spacing: -1px; background: #FF0000; color: #fff; border: 1px solid #FF3300; } 

/* applying the gradient on inside the form controls */
div.form input, div.form textarea { 
background: #ffffff; /* Old browsers */
background: -moz-linear-gradient(top,  #ffffff 0%, #eeeeee 50%, #eeeeee 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(50%,#eeeeee), color-stop(100%,#eeeeee)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #ffffff 0%,#eeeeee 50%,#eeeeee 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #ffffff 0%,#eeeeee 50%,#eeeeee 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #ffffff 0%,#eeeeee 50%,#eeeeee 100%); /* IE10+ */
background: linear-gradient(top,  #ffffff 0%,#eeeeee 50%,#eeeeee 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#eeeeee',GradientType=0 ); /* IE6-9 */
}
/* End of Form */