body{
background:url(../images/bg.jpg) repeat 0 0;
font-family: "Helvetica Neue", Helvetica, Verdana, Arial, sans-serif;
}
p{
margin:0;
padding:0;
}
a{
text-decoration:none;
}
#step{
background:url(../images/steps-new.png) no-repeat 0 0;
height:660px;
margin:0 auto;
position:relative;
top:-8px;
width:1087px;
}
.steps_second_bg{
background:transparent url(../images/steps-second-bg.jpg) no-repeat scroll 0 0;
left:37px;
height:580px;
position:absolute;
top:52px;
width:1089px;
}
img.ecard{
left:33px;
position:absolute;
top:-51px;
z-index:100;
}
.send_card_steps{
position: relative;
height:580px;
width:511px;
float:left;
}
.send_card_steps img{
position:absolute;
left:112px;
top:133px;
}
.pick_card_slider{
background:transparent url(../images/first-slider-bg.png) no-repeat scroll 0 0;
height:557px;
width:435px;
margin:33px 0px 0px 4px;
float:left;
}
#scrollable{
overflow:hidden;
display:block;
position:absolute;
right:195px;
top:178px;
width:289px;
height:178px;
}
#scrollable .items{
width:20000em; 
position:absolute; 
}
#scrollable .items img{
float:left;
}
a.zoom{
background:transparent url(../images/zoom.png) no-repeat scroll 0 0;
height:27px;
position:absolute;
right:320px;
top:140px;
width:35px;
}
a:hover.zoom{
background-position: 0 -27px;
}
a.button_next{
background:transparent url(../images/button-next.png) no-repeat scroll 0 0;
height:81px;
position:absolute;
right:99px;
top:232px;
width:76px;
}
a.button_prev{
background:transparent url(../images/button-prev.png) no-repeat scroll 0 0;
height:81px;
position:absolute;
right:512px;
top:232px;
width:76px;
}
a:hover.button_prev, a:hover.button_next{
background-position: 0 -85px;
}
img.footer_logo{
border-style:none;
bottom:14px;
position:absolute;
right:256px;
}
/**********************************************************************
* STEP 2 ENTER YOUR MESSAGE
**********************************************************************/
.enter_your_message{
background:url(../images/enter-your-message.png) no-repeat 0 0;
height:388px;
left:326px;
position:absolute;
top:106px;
width:555px;
z-index:200;
}
.enter_your_message textarea, .share_your_card  textarea{
background-color:#FFF;
border:medium none;
color:#878787;
font-weight:bold;
height:110px;
left:70px;
padding:4px 0 0;
position:absolute;
top:123px;
width:391px;
}
.enter_your_message textarea{
height:140px !important;
}
a.preview_card{
background:url(../images/preview-card.png) no-repeat 0 0;
height:47px;
left:264px;
position:absolute;
top:304px;
width:193px;
}
a:hover.preview_card{
background-position: 0 -47px;
}
#card_creator{
position:absolute;
top:0;
left:0; 
width:100%; 
z-index:10000; 
background: url('../images/dim.png'); 
display:none; 
text-align:left; 
}
#edit_message{
padding-left: 111px;
width:181px;
background-image:url('../images/edit.png');
}
#refresh_images{
padding-left: 88px;
width:214px;
background-image:url('../images/refresh.png');
}
#done_editing{
padding-left: 88px;
width:214px;
background-image:url('../images/done.png');
}
a.card_editing{
background-position-x:right;
background-repeat:no-repeat;
margin: 10px 0px 20px 0px;
float:left;
overflow:hidden;
height:0px;
padding-top:47px;
display: block;
}
a.card_editing:hover{
background-position-y:-47px;
}
/**********************************************************************
* STEP 3 SHARE YOUR CARD
**********************************************************************/
.share_your_card{
background:url(../images/share-your-card.png) no-repeat 0 0;
height:398px;
left:326px;
position:absolute;
top:106px;
width:555px;
z-index:200;
}
.share_card{
cursor:pointer;
background:url(../images/button-share-card.png) no-repeat 0 0;
height:0px;
left:167px;
position:absolute;
top:211px;
width:193px;
z-index:200;
border: none;
padding-top: 47px;
overflow:hidden;
}
.share_card:hover{
background-position: 0 -47px;
}
.share_your_card form{
background:url(../images/blue-box.png) no-repeat 0 bottom;
color:#FFF;
font-family:verdana;
font-weight:bold;
height:166px;
left:75px;
padding:25px 12px 13px 12px;
position:relative;
margin:100px 0px 0px 0px;
width:383px;
}

