/* ----------------------------------- SHARED ----------------------------------- */

body {
margin: 0px;
padding: 0px;
text-align: center;
font: 12px Arial, Helvetica, sans-serif;
background: url('../images/spotsHDbg.jpg') no-repeat center top #000000;
}

#container {
width: 900px;
margin: 0 auto;
text-align: left;
}

#header {
margin: 0px;
padding: 0px;
height: 97px;
background: url('../images/header.jpg') no-repeat;
}

#header span {
display: none;
}

#content {
margin: 0px;
padding: 15px 0px 30px 0px;
border: solid #242424;
border-width: 0px 1px;
background: #000000;
}

#footer {
clear: both;
margin: 0px 0px 15px 0px;
padding: 12px;
text-align: center;
border: solid #A40D11;
border-width: 2px 0px 0px 0px;
}

img {
background-color: #000000;
}

p,
a,
h1,
h2,
h3 {
margin: 0px;
padding: 0px;
}

p {
line-height: 15px;
}

h2 {
font-size: 19px;
}

.center {
text-align: center;
}

.right {
text-align: right;
}

.clearBoth {
width: 100%;
clear: both;
}

html {
overflow-y: scroll;
}

a {
outline: none;
}

/* TEXT COLORS */

p {
color: #777777;
}

a,
a:active,
a:visited {
color: #A40D11;
}

a:hover {
color: #7D0709;
}

h2 {
color: #999999;
}

.red {
color: #A40D11;
}

#footerText {
color: #454545;
}








/* ----------------------------------- NAVIGATION ----------------------------------- */

#navi,
#naviLeft,
#naviHome,
#naviServices,
#naviProduced,
#naviContact {
margin: 0px;
padding: 0px;
}

#naviLeft,
#naviHome,
#naviServices,
#naviProduced,
#naviContact {
float: left;
background-color: #000000;
background-repeat: no-repeat;
}

#naviLeft {
width: 433px;
height: 53px;
background: url('../images/navi/naviLeft.jpg');
}

#navi ul {
margin: 0px;
padding: 0px;
list-style-type: none;
}

#navi ul li a {
border: 0px;
margin: 0px;
padding: 0px;
display: block;
text-decoration: none;
}

#navi ul li a span {
display: none;
}

/* HOME */

#naviHome a {
width: 77px;
height: 53px;
background-position: 100% 100%;
background-image: url('../images/navi/naviHome.gif');
}

#naviHome a:hover {
cursor: pointer;
background-position: 0% 0%;
}

body#home #naviHome a {
background: url('../images/navi/naviHome_active.gif');
}

/* SERVICES */

#naviServices a {
width: 98px;
height: 53px;
background-position: 100% 100%;
background-image: url('../images/navi/naviServices.gif');
}

#naviServices a:hover {
cursor: pointer;
background-position: 0% 0%;
}

body#services #naviServices a {
background: url('../images/navi/naviServices_active.gif');
}

/* PRE-PRODUCED */

#naviProduced a {
width: 191px;
height: 53px;
background-position: 100% 100%;
background-image: url('../images/navi/naviProduced.gif');
}

#naviProduced a:hover {
cursor: pointer;
background-position: 0% 0%;
}

body#produced #naviProduced a {
background: url('../images/navi/naviProduced_active.gif');
}

/* CONTACT */

#naviContact a {
width: 101px;
height: 53px;
background-position: 100% 100%;
background-image: url('../images/navi/naviContact.gif');
}

#naviContact a:hover {
cursor: pointer;
background-position: 0% 0%;
}

body#contact #naviContact a {
background: url('../images/navi/naviContact_active.gif');
}








/* ----------------------------------- HOME ----------------------------------- */

#homeHeader {
height: 93px;
margin: 0px 0px 12px 0px;
padding: 0px 0px 0px 28px;
}

#homeTitle {
width: 713px;
height: 93px;
margin: 0px;
padding: 0px;
float: left;
background: url('../images/homeTitle.gif') no-repeat;
}

#demoButton a {
width: 113px;
height: 63px;
margin-top: 9px;
display: block;
float: right;
text-decoration: none;
cursor: pointer;
background: url('../images/demoButton.gif') no-repeat;
}

#homeTitle span,
#demoButton a span {
display: none;
}

#introVideo {
margin: 0px;
padding: 0px;
}

#spotsHDintro {
display: block;
width: 898px;
height: 320px;
}

body#home h2 { 
font-weight: normal; 
}

#homeText {
margin: 0px;
padding: 22px 30px 0px 30px;
background: #000000;
}

.homeServices {
margin-top: 17px;
}

