Ok I did change the size of my pages as directed by someone, but promo custom html code still worked now this code doesn't work. WHY?
<!-- /* Style Definitions */ p.MsoNormal, li.MsoNormal, div.MsoNormal {mso-style-parent:""; margin:0in; margin-bottom:.0001pt; mso-pagination:widow-orphan; font-size:12.0pt; font-family:"Times New Roman"; mso-fareast-font-family:"Times New Roman";} @page Section1 {size:8.5in 11.0in; margin:1.0in 1.25in 1.0in 1.25in; mso-header-margin:.5in; mso-footer-margin:.5in; mso-paper-source:0;} div.Section1 {page:Section1;} -->
<div id="indexPhotoBorder">
<div id="indexPhotoLabel">
<div class="sys_title">Welcome to Living|Distracted!</div>
<div class="sys_promo">
<div class="subMenuOvr">
<div class="sys_tm_actions">
<div class="input_wrapper input_wrapper_input_set">
<div class="button_wrapper" style="margin-right: 14px;"><input class="form_input_submit bigJoinButton submit" onclick="window.open ('join.php','_self');" name="join" type="button" value="Join" />
<div class="button_wrapper_close"> </div>
</div>
<div class="button_wrapper"><input class="form_input_submit bigLoginButton submit" onclick="showPopupLoginForm(); return false;" name="login" type="button" value="Login" />
<div class="button_wrapper_close"> </div>
</div>
</div>
</div>
</div>
</div>
</div>
<div id="indexPhoto" style="overflow: hidden; position: relative;" onclick="location='join.php'"><img style="position: absolute; left: 0px; top: 0px; display: block;" src="media/images/promo/promo_p04.jpg" alt="" /></div>
</div>