#post_to_wall{
position:absolute;
bottom:13px;
}

#post_to_wall_label{
position:absolute;
bottom:13px;
left:37px;
}
.share_your_card img{
left:-59px;
opacity:0.65;
position:absolute;
top:292px;
z-index:200;
}

ul.holder{
color:#333;
position:relative;
width:345px;
background-color:#fff;
height:100px;
}
#fbinput_feed{
color:#333;
}
.facebook-auto{
width:356px;
color:#333;
}
/**********************************************************************
* STEP 4 THANK YOU PAGE
**********************************************************************/
.thank_you{
background:url(../images/thank-you-box.png) no-repeat 0 0;
height:401px;
left:326px;
position:absolute;
top:106px;
width:552px;
z-index:200;
}
.thank_you p{
background-color:#FFF;
color:#282828;
left:76px;
padding:12px 12px 27px 21px;
position:absolute;
top:204px;
width: 333px;
}
.thank_you > p > a{
color:#d8418d;
}
.thank_you > p > a:hover{
color:#046b80;
}
a.tweet_link{
background:url(../images/button-tweet-this.png) no-repeat 0 0;
height:47px;
left:258px;
position:absolute;
top:285px;
width:193px;
z-index:200;
}
a:hover.tweet_link{
background-position: 0 -47px;
}
.thank_you img{
position:absolute;
right:323px;
top:264px;
}
/**********************************************************************
* CARDS
**********************************************************************/
#card_wrap{
font-size:16px;
height:660px;
margin:0 auto;
position:relative;
top:-8px;
width:1087px;
}
.head_do_logo{
background:url(../images/card-header-logo.png) no-repeat 0 0;
height:115px;
margin:0 auto;
width:756px;
}
.head_do_logo p{
color:#3C3C3C;
display:block;
font-size:12px;
left:513px;
position:absolute;
top:9px;
}
.head_do_logo p a{
color:#3C3C3C;
display:inline-block;
font-size:14px;
font-weight:bold;
padding:13px 0 0 8px;
text-decoration:underline;
}
.head_do_logo p a:hover{
color:#d8078c;
}
/** card 1**/
.card_body01{
background:url(../images/cards/card01.gif) no-repeat 0 0;
height:527px;
left:73px;
position:absolute;
top:52px;
width:852px;
}
.card_body01 p{
color:#6E6E6E;
height:130px;
left:142px;
position:absolute;
top:221px;
width:281px;
}
.card_body01 .img1{
position:absolute;
right:248px;
top:228px;
z-index:200;
}
.card_body01 .img2{
position:absolute;
right:72px;
top:259px;
z-index:200;
}
/** card 2**/
.card_body02{
background:url(../images/cards/card02.gif) no-repeat 0 0;
height:527px;
left:140px;
position:absolute;
top:78px;
width:852px;
z-index:-1;
}
.card_body02 p{
color:#FFF;
height:130px;
left:400px;
position:absolute;
top:195px;
width:281px;
}
.card_body02 .img1{
left:50px;
position:absolute;
top:258px;
z-index:200;
}
.card_body02 .img2{
left:230px;
position:absolute;
top:317px;
z-index:200;
}
/** card 3**/
.card_body03{
background:url(../images/cards/card03.gif) no-repeat 0 0;
height:527px;
left:140px;
position:absolute;
top:78px;
width:852px;
z-index:-1;
}
.card_body03 p{
color:#282828;
font-size:18px;
height:130px;
left:110px;
position:absolute;
top:301px;
width:371px;
}
.card_body03 .img1{
left:127px;
position:absolute;
top:64px;
z-index:200;
}
.card_body03 .img2{
left:287px;
position:absolute;
top:64px;
z-index:200;
}
/** card 4**/
.card_body04{
background:url(../images/cards/card04.gif) no-repeat 0 0;
height:560px;
left:85px;
position:absolute;
top:72px;
width:878px;
z-index:-1;
}
.card_body04 p{
color:#282828;
font-size:18px;
height:130px;
left:410px;
position:absolute;
top:161px;
width:371px;
}
.card_body04 .img1{
left:448px;
position:absolute;
top:315px;
z-index:200;
}
.card_body04 .img2{
opacity:0.9;
position:absolute;
right:135px;
top:304px;
z-index:90;
}
/** card 5**/
.card_body05{
background:url(../images/cards/card05.gif) no-repeat 0 0;
height:535px;
left:85px;
position:absolute;
top:72px;
width:875px;
z-index:-1;
}
.card_body05 p{
color:#282828;
font-size:16px;
height:130px;
left:110px;
position:absolute;
top:209px;
width:371px;
}
.card_body05 .img1{
left:118px;
position:absolute;
top:315px;
z-index:200;
}
.card_body05 .img2{
left:291px;
position:absolute;
top:315px;
z-index:200;
}
/** card 6**/
.card_body06{
background:url(../images/cards/card06.gif) no-repeat 0 0;
height:527px;
left:85px;
position:absolute;
top:72px;
width:912px;
}
.card_body06 p{
color:#282828;
font-size:18px;
height:130px;
left:393px;
position:absolute;
top:173px;
width:433px;
}
.card_body06 .img1{
left:465px;
position:absolute;
top:311px;
z-index:200;
}
.card_body06 .img2{
left:631px;
position:absolute;
top:288px;
z-index:200;
}
/** card 7**/
.card_body07{
background:url(../images/cards/card07.gif) no-repeat 0 0;
height:527px;
left:85px;
position:absolute;
top:81px;
width:912px;
z-index:-1;
}
.card_body07 p{
color:#282828;
font-size:18px;
height:130px;
left:65px;
position:absolute;
top:181px;
width:473px;
}
.card_body07 .img1{
left:185px;
position:absolute;
top:268px;
z-index:200;
}
.card_body07 .img2{
left:327px;
position:absolute;
top:268px;
z-index:200;
}
/** card 8**/
.card_body08{
background:url(../images/cards/card08.gif) no-repeat 0 0;
height:527px;
left:-34px;
position:absolute;
top:4px;
width:952px;
z-index:-1;
}
.card_body08 p{
color:#282828;
font-size:18px;
height:130px;
left:535px;
position:absolute;
top:310px;
width:373px;
}
.card_body08 .img1{
position:absolute;
right:235px;
top:154px;
z-index:200;
}
.card_body08 .img2{
position:absolute;
right:83px;
top:129px;
z-index:200;
}
/** card 9**/
.card_body09{
background:url(../images/cards/card09.gif) no-repeat 0 0;
height:527px;
left:106px;
position:absolute;
top:61px;
width:952px;
z-index:-1;
}
.card_body09 p{
color:#FFF;
font-size:18px;
height:130px;
left:255px;
line-height:21px;
position:absolute;
top:329px;
width:373px;
}
.card_body09 .img1{
left:87px;
position:absolute;
top:138px;
z-index:200;
}
.card_body09 .img2{
position:absolute;
right:197px;
top:135px;
z-index:200;
}
/**********************************************************************
* Facebook
**********************************************************************/
#fbconnect{
position:absolute;
right:217px;
top:378px;
}

.active_item {
border: 1px solid #ff0000;
}

/* the overlayed element */ 
.overlay {      
display:none; 
z-index:10000; 
background-color: #333;
border:1px solid #666; 
-moz-box-shadow:0 0 90px 5px #000; 
-webkit-box-shadow:0 0 90px #000;     
} 

.overlay .close { 
background-image:url(../images/overlay/close.png); 
position:absolute; 
right:-15px; 
top:-15px; 
cursor:pointer; 
height:35px; 
width:35px; 
}

.overlay h2 {
color: #fff;
text-align: center;
font-size: 22px;
}