.impactLine {
border: solid #A40D11;
border-width: 0px 0px 0px 2px;
}

.impactText {
margin-top: 25px;
padding: 0px
}








/* ----------------------------------- SERVICES ----------------------------------- */

#videoTitle,
#audioTitle {
display: block;
margin: 5px auto 0px auto;
padding: 0px;
}

#audioTitle {
margin-top: 30px;
}

#videoButton,
#audioButton {
float: left;
width: 150px;
height: 35px;
margin: 0px auto;
display: block;
text-decoration: none;
background: url('../images/services/videoButton.gif') no-repeat
}

#audioButton {
float: right;
background: url('../images/services/audioButton.gif') no-repeat;
}

#servicesList span {
display: none;
}

.newParagraph {
margin-top: 7px;
}

#videoEdit,
#shooting,
#graphics,
#storyboarding,
#duplication,
#radio,
#messages {
width: 870px;
height: 50px;
margin: 20px 0px 0px 0px;
padding: 0px;
}

#videoEdit {
background: url('../images/services/videoEdit.gif') no-repeat;
}

#shooting {
background: url('../images/services/shooting.gif') no-repeat;
}

#graphics {
background: url('../images/services/graphics.gif') no-repeat;
}

#storyboarding {
background: url('../images/services/storyboarding.gif') no-repeat;
}

#duplication {
background: url('../images/services/duplication.gif') no-repeat;
}

#radio {
background: url('../images/services/radio.gif') no-repeat;
}

#messages {
background: url('../images/services/messages.gif') no-repeat;
}

.servicesInfo {
margin: 0px 28px 0px 29px;
padding: 15px;
border: solid #262626;
border-width: 0px 1px 1px 1px;
}

.servicesDivider {
width: 840px;
margin: 25px auto 0px auto;
border: dotted #A40D11;
border-width: 2px 0px 0px 0px;
}

body#services a img {
margin: 5px 0px 0px 0px;
padding: 0px;
text-decoration: none;
border: none;
opacity: .5;
}

body#services a img:hover {
opacity: 1.0;
}

.sampleGap {
margin-left: 6px;
}



/* OVERLAY */

.overlay {
position: absolute;
padding: 7px;  
display: none;
background: url('../images/videoBG.gif') no-repeat;
}

.overlay .close {
position: absolute;
cursor: pointer;
top: -8px;
right: -8px; 
width: 24px;
height: 24px;
background: url('../images/closeButton.png') no-repeat;
}

.overlay a {
width: 640px;
height: 380px;
display: block;
}

#graphicsSamples .overlay img {
width: 720px;
height: 486px;
display: block;
}

#shootingSamples .overlay img {
width: 720px;
height: 462px;
display: block;
}

#shootingSamples .shootingSamplesAlt .overlay img {
width: 525px;
height: 700px;
display: block;
}

#storyboardSamples .overlay img {
width: 479px;
height: 700px;
display: block;
}

#graphicsSamples .overlay {
background: url('../images/graphicsBG.gif') no-repeat;
}

#shootingSamples .overlay {
background: url('../images/shootingBG.gif') no-repeat;
}

#shootingSamples .shootingSamplesAlt .overlay {
background: url('../images/shootingAltBG.gif') no-repeat;
}

#storyboardSamples .overlay {
background: url('../images/storyboardBG.gif') no-repeat;
}








/* ----------------------------------- PRE-PRODUCED ----------------------------------- */

#comingSoon {
display: block;
width: 326px;
height: 55px;
margin: 50px auto 30px auto;
padding: 50px 0px 30px 0px;
padding: 0px;
}








/* ----------------------------------- CONTACT ----------------------------------- */

#contactForm {
width: 205px;
margin: 0px auto;
padding: 0px;
}

label {
font: 12px Arial, Helvetica, sans-serif;
color: #777777;
line-height: 19px;
}

.formRow {
margin: 15px 0px 0px 0px;
}

#firstName {
margin: 5px 0px 0px 0px;
}

.field input,
textarea {
width: 205px;
height: 14px;
font: 12px Arial, Helvetica, sans-serif;
color: #444444;
border: 1px solid #FFFFFF;
background: url('../images/inputBG.gif') no-repeat;
background-color: #FFFFFF;
}

textarea {
height: 60px;
background: url('../images/textareaBG.gif') no-repeat;
overflow: auto;
}

#submit {
text-align: center;
margin: 20px 0px 15px 0px;
}

.required {
font-size: 9px;
color: #A40D11;
}

#positiveFeedback {
display: none;
color: #FFFFFF;
}

#negativeFeedback {
display: none;
color: #A40D11;
}