@import url("style/grp_btn_boy_girl_jpg.css");
@import url("style/grp_btn_gif.css");
@import url("style/grp_title_gif.css");

body {background:#024498;}
#container	 {width:899px;}
#leftcontent {margin-right:448px; height:632px;	background:  url("images/left.jpg") no-repeat right top;}
#rightcontent{margin-left: 449px; height:632px; background:  url("images/right.jpg") no-repeat left top;}
#logos {display:none; top:580px; left:60px;}
#tnc {top:580px; z-index:3; width: 760px; left:80px;}
#disclaimer	{ width: 700px;}

#sign01, #sign02, #sign03, #sign04, #sign05, #sign06, #sign_question,
#sign07, #sign08, #sign09, #sign10, #sign11, #sign12{ position:absolute; width:120px; height:100px; display:block; top:0px; left:0px;}

/* For en_US FTC rule move up */
.en_US #container, .en_US #leftcontent, .en_US #rightcontent { margin-top:0px;}
.en_US .form_bg1 {padding-top:20px;}

/* Title */
#title_image span {display:none;}	/* For use Image title*/
#subtitle_image, #subtitle_image span {display:none;}	/* For use Image subtitle*/

#title_image {width:899px; height:152px; top:0px; left:0px;}

#inputzone { width:520px; height:390px; background: url("images/inputzone_bg.gif") no-repeat left top; filter:none; }
#inputzone_pre { z-index:0; width:520px; height:390px; background: url("images/inputzone_bg.gif") no-repeat left top; }
#inputzone.form_bg2 { top:120px; background: url("images/inputzone_bg2.gif") no-repeat left top;}

.cs_CZ #inputzone.form_bg2 {padding-top:40px;}

.en_US input.phonearea { font-size:36px; height:40px; width:80px; }
.en_US input.phoneprefix { font-size:36px; height:40px; width:80px; }
.en_US input.phonesuffix { font-size:36px; height:40px; width:105px; }

.en_GB #msisdn { font-size:36px; height:40px; width:240px; }
.en_IE #msisdn { font-size:36px; height:40px; width:240px; }


#inputzone_pre.form_bg0	{ text-align:left;}
.form_bg0 #inputtext1, .form_bg1 #inputtext1	{padding-left:28px; font:Verdana, Arial, Helvetica, sans-serif; text-align:left; }
.form_bg0 #inputtext1	{ margin:10px auto 0 20px;	height:32px;	font-size:24px; background: url("images/ico_1.gif") no-repeat left top; }
.form_bg1 #inputtext1	{ margin:0 auto 0 80px;	width:400px; height: 40px; font-size:17px; background: url("images/ico_3.gif") no-repeat left top; text-transform:none; font-weight:bold; letter-spacing:-1px; }

#inputname	{ text-align:center;}	#inputname input	{ border:1px solid #044798; height:35px;}
#inputphone	{ margin-top:70px; }

/* layout */
#image03 {width: 190px;	height: 480px;	top: 152px;	left:0px;   background: url("images/mainbg01.jpg");}
#image04 {width: 520px;	height: 480px;	top: 152px;	left:190px; background: url("images/mainbg02.jpg");}
#image05 {width: 189px;	height: 480px;	top: 152px;	left:710px; background: url("images/mainbg03.jpg");}
#image06 {width: 190px;	height: 480px;	top: 152px;	left:0px;   background: url("images/girl_off.jpg");}
#image07 {width: 189px;	height: 480px;	top: 152px;	left:710px; background: url("images/boy_off.jpg");}
#image06.on {background: url("images/girl_on.jpg");}	/* Please use this "class=on" to turn on user select */
#image07.on {background: url("images/boy_on.jpg");}		/* Please use this "class=on" to turn on user select */

/* BEGIN Asian photo for ID, MY, SG, TW */
.id_ID #image06,
/*.ms_MY #image06, .en_MY #image06,*/
.en_SG #image06,
.zh_TW #image06 {background: url("images/girl_asian_off.jpg");}

.id_ID #image06.on,
/*.ms_MY #image06.on, .en_MY #image06.on,*/
.en_SG #image06.on,
.zh_TW #image06.on {background: url("images/girl_asian_on.jpg");}

.id_ID #image07,
.ms_MY #image07, .en_MY #image07,
.en_SG #image07,
.zh_TW #image07 {background: url("images/boy_asian_off.jpg");}

.id_ID #image07.on,
.ms_MY #image07.on, .en_MY #image07.on,
.en_SG #image07.on,
.zh_TW #image07.on {background: url("images/boy_asian_on.jpg");}
/* END Asian photo for ID, MY, SG, TW */

#image08, #image09, #image11, #image12, #image13, #image14, #image15 {display:none;}
.imagestep_pre1 #image06, .imagestep_pre1 #image07 { display:none;}

/* for en_US bubble text -1, 2, 3*/
#image10 {width: 268px;	height: 102px;	top: 155px;	left:440px;}
.imagestep2 #image10 { top:90px;}
.en_US .imagestep1 #image10, .en_US .imagestep2 #image10 {z-index:3; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader (src='/assets/51501/images/bubble_en_us.png' sizingMethod='scale');}
html>body.en_US .imagestep1 #image10, html>body.en_US .imagestep2 #image10 {background: url("images/bubble_en_us.png") no-repeat left top; filter:none;}

/* For Horoscoeop New prestep */
/* Horoscope Landing new pre-step*/
#select_gender_txt {position:absolute; z-index:2; text-align:center;}
#select_gender_txt span {font-size:26px; float:left;}
#select_gender_btn {position:absolute; z-index:2; text-align:center;}
#select_gender_btn span {display:none;}

#select_sign				{position:absolute; z-index:2;	text-align: center;}
#select_sign a				{text-decoration:none;	font-size:10px;} /*sign date*/
#select_sign h3				{font-size:12px;} /*sign name*/


#select_gender_txt	{border:0px; width:417px; height:44px; top:108px; left:255px; padding-top:4px;
 filter:progid:DXImageTransform.Microsoft.AlphaImageLoader (src='/assets/51501/images/gender_txtbg.png' sizingMethod='scale');}
