
/*******************************************************************************
com_pb_ecards
*******************************************************************************/

div.clear { clear: both; margin: 0; padding: 0; height: 0; line-height: 0; font-size: 0; }
div.left { float: left; }
div.right { float: right; }

.noscreen { display: none; }

/* STEP 1 */
#FormECard.step1 { display: block; margin: 0 0 30px 0; padding: 0; width: 900px; }

#FormECard.step1 fieldset { display: block; margin: 0; padding: 0; width: 900px; }

#FormECard.step1 fieldset div.left { border: none!important; }

#FormECard.step1 fieldset div#steps-wrapper { display: block; margin: 0 0 22px -3px; padding: 0; width: 566px; height: 38px; background: url(../images/steps.gif) left top no-repeat; }
#FormECard.step1 fieldset div#steps-wrapper.step1 { background-position: 0px 0px;}
#FormECard.step1 fieldset div#steps-wrapper .step1 { display: block; float: left; margin: 0; padding: 0; width: 150px; height: 38px; }
#FormECard.step1 fieldset div#steps-wrapper .step2 { display: block; float: left; margin: 0; padding: 0; width: 253px; height: 38px; }
#FormECard.step1 fieldset div#steps-wrapper .step3 { display: block; float: left; margin: 0; padding: 0; width: 162px; height: 38px; }

