﻿/*  VR Vistas Style sheet - Creator: Rob Symberlist - July 2013  */
/*  CSS for Photo Video Order Form */
/*  I'd rather do this using jQuery+CSS but don't have the time! */

#orderFormContainer {position: absolute; display:block; top:0; bottom: 0; left: 0; right: 0; margin: auto; width:640px; height:450px; color:#000; font-family: Arial, Helvetica, sans-serif; }
#orderFormContainer form input.text {font-family: Arial, Helvetica, sans-serif; font-size:12pt;}
#orderForm {position:relative; display:block; background-color:white; width:620px; margin-left:20px; top:0px; font-size:16px;}
#orderFormHeader {position:absolute; top:10px; width:600px; margin-left:2px; padding-bottom:5px; background-color:white; display:block; border-bottom:thin #ddd solid;}
#orderFormTitle {width:570px; margin-left:0px; padding-bottom:20px; text-align:left; font-size:24px; font-weight:bold;}
#step1 {float:left; font-size:18px; color:#000; font-weight:bold;}
#step2 {float:left; margin-left:100px; color:silver; font-size:18px; font-weight:bold;}
#step3 {float:right; margin-right:5px; color:silver; font-size:18px; font-weight:bold;}

#orderFormPanel1 {position:absolute; top:100px; height:360px; margin-left:10px; margin-right:10px; background-color:white; display:block;}
#selPackage {clear:both; float:left; margin-bottom:10px;}
.selPackageContact {float:left; margin-bottom:10px; font-size:11pt; font-style:italic;}
.selPackageText {float:left; margin-bottom:10px;}
.selPackageEco {clear:both; float:left; height:30px; font-size:16px;}
.selPackagePro {float:left; height:30px; font-size:16px;}
#Professional {padding-top:5px;}
.selPackageName {float:right; margin-right:15px; height:30px; font-size:16px; font-weight:bold;}
#selOptions {clear:both; float:left;  margin-bottom:5px;}
.selOptionsText {float:left; width:320px; margin-bottom:10px; text-align:left;}
.selOptionsNumber {float:left; width:320px; height:30px; margin-top:2px; text-align:left; font-size:15px;}
.selOptionsPhoto {text-align:center; border:0; font-size:15px;}
.selOptionsExtra {float:right; height:30px; margin-right:85px; font-size:15px;}
.selOptionsPrice {text-align:right; font-size:15px;}
.text_cb, .voice_cb {float:left; width:300px; height:30px; margin:2px 0px 0px 0px; text-align:left; font-size:15px;}
.customIntro, .voiceOver {float:right; height:30px; margin-right:85px; font-size:15px;}
.optionsTotal {float:right;  margin-right:15px; font-size:16px; font-weight:bold;}
.noVAT{	float:left; margin-top:15px;}
.totalPrice {float:right; margin:13px 15px 0px 0px;}

#orderFormPanel2 {position:absolute; top:95px; height:360px; background-color:white; display:none;}
#yourDetails {clear:both; margin-top:0px; margin-left:40px;}
#table6 {width:100%; color:#000; font-size:12pt;}
.padleft5 {margin-left:5px; padding:1px 2px 2px 2px; }
#firstnameHi {margin-left:5px; padding:1px 2px 2px 2px; background-color:#fff;}
#firstnameEx {padding:0px; display:none; background-image: url('../images/exclamation25.png'); background-repeat:no-repeat;}
#lastnameHi {margin-left:5px; padding:1px 2px 2px 2px; background-color:#fff;}
#lastnameEx {padding:0px; display:none; background-image: url('../images/exclamation25.png'); background-repeat:no-repeat;}
#websiteHi {margin-left:5px; padding:1px 2px 2px 2px; background-color:#fff;}
#websiteEx {padding:0px; display:none; background-image: url('../images/exclamation25.png'); background-repeat:no-repeat;}
#addressHi {margin-left:5px; padding:1px 2px 2px 2px; background-color:#fff;}
#addressEx {padding:0px; display:none; background-image: url('../images/exclamation25.png'); background-repeat:no-repeat;}
#postcodeHi {margin-left:5px; padding:1px 2px 2px 2px; background-color:#fff;}
#postcodeEx {padding:0px; display:none; background-image: url('../images/exclamation25.png'); background-repeat:no-repeat;}
#telHi {margin-left:5px; padding:1px 2px 2px 2px; background-color:#fff;}
#telEx {padding:0px; display:none; background-image: url('../images/exclamation25.png'); background-repeat:no-repeat;}
#emailHi {margin-left:5px; padding:1px 2px 2px 2px; background-color:#fff;}
#emailEx {padding:0px; display:none; background-image: url('../images/exclamation25.png'); background-repeat:no-repeat;}

#orderFormPanel3 {position:absolute; top:95px; height:360px; background-color:white; display:none; }
#confirmOrder {clear:both; margin:10px; text-align:left; color:#000;}
#orderSummary {float:left; margin-bottom:7px;}
#nextSteps {float:left; margin-bottom:0px; color:#000;}
#nextSteps ol {margin:0px 15px 7px 25px; padding:0px; color:#000; font-size:small;}
#placeOrder {position:relative; color:#000;}
#copy{width:11px; height:11px; margin:0px; padding:0px;}
#terms{width:11px; height:11px; margin:0px; padding:0px;}
#copyHi{background-color:#fff; width:13px; height:13px; margin:0px; padding:2px;}
#termsHi{background-color:#fff; width:13px; height:13px; margin:0px; padding:2px;}
#copyEx {float:left; display:none; margin:6px 0px 0px 5px; width:16px; background-image: url('../images/exclamation.png'); background-repeat:no-repeat;}
#termsEx {float:left; display:none; margin:6px 0px 0px 5px; width:16px; background-image: url('../images/exclamation.png'); background-repeat:no-repeat;}
#copyCheckBox {float:left; margin-top:5px; font-size:small; }
#termsCheckBox {float:left; margin-top:5px; font-size:small; }
#copyCheckBoxText {float:left; margin-top:5px; font-size:small; }
#termsCheckBoxText {float:left; margin-top:5px; font-size:small; }
#orderCaptcha {float:left; margin:4px 0px 0px 0px; }
#siinputHi{position:relative; margin:0px 0px 0px 134px; width:104px; padding:2px 1px 2px 3px; background-color:#fff;}
#siinputEx {float:left; display:none; margin:15px 0px 0px 4px; width:25px; background-image: url('../images/exclamation.png'); background-repeat:no-repeat;}
.orderConfirm {float:right; margin-right:15px; margin-top:16px;}
.codeInput{ background: none repeat scroll 0% 0% #FFF; border: 1px solid #000; padding: 6px 4px ; width: 92px; color:#999; font-size: 16px; }

#orderFormPanel4 {position:absolute; top:110px; height:355px; background-color:white; display:none;}
#orderReference, #orderPayments {position:relative; text-align:left;}
.orderReferenceText, .orderPaymentsText {float:left; margin:5px 0px 0px 10px; width:560px; font-size:medium;}

.orderFormFooter {position:absolute; top:460px; width:600px; background-color:white; margin-left:2px; padding-top:8px; border-top:thin #ddd solid;}
.footerReset {float:left; vertical-align:top;}
.footerPricelist {float:left; vertical-align:top; margin-left:30px;}
.footerTerms {float:left; vertical-align:top; margin-left:10px;}
.footerContact {float:left; vertical-align:top; margin-left:10px;}
.footerNext {float:right; vertical-align:top;}
.footerBack {float:right; vertical-align:top; margin-right:10px;}

#nextEco, #nextPro, #thanksEco, #thanksPro {display:none}