html>body #select_gender_txt	{background: url("images/gender_txtbg.png") no-repeat left top;filter:none;}
#select_gender_txt span	{margin:0 0 0 0;	padding:0 0 0 0; float:none;}

#select_gender_btn	{top:132px;	left:160px;	width:600px;	height:420px;}
a#gender_guy	{ width:308px; height:418px; float:left; position: absolute; left:292px; background: url("images/btn_guy.jpg") no-repeat left top;}
a#gender_girl	{ width:292px; height:418px; float:left; position: absolute; left:5px; top:1px; background: url("images/btn_girl.jpg") no-repeat left top;}

.imagestep_pre1 a:hover#gender_guy  { background: url("images/btn_guy_over.jpg") no-repeat left top; border:none;}
.imagestep_pre1 a:hover#gender_girl	{ background: url("images/btn_girl_over.jpg") no-repeat right top; border:none;}

/* For Sign Select*/
#select_sign {top: 200px;	left:190px;	width: 520px;	height:330px;}
#select_sign h3 {margin:0px auto 0 auto;}
#select_sign a span, #select_sign a h3 { display:none;}
#select_sign #inputbutton { margin-top:300px;}

#sign_question	{top:8px; left:16px;	width:80%; height:35px; padding-left:40px;
				font:24px Arial,Helvetica,sans-serif; font-weight:bold; text-align:left;
				background: url("images/ico_2.gif") no-repeat left top;}