div.ecards-container { display: block; margin: 0; padding: 0; width: 900px; }
div.ecards-container div.row-wrapper { display: block; margin: 0 0 19px 0; padding: 0; }
#content div.ecards-container div.row-wrapper div.left {margin:0; padding:0; display:inline;}
div.ecards-container div.ecard-wrapper { display: block; margin: 0; padding: 4px; background-color: #fff; border: 1px solid #fff; overflow: hidden; }
#content div.ecards-container div.right-margin { margin-right: 10px;}
div.ecards-container div.ecard-wrapper_hover { background-color: #cae1de; border: 1px solid #7dc1b2!important; cursor: pointer; }
div.ecards-container div.ecard-wrapper_border { background-color: #b5d7d3; border: 1px solid #7dc1b2!important; }
div.ecards-container div.ecard-wrapper div.caption { display: block; margin: 0; padding: 0; overflow: hidden; }
div.ecards-container div.ecard-wrapper div.caption span { display: block; margin: 3px 0; padding: 0; font: 1.0em Arial; color: #343434; text-decoration:none; border:none; }

div.ecards-container div.ecard-wrapper div.input { }
div.ecards-container div.ecard-wrapper div.input input { margin: 0; padding: 0; }
div.ecards-container div.ecard-wrapper div.input span { display: inline; margin: 0; padding: 0; font: 1.2em Arial; color: #343434; line-height: 12px; }

#FormECard.step1 fieldset.submit { display: none; }
#FormECard.step1 fieldset.submit div { display: block; float: right; margin: 5px 0 0; padding: 0; }
#FormECard.step1 fieldset.submit div input { display: block; margin: 0 7px 0 0; padding: 0; width: 343px; height: 30px; border: 0; background: url(../images/continue-to-step-2-of-3.gif) left top no-repeat; }
#FormECard.step1 fieldset.submit div input:hover { background-position: 0 -30px; }

/* ERROR MESSAGE */
#myJavascriptErrorStep1 { display: none; overflow: hidden; }

/* javascript error messages box with caution image and graphic header */
#FormECard.step1 fieldset div.errormsg { margin: 0 7px 21px 5px; padding: 15px 20px 15px 72px; border: 1px solid #c2c2c2; }
#FormECard.step1 fieldset div.errormsg { background: #ffffd6 /*#ffedf0*/ url(../images/error-caution.png) 17px 24px no-repeat; }
#FormECard.step1 fieldset div.errormsg #myJavascriptErrorStep1_message { display: block; margin: 0 0 6px 0!important; padding: 0; font: bold 1.6em Arial; color: #d70941; overflow: hidden; }
#FormECard.step1 fieldset div.errormsg #myJavascriptErrorStep1_items { display: block; margin: 0!important; font: 1.2em Arial; color: #d70941; overflow: hidden; }
#FormECard.step1 fieldset div.errormsg #myJavascriptErrorStep1_items span.item { display: block; font: 1.2em Arial; color: #d70941; padding: 0 0 0 13px; background: url(../../../templates/images/plan-my-vacation/preview-availability4/more-information-bullet.png) left 3px no-repeat; }

#FormECard.step1 span.copyright { display: none; /*block;*/ margin: 36px 0 0; padding: 0; font: italic 1.0em Georgia; color: #a6a5a1; }




/* STEP 2 */
#FormECard.step2 { display: block; margin: 0; padding: 0; width: 900px; }

#FormECard.step2 fieldset { display: block; margin: 0 0 0 24px; padding: 0; width: 852px; }

#FormECard.step2 fieldset div.left { border: none!important; }

#FormECard.step2 div#steps-wrapper { display: block; margin: 0 0 7px -3px; padding: 0; width: 566px; height: 38px; background: url(../images/steps.gif) left top no-repeat; }
#FormECard.step2 div#steps-wrapper.step2 { background-position: 0px -38px;}
#FormECard.step2 div#steps-wrapper .step1 { display: block; float: left; margin: 0; padding: 0; width: 150px; height: 38px; }
#FormECard.step2 div#steps-wrapper .step2 { display: block; float: left; margin: 0; padding: 0; width: 253px; height: 38px; }
#FormECard.step2 div#steps-wrapper .step3 { display: block; float: left; margin: 0; padding: 0; width: 162px; height: 38px; }

#step2_container { display: block; margin: 0; padding: 0; width: 900px; height: 561px; background: url(../images/step2-background.gif) left top no-repeat; overflow: hidden; }
#step2_container div.postcard-wrapper { display: block; margin: 24px 0 34px 24px; padding: 0; width: 852px; height: 301px; overflow: hidden; }
#step2_container div.postcard-wrapper div.photo { display: block; margin: 7px 0 0 7px; padding: 0; width: 500px;/*517px;*/ height: 287px; overflow: hidden; }
#step2_container div.postcard-wrapper div.message-wrapper { display: block; margin: 7px 0 0; padding: 0; width: 328px; height: 287px; overflow: hidden; }
#step2_container div.postcard-wrapper div.message-wrapper div.postcard-logo { display: block; margin: 18px 0 24px 33px; padding: 0; width: 262px; height: 38px; }
#step2_container div.postcard-wrapper div.message-wrapper div.message { display: block; margin: 0 0 0 33px; padding: 0; width: 262px; height: 160px; text-align: center; }
#step2_container div.postcard-wrapper div.message-wrapper div.message span { font: italic 1.3em Georgia; color: #343434; text-align: center; }
#step2_container div.postcard-wrapper div.message-wrapper div.address { display: block; margin: 0 0 0 33px; padding: 0; width: 262px; height: 47px; text-align: center; }
#step2_container div.postcard-wrapper div.message-wrapper div.address span { font: 1.1em Arial; color: #343434; text-align: center; }

#FormECard.step2 fieldset div.fieldset label.label2 { display: block; margin: 0 0 6px 0; padding: 0; font: bold 1.5em Arial; color: #004e43; white-space: nowrap; }

#FormECard.step2 fieldset div.fieldset { display: block; margin: 0 0 12px 0; padding: 0px; overflow: hidden; }
#FormECard.step2 fieldset div.wide { width: 852px; }
#FormECard.step2 fieldset textarea#message { width: 852px; height: 86px; }
#FormECard.step2 fieldset textarea#message { border-top: none; border-right: 1px solid #b4b4b4; border-bottom: 1px solid #dadada; border-left: 1px solid #b4b4b4; background: url(../images/input-background.gif) left top repeat-x; }
#FormECard.step2 fieldset div.fieldset span.helper-text { display: block; margin: 0; padding: 0; font: 1.0em Verdana; color: #323b3a; }
#FormECard.step2 fieldset div.fieldset span.helper-text span.right { float: right; padding-right: 16px; }

#FormECard.step2 fieldset.submit div { display: block; float: right; margin: 5px 0 0; padding: 0; }
#FormECard.step2 fieldset.submit div input { display: block; margin: 0; padding: 0; width: 270px; height: 30px; border: 0; background: url(../images/continue-to-step-3-of-3.gif) left top no-repeat; }
#FormECard.step2 fieldset.submit div input:hover { background-position: 0 -30px; }

/* ERROR MESSAGE */
#myJavascriptErrorStep2 { display: none; overflow: hidden; }


/* STEP 3 */
#FormECard.step3 { display: block; margin: 0; padding: 0; width: 900px; }

#FormECard.step3 h3 { display: block; margin: 0 0 6px 0; padding: 0; font: bold 1.5em Arial; color: #004e43; white-space: nowrap; }

#step3_container { display: block; margin: 0; padding: 0; width: 900px; height: 663px; background: url(../images/step3-background.gif) left top no-repeat; overflow: hidden; }
#FormECard.step3 div.top-half { display: block; margin: 0; padding: 0; width: 900px; height: 263px; overflow: hidden; }
#FormECard.step3 div.preview-postcard { display: block; margin: 0px 0 5px 24px; padding: 0; width: 852px; height: 301px; overflow: hidden; }
#FormECard.step3 div.preview-postcard div.photo { display: block; margin: 7px 0 0 7px; padding: 0; width: 500px;/*517px;*/ height: 287px; overflow: hidden; }
#FormECard.step3 div.preview-postcard div.message-wrapper { display: block; margin: 7px 0 0; padding: 0; width: 328px; height: 287px; overflow: hidden; }
#FormECard.step3 div.preview-postcard div.message-wrapper div.postcard-logo { display: block; margin: 18px 0 24px 33px; padding: 0; width: 262px; height: 38px; }
#FormECard.step3 div.preview-postcard div.message-wrapper div.message { display: block; margin: 0 0 0 33px; padding: 0; width: 262px; height: 160px; text-align: center; }
#FormECard.step3 div.preview-postcard div.message-wrapper div.message span { font: italic 1.3em Georgia; color: #343434; text-align: center; }
#FormECard.step3 div.preview-postcard div.message-wrapper div.address { display: block; margin: 0 0 0 33px; padding: 0; width: 262px; height: 47px; text-align: center; }
#FormECard.step3 div.preview-postcard div.message-wrapper div.address span { font: 1.1em Arial; color: #343434; text-align: center; }

#FormECard.step3 fieldset.fieldset1 { display: block; margin: 24px 0 0 24px; padding: 0; width: 852px; }
#FormECard.step3 fieldset.fieldset2 { display: block; margin: 12px 0 0 24px; padding: 0; width: 852px; }
#FormECard.step3 fieldset div.left { border: none!important; }

#FormECard.step3 div#steps-wrapper { display: block; margin: 0 0 22px 0; padding: 0; width: 566px; height: 38px; background: url(../images/steps.gif) left top no-repeat; }
#FormECard.step3 div#steps-wrapper.step3 { background-position: 0px -76px;}
#FormECard.step3 div#steps-wrapper .step1 { display: block; float: left; margin: 0; padding: 0; width: 150px; height: 38px; }
#FormECard.step3 div#steps-wrapper .step2 { display: block; float: left; margin: 0; padding: 0; width: 253px; height: 38px; }
#FormECard.step3 div#steps-wrapper .step3 { display: block; float: left; margin: 0; padding: 0; width: 162px; height: 38px; }

#FormECard.step3 div.fieldset, #FormECard.step3 div.fieldset2 { display: block; margin: 0 10px 12px 0; padding: 10px; overflow: hidden; }
#FormECard.step3 div.fieldset, #FormECard.step3 div.fieldset2 { position: relative; z-index: 0; }
#FormECard.step3 fieldset div.left { border: 1px solid #e6f5f3; }
#FormECard.step3 fieldset div.width1 { width: 378px; }
#FormECard.step3 fieldset div.wide { width: 852px; }
#FormECard.step3 fieldset div.required { background-color: #cae0dd; border: 1px solid #7dc1b2!important; }

#FormECard.step3 fieldset label.label2 { display: inline; margin: 0 0 6px 0; padding: 0; font: 1.1em Arial; color: #004e43; white-space: nowrap; }

/* Enter Your Contact Information */
#FormECard.step3 div.fieldset div.input-wrapper { display: block; margin: 0; padding: 0; width: 358px; overflow: hidden; }
#FormECard.step3 div.fieldset div.input-wrapper input, #FormECard.step3 div.fieldset div.input-wrapper img { float: left; }
#FormECard.step3 div.fieldset div.input-wrapper img.x-png { /* display: block; */ margin: 6px 0 0 5px; width: 11px; height: 11px; overflow: hidden; }
#FormECard.step3 div.fieldset div.input-wrapper img.check-png { /* display: block; */ margin: 6px 0 0 5px; width: 11px; height: 11px; overflow: hidden; }
#FormECard.step3 div.fieldset input.text1 { display: block; margin: 0; padding: 5px 5px 4px 10px; width: 325px; font-weight: bold; color: #343434; overflow: hidden; }
#FormECard.step3 div.fieldset input.text1 { border-top: none; border-right: 1px solid #b4b4b4; border-bottom: 1px solid #dadada; border-left: 1px solid #b4b4b4; background: url(../images/input-background.gif) left top repeat-x; }
#FormECard.step3 div.fieldset span.helper-text { display: block; margin: 0; padding: 0; font: 1.0em Verdana; color: #323b3a; }
#FormECard.step3 div.fieldset span.helper-text span.right { float: right; padding-right: 16px; }
#FormECard.step3 div.fieldset span.helper-text a { color: #000!important; }

#FormECard.step3 fieldset.submit { display: block; margin: 0px 0 30px 30px!important; padding: 0; width: 852px; overflow: hidden; }
#FormECard.step3 fieldset.submit div input { display: block; float: right; margin: 0 6px 0 0; padding: 0; width: 166px; height: 30px; font-size: 0; border: 0; background: url(../images/click-to-send-e-card.gif) top left no-repeat; overflow: hidden; }
#FormECard.step3 fieldset.submit div input  { cursor: hand; cursor: pointer; }
#FormECard.step3 fieldset.submit div input:hover { background-position: 0 -30px; }

/* ERROR MESSAGE */
#myJavascriptErrorStep3 { display: none; overflow: hidden; }

/* javascript error messages box with caution image and graphic header */
#FormECard.step3 div.errormsg { margin: 0 0 21px 0; padding: 15px 20px 15px 72px; border: 1px solid #c2c2c2; }
#FormECard.step3 div.errormsg { background: #ffffd6 /*#ffedf0*/ url(../images/error-caution.png) 17px 24px no-repeat; }
#FormECard.step3 div.errormsg #myJavascriptErrorStep3_message { display: block; margin: 0 0 6px 0!important; padding: 0; font: bold 1.6em Arial; color: #d70941; overflow: hidden; }
#FormECard.step3 div.errormsg #myJavascriptErrorStep3_items { display: block; margin: 0!important; overflow: hidden; }
#FormECard.step3 div.errormsg #myJavascriptErrorStep3_items span.item { display: block; font: 1.2em Arial; color: #d70941; padding: 0 0 0 13px; background: url(../images/plan-my-vacation/preview-availability4/more-information-bullet.png) left 3px no-repeat; }

#myJavascriptErrorStep3_notice { display: none; margin: 20px; padding: 15px 20px 15px 72px; border: 1px solid #c2c2c2; }
#myJavascriptErrorStep3_notice { background: #ffffd6 /*#ffedf0*/ url(../images/error-caution.png) 17px 15px no-repeat; }
#myJavascriptErrorStep3_notice span { font: 1.2em Arial; color: #d70941!important; }
#myJavascriptErrorStep3_notice span a { color: #d70941!important; }
#myJavascriptErrorStep3_notice span a:link, #myJavascriptErrorStep3_notice span a:visited { color: #d70941!important; }
#myJavascriptErrorStep3_notice span a:active, #myJavascriptErrorStep3_notice span a:hover { text-decoration: none;  }





/* THANK YOU */
#FormECard.thankyou { display: block; margin: 0 0 30px 0; padding: 0; width: 900px; }

#FormECard.thankyou fieldset { display: block; margin: 0; padding: 0; width: 900px; }

#FormECard.thankyou h2 { margin-top: 16px!important; font-size: 3.0em!important; }
#FormECard.thankyou a.return-to-the-pebble-beach-homepage { display: block; margin: 41px 0 13px 0; padding: 0; width: 227px; height: 68px; text-indent: -9999px; background: url(../../../templates/images/plan-my-vacation/plan-my-golf-vacation/thank-you/return-to-the-pebble-beach-homepage.gif) left top no-repeat; overflow: hidden; }
#FormECard.thankyou a.return-to-the-pebble-beach-homepage:hover { background-position: 0 -68px; }
#FormECard.thankyou p a.click-here:link, #FormECard.thankyou p a.click-here:visited { color: #944e2e!important; padding-left: 13px; background: url(../../../templates/images/icons/menu-bullet.gif) left 3px no-repeat!important; }
#FormECard.thankyou p a.click-here:active, #FormECard.thankyou p a.click-here:hover { text-decoration: none;   }




/* PICKUP */
#FormECard.pickup { display: block; margin: 0 0 30px 0; padding: 0; width: 900px; }

#FormECard.pickup fieldset { display: block; margin: 0; padding: 0; width: 900px; }

#pickup_container table.postcard-wrapper { border-collapse: collapse; border: 0; margin: 0; padding: 0; border-spacing: 0px; border-width: 0; }
#pickup_container table.postcard-wrapper tr { border-collapse: collapse; border: 0; margin: 0; padding: 0; border-spacing: 0px; border-width: 0; }
#pickup_container table.postcard-wrapper tr td { border-collapse: collapse; border: 0; margin: 0; padding: 0; border-spacing: 0px; border-width: 0; vertical-align: top!important; }

#pickup_container table.postcard-wrapper tr td.photo { width: 517px; }
#pickup_container table.postcard-wrapper tr td.message-wrapper { width: 262px; }

#pickup_container div.postcard-wrapper { display: block; margin: 12px 0 34px 0px; padding: 0; width: 862px; height: 311px; background: url(../images/pickup-background.gif) left top no-repeat; overflow: hidden; }
#pickup_container div.postcard-wrapper div.photo { display: block; margin: 12px 0 0 12px; padding: 0; width: 517px; height: 287px; overflow: hidden; }
#pickup_container div.postcard-wrapper div.message-wrapper { display: block; margin: 7px 0 0; padding: 0; width: 328px; height: 287px; overflow: hidden; }
#pickup_container div.postcard-wrapper div.message-wrapper div.postcard-logo { display: block; margin: 23px 0 24px 33px; padding: 0; width: 262px; height: 38px; }
#pickup_container div.postcard-wrapper div.message-wrapper div.message { display: block; margin: 0 0 0 33px; padding: 0; width: 262px; height: 160px; text-align: center; }
#pickup_container div.postcard-wrapper div.message-wrapper div.message span { font: italic 1.3em Georgia; color: #343434; text-align: center; }
#pickup_container div.postcard-wrapper div.message-wrapper div.address { display: block; margin: 0 0 0 33px; padding: 0; width: 262px; height: 47px; text-align: center; }
#pickup_container div.postcard-wrapper div.message-wrapper div.address span { font: 1.1em Arial; color: #343434; text-align: center; }

#FormECard.pickup a.find-us-on-facebook { display: block; margin: 0 0 13px 0; padding: 0; width: 243px; height: 83px; text-indent: -9999px; background: url(../images/find-us-on-facebook.gif) left top no-repeat; overflow: hidden; }
#FormECard.pickup a.find-us-on-face-book:hover { background-position: 0 -83px; }
#FormECard.pickup p a.click-here:link, #FormECard.pickup p a.click-here:visited { color: #944e2e!important; padding-left: 13px; background: url(../../../templates/images/icons/menu-bullet.gif) left 3px no-repeat!important; }
#FormECard.pickup p a.click-here:active, #FormECard.pickup p a.click-here:hover { text-decoration: none;   }