#sign01, #sign02, #sign03, #sign04, #sign05, #sign06, #sign07, #sign08, #sign09, #sign10, #sign11, #sign12 {text-align: center; width:76px; height: 111px;}
#sign01	{top:46px;  left:20px; background: url("images/sign_01_aries.jpg") no-repeat left top;}  /*Aries (3/21-4/19)*/
#sign02	{top:46px;  left:100px;	background: url("images/sign_02_taurus.jpg") no-repeat left top;}  /*Taurus (4/20-5/20)*/
#sign03	{top:46px;  left:180px; background: url("images/sign_03_gemini.jpg") no-repeat left top;}  /*Gemini (5/21-6/21)*/
#sign04	{top:46px;  left:260px; background: url("images/sign_04_cancer.jpg") no-repeat left top;}  /*Cancer (6/22-7/22)*/
#sign05	{top:46px; left:340px; background: url("images/sign_05_leo.jpg") no-repeat left top;}  /*Leo (7/23-8/22)*/
#sign06	{top:46px; left:420px;	background: url("images/sign_06_virgo.jpg") no-repeat left top;}  /*Virgo (8/22-9/22)*/
#sign07	{top:160px; left:20px;	background: url("images/sign_07_libra.jpg") no-repeat left top;}  /*Libra (9/23-10/22)*/
#sign08	{top:160px; left:100px;	background: url("images/sign_08_scorpio.jpg") no-repeat left top;}  /*Scorpio (10/23-11/21)*/
#sign09	{top:160px; left:180px;	background: url("images/sign_09_sagittarius.jpg") no-repeat left top;}  /*Sagittarius (11/22-12/21)*/
#sign10	{top:160px; left:260px;	background: url("images/sign_10_capricorn.jpg") no-repeat left top;}  /*Capricorn (12/22-1/19)*/
#sign11	{top:160px; left:340px;	background: url("images/sign_11_aquarius.jpg") no-repeat left top;}  /*Aquarius (1/20-2/18)*/
#sign12	{top:160px; left:420px;	background: url("images/sign_12_pisces.jpg") no-repeat left top;}  /*Pisces (2/19-3/20)*/
:hover#sign01	{background-image:url("images/sign_01_aries_over.jpg");}  /*Aries (3/21-4/19)*/
:hover#sign02	{background-image:url("images/sign_02_taurus_over.jpg");}  /*Taurus (4/20-5/20)*/
:hover#sign03	{background-image:url("images/sign_03_gemini_over.jpg");}  /*Gemini (5/21-6/21)*/
:hover#sign04	{background-image:url("images/sign_04_cancer_over.jpg");}  /*Cancer (6/22-7/22)*/
:hover#sign05	{background-image:url("images/sign_05_leo_over.jpg");}  /*Leo (7/23-8/22)*/
:hover#sign06	{background-image:url("images/sign_06_virgo_over.jpg");}  /*Virgo (8/22-9/22)*/
:hover#sign07	{background-image:url("images/sign_07_libra_over.jpg");}  /*Libra (9/23-10/22)*/
:hover#sign08	{background-image:url("images/sign_08_scorpio_over.jpg");}  /*Scorpio (10/23-11/21)*/
:hover#sign09	{background-image:url("images/sign_09_sagittarius_over.jpg");}  /*Sagittarius (11/22-12/21)*/
:hover#sign10	{background-image:url("images/sign_10_capricorn_over.jpg");}  /*Capricorn (12/22-1/19)*/
:hover#sign11	{background-image:url("images/sign_11_aquarius_over.jpg");}  /*Aquarius (1/20-2/18)*/
:hover#sign12	{background-image:url("images/sign_12_pisces_over.jpg");}  /*Pisces (2/19-3/20)*/

#sign01 h3 { margin:68px 0 0 0;}
#sign02 h3 { margin:68px 0 0 0;}
#sign03 h3 { margin:68px 0 0 0;}
#sign04 h3 { margin:68px 0 0 0;}
#sign05 h3 { margin:68px 0 0 0;}
#sign06 h3 { margin:68px 0 0 0;}
#sign07 h3 { margin:68px 0 0 0;}
#sign08 h3 { margin:68px 0 0 0;}
#sign09 h3 { margin:68px 0 0 0;}
#sign10 h3 { margin:68px 0 0 0;}
#sign11 h3 { margin:68px 0 0 0;}
#sign12 h3 { margin:68px 0 0 0;}

/* for arrow_l and arrow_r */
.imagearrowl  {width:17px;  height:15px; }		.imagearrowr  {width:17px;	height:15px;}
.form_bg1 .imagearrowl, .form_bg1 .imagearrowr  {display:none;}
/* Alert */
#alert		 				{margin-left:-90px;}
html>/*Not IE 7*/body #alert{margin-left:50px;}/*Modern browsers only (not IE 7) */
.form_bg1 #alert		 				{margin-left:-90px;}
html>/*Not IE 7*/body .form_bg1 #alert{margin-left:-20px;}/*Modern browsers only (not IE 7) */
.form_bg1 #checkboxa 		{ background-color: transparent;} .form_bg1 #alert { display:none;}
.form_bg2 #inputcheckbox	{ display:none;}

/* for submit button */
/* html page a,b,c */
.imagesubmit {	border:0px;	width:237px;	height:85px;	background-image: url("images/submit_en_us.gif");}
html>body .imagesubmit {background-image: url("images/submit_en_us.gif");}
:hover.imagesubmit{background-position:0px 85px;}


/* Input zone and input field */
.imagestep_pre1 #inputzone { display:none;}
#inputzone, #inputzone_pre { position: absolute; top:100px; left:190px; }
.form_bg1{padding-top:10px;} 	.form_bg2{padding-top:60px;}

INPUT.phonearea,INPUT.phoneprefix, INPUT.phonesuffix, .password, .mobileTextField
  { color:#134779; background-color: #FFFFFF; width:80px; height:40px; border:2px solid #000000; font-size:30px;}
.mobileTextField { width:180px; }
#inputname #username { font-size:28px; width: 260px; margin: 5px 0px 15px 0px;}
#inputname {z-index:5;}
#username {z-index:6;}

#operatorlist	{color:#000000;} /*Select Your Carrier*/
#inputtext1		{color:#FFFFFF;} /*Enter Your Cell Phone Number */

#select_gender_txt span	{ color:#FFFFFF;}	/* Select Gender */
#select_sign a			{ color:#8bc2f7;}
#select_sign a:hover, #select_sign a:hover span{ color:#FFFFFF;}
#select_sign span		{ color:#8bc2f7;  letter-spacing:-1px;}
#sign_question	{ color:#FFFFFF; letter-spacing:-1px;}

#countrycode, .hyphen { color: #FFFFFF; } /* (+44) */

#inputtext4 { color: #FFFFFF; margin-top: 6px;} /* Funmobile has sent the 4-digit password in a text message to your cell phone. */
#inputtext5 { color: #FFFFFF; } /* Where should we send your ringtones */
.fstyle1 { color: #FFFFFF; } /* We are now sending you the PIN to : 123-456-7890 */
.fstyle2 { color: #FFFFFF; } /* +44 1234567890 */
.fstyle3 { color: #FFFFFF; font-size: 10px;} /* Please check your phone. Just enter the PIN below. */
.fstyle4 { color: #FFFFFF; }
.fstyle4a { color: #FFFFFF; } /*You should have received your password now.*/
.fstyle4b { color: #FFFFFF; } /* Enter the PIN below. Alternatively, you can */
.fstyle5 { color: #FFFFFF; } /* text YES to 71769 / Send the text with OK to 88838 */
.fstyle6 { color: #FCFF00; } /* Yes 71769 / OK 88838 */
.fstyle7 { color: #FFFFFF; } /* You will now receive instructions SMS from 88838  */

/* for oppc font style */
.fstyle8  { color: #000000; } /*right text*/
.fstyle9  { color: #000000; } /*right text "Reply"*/
.fstyle10 { color: #ce0000; } /*right text "YES"*/
.fstyle11 { color: #ffffff; } /*phone text "Reply"*/
.fstyle12 { color: #000099; } /*phone text "YES""*/
.fstyle13 { color: #000000; } /*Do not close this window!*/
#oppc_text2 span {background-color:#ffcc00;} /*Reply "YES" background color"*/
#oppc { margin-left: 55px; }

.demo_steps_text { color: #FFFFFF; }
#term_text { color: #FFFFFF; } /* I've read the terms and conditions */
.chkbox_color_text,.chkbox_color_link { color: #FFFFFF; } /* check box text */
#disclaimer, a.unsub, a.blacklink { color:#FFFFFF; z-index:2; } /* T&C text */

#subtitle1, #subtitle2 {position:absolute; display:block; left:100px; width:700px; z-index:10;}
.imagestep0 #subtitle1 {display:none;}

/* country specific */
.en_GB  #subtitle1 { display: none; color: #000;  right: 40px; top: 0; }
.en_GB .imagestep1 #subtitle1 { display: block; }

.en_CA #tnc {top:500px;}

.en_IE  #subtitle1 { display: none; color: #000;  right: 40px; top: 0; }
.en_IE .imagestep1 #subtitle1 { display: block; }

.en_ZA  #subtitle1, .en_ZA #subtitle2 { display: none; color: #000;  right: 0; top: 0; }
.en_ZA .imagestep1 #subtitle1 { display: block; }

/* BEGIN for title spanning two lines */
.de_AT #select_gender_txt,
.de_CH #select_gender_txt, .fr_CH #select_gender_txt, .it_CH #select_gender_txt,
.el_GR #select_gender_txt,
.et_EE #select_gender_txt,
.fr_FR #select_gender_txt,
.fr_LU #select_gender_txt,
.hu_HU #select_gender_txt,
.lt_LT #select_gender_txt,
.lv_LV #select_gender_txt,
.nl_NL #select_gender_txt,
.pl_PL #select_gender_txt,
.sk_SK #select_gender_txt,
.sl_SI #select_gender_txt,
.zh_TW #select_gender_txt,
.uk_UA #select_gender_txt
 {top:535px; background: url("images/gender_txtbg_up.png") no-repeat left top; filter:none;}
 


.de_AT #inputzone, .de_AT #inputzone_pre,
.de_CH #inputzone, .de_CH #inputzone_pre, .fr_CH #inputzone, .fr_CH #inputzone_pre, .it_CH #inputzone, .it_CH #inputzone_pre,
.el_GR #inputzone, .el_GR #inputzone_pre,
.et_EE #inputzone, .et_EE #inputzone_pre,
.fr_FR #inputzone, .fr_FR #inputzone_pre,
.fr_LU #inputzone, .fr_LU #inputzone_pre,
.hu_HU #inputzone, .hu_HU #inputzone_pre,
.lt_LT #inputzone, .lt_LT #inputzone_pre,
.lv_LV #inputzone, .lv_LV #inputzone_pre,
.nl_NL #inputzone, .nl_NL #inputzone_pre,
.pl_PL #inputzone, .pl_PL #inputzone_pre,
.sk_SK #inputzone, .sk_SK #inputzone_pre,
.sl_SI #inputzone, .sl_SI #inputzone_pre,
.zh_TW #inputzone, .zh_TW #inputzone_pre,
.uk_UA #inputzone, .uk_UA #inputzone_pre
 {top:155px;}
 
.de_AT #select_sign,
.de_CH #select_sign, .fr_CH #select_sign, .it_CH #select_sign,
.el_GR #select_sign,
.et_EE #select_sign,
.fr_FR #select_sign,
.fr_LU #select_sign,
.hu_HU #select_sign,
.lt_LT #select_sign,
.lv_LV #select_sign,
.nl_NL #select_sign,
.pl_PL #select_sign,
.sk_SK #select_sign,
.sl_SI #select_sign,
.zh_TW #select_sign,
.uk_UA #select_sign
 {top:255px;}
/* END for title spanning two lines */
 
.de_AT .imagestep1 #subtitle1, .de_AT #subtitle2 {display:block; left:100px;}
.de_AT #select_gender_txt {padding-top:9px;} .de_AT #select_gender_txt span {font-size:19px;}

.de_CH #subtitle1, .de_CH #subtitle2 {display:block; left:100px;}
.fr_CH #subtitle1, .fr_CH #subtitle2 {display:block; left:100px;}
.it_CH #subtitle1, .it_CH #subtitle2 {display:block; left:100px;}
.de_CH #select_gender_txt {padding-top:9px;} .de_CH #select_gender_txt span {font-size:19px;}
.fr_CH #select_gender_txt {padding-top:9px;} .fr_CH #select_gender_txt span {font-size:19px;}

.el_GR .imagestep1 #subtitle1, .el_GR #subtitle2 {display:block; left:100px;}

.et_EE .imagestep1 #subtitle1, .et_EE #subtitle2 {display:block; left:100px;}

.fr_LU #select_gender_txt span {letter-spacing:-1px;}

.hu_HU .imagestep1 #subtitle1, .hu_HU #subtitle2 {display:block; left:100px;}

.id_ID .imagestep1 #subtitle1, .id_ID #subtitle2 {display:block;}
.id_ID #logos {display:block;} .id_ID #tnc {margin-top:50px;}

.lt_LT .imagestep1 #subtitle1, .lt_LT #subtitle2 {display:block; left:100px;}
.lt_LT .imagestep2 .form_bg2 {padding-top: 35px;}

.lv_LV .imagestep1 #subtitle1, .lv_LV #subtitle2 {display:block; left:100px;}
.lv_LV #logos {display:block;} .lv_LV #tnc {margin-top:60px;}

.nl_NL #subtitle1, .nl_NL #subtitle2 {top:123px; text-align:center;}

.sk_SK .imagestep1 #subtitle1, .sk_SK #subtitle2 {display:block; left:100px;}

.sl_SI .imagestep1 #subtitle1, .sl_SI #subtitle2 {display:block; left:100px;}

.zh_TW #subtitle1, .zh_TW #subtitle2 {font-size:12px;}