*{
	margin: 0;
	padding: 0;
}
body{
	text-align: center;
	min-width: 775px;
	font-family: "Trebuchet MS",arial,sans-serif;
	background-color: #FFFFFF;
}
#wrapper{
	margin:0 auto;
	width:995px;
	text-align: left;
	background-color: #FFFFFF;
}
div#header,div#footer{
	padding: 12px;
	font-size: 13px;
	margin: 10px 10px 10px 10px;
	margin: expression((1+1==2) ? "10px 10px 10px 20px" : "10px 10px 10px 20px");
	width: 930px;
	clear: left;
}
div#header{
	font-weight: bold;
	background-color: #4337AA;
	color: #FFFFFF;
}
div#footer{
    text-align: center;
	background-color: #4337AA;
	color: #FFFFFF;
}
div#footer a:hover{
	text-decoration: underline;
	color: #FFFFFF;
}
div#footer a{
	color: #FFFFFF;
	text-decoration: none;
}
div#header h1{
  font-size: 26px;
	font-weight: bold;
	float: left;
}
div#header h2{
	font-size: 15px;
	font-weight: bold;
	clear: both;
}
div#main-content h1{
	font-size: 22px;
	margin-bottom: 15px;
	color: #31287F;
}
div#main-content h2{
	font-size: 20px;
	margin-bottom: 15px;
	color: #31287F;
}
div#main-content{
	background-color: #D6E7ED;
	color: #000000;
	padding: 20px;
	font-size: 16px;
	margin-top: 0px;
	margin-left: 10px;
	float: left;
	width: 720px;
	text-align: justify;
}
div#main-content a{
	color: #31287F;
	text-decoration: none;
}
div#main-content a:hover{
	color: #0000FF;
	text-decoration: none;
}
div#sidebar{
	background-color: #D6E7ED;
	padding: 10px 0px;
	font-size: 16px;
	margin-top: 0px;
	margin-left: 10px;
	float: left;
	width: 180px;
}
div#sidebar a{
    padding: 2px 10px;
	text-decoration: none;
	color: #31287F;
	display: block;
	border-bottom: #DFC1F3 solid 1px;
	border-left: #D6E7ED solid 1px;
	border-right: #D6E7ED solid 1px;
	font-size: 16px;
}
div#sidebar a:hover{
	background-color: #FFFFFF;
	border-left: #EEE6F3 solid 1px;
	border-right: #EEE6F3 solid 1px;
}
div#sidebar hr{
    margin: 0px;
	padding: 0px;
}
li.navbar,li.navbarSelected{
	float: left;
	list-style-type: none;
}
li.navbar a,li.navbarSelected a{
	display: block;
	font-size: 16px;
	margin: 0px 2px;
	padding: 10px;
	width: 100px;
	text-align: center;
	font-weight: bold;
	text-decoration: none;
}
li.navbar a{
	background-color: #4337AA;
	color: #FFFFFF;
	border-bottom: solid 1px #4337AA;
}
li.navbarSelected a{
	background-color: #D6E7ED;
	color: #4337AA;
	border-bottom: solid 1px #D6E7ED;
}
li.navbar a:hover{
	background-color: #D6E7ED;
	color: #4337AA;
	border-bottom: dashed 1px #4337AA;
}
li.navbarSelected a:hover{
	background-color: #D6E7ED;
	color: #4337AA;
	border-bottom: solid 1px #D6E7ED;
}
ul#navbar{
	padding: 0px 8px;
	padding: expression((1+1==2) ? "0px 18px" : "0px 18px");
}			


/* -------------------------------------------  Author : Hesham G.  -------------------------------------------- */
/* -------------------------  This section contains all the static css styling i made  ------------------------- */

/* ---------------------------------------------- General ------------------------------------------------------ */
html {  /* .......................................................... Force always showing the vertical scroll bar in the browser for the sliding effects */
   overflow-y:scroll;
}

img {  /* ........................................................... By default don't put borders for any image */
	border: 0px;
}

ul {  /* ............................................................ Fix bullets cross-browsing problem in IE  */
	_list-style-position: inside;
}

.download_descrip {  /* ............................................. Description label for download pages */
	float: left;
	margin: 0 0 10px 20px;
}

.blue_block {  /* ................................................... Any blue block with white text inside it */
	padding: 40px;
	margin: 20px 30px 0 40px;
	background-color: #4337AA;
	color: #FFFFFF;
}

.page_icon {  /* .................................................... The icon of the page header title */
	vertical-align: -6px;
	padding-right: 5px;
}

.header_new_version_link {
	text-decoration: none;
	color: white;
	cursor: pointer;
}

.header_new_version_link:hover {
	color: black;
}

.header_new_version {  /* ........................................... The header new version announcement image */
	position: absolute;
	margin: -45px 20px 0 620px;
	padding : 5px 15px 5px 15px;
	
	width: 260px;
	background-color: red;
	font: bold 120% 'Comic Sans MS',sans-serif; 
}

.bold_text {  /* .................................................... Just a bold text */
	font-weight: bold;
}

.horiz_tab1 {  /* ................................................... Sometimes we need to indent object horizontally */
	padding-left: 15px;
}

.horiz_tab2 {  /* ................................................... Sometimes we need to indent object horizontally */
	padding-left: 28px;
}

.horiz_tab3 {  /* ................................................... Sometimes we need to indent object horizontally */
	padding-left: 45px;
}

.vert_tab1 {  /* .................................................... Sometimes we need to indent object vertically */
	vertical-align: -3px;
}

.vert_tab2 {  /* .................................................... Sometimes we need to indent object vertically */
	vertical-align: -8px;
}

/* ------------------------------------------ End of General --------------------------------------------------- */


/*----------------------------------------- Links general styling -----------------------------------------------*/
a.sidebarSelected {  /* ............................................. Selected sidebar styling */
	background-color: #FFFFFF;
}

.underline_link {  /* ............................................... Some links need to be underlined for better look */
	border-bottom: dotted 1px;
}

.home_link {  /* .................................................... The header title/img link that redirects the user to Home Page */
	color: #FFFFFF;
	text-decoration: none;
}

.send_block {  /* ................................................... The send block(button + loading image) */ 
	margin-left: 480px;
}

.button_link {  /* .................................................. A custom button link */
	margin: 0 10px 0 0;
	padding: 0 20px 0 20px;
	
	font: bold 84% 'trebuchet ms',helvetica,sans-serif; 
	color: #4337AA;
	background-color: #D6E7ED; 
	border: 2px solid; 
  border-color: white; 
}

.loading {  /* ...................................................... A loading label for Ajax requests for links */ 
	display: none;
	position: absolute;

	padding-top: 3px;
  height:28px;   
  width:28px;   
} 

/*-------------------------------------- End of Links general styling -------------------------------------------*/


/*----------------------------------------- Table general styling -----------------------------------------------*/
.table_div {  /* .................................................... The div containing the table */
	margin-left: 90px;
}

table {  /* ......................................................... The table */
	margin: 30px 20px 40px 20px;
	font-family: Georgia, Times, Tahoma;
	
	border-top: 1px solid #000000;
	border-bottom: 1px solid #000000;
	border-left: 1px dashed #000000;
	border-right: 1px dashed #000000;
	
	border-spacing: 0px; 
  *border-collapse: expression('separate', cellSpacing = '0px');  // For I.E
}

.table_title {  /* .................................................. The header of the table */
	background-color: #4337AA;
  color: white; 
	text-align: center;
}

th {  /* ............................................................ The table headers cells */
	border-top: 1px solid #000000;

	padding: 10px 10px 10px 20px;
	vertical-align: center;
	font-size: 14px;
}

td {  /* ............................................................ The table data cells */
	border-top: 1px solid #000000;
	font-family:Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 12px;

	padding: 10px 10px 10px 20px;
	vertical-align: center;
}

.odd-class {  /* .................................................... Table odd cells */
	background: #D6E7ED;
}

.even-class {  /* ................................................... Table even cells */
	background: #FFFFFF;
}
/*-------------------------------------- End of Table general styling -------------------------------------------*/


/*------------------------------------------ Hint general styling -----------------------------------------------*/
.hint_block {
	margin: -5px 50px 30px 60px;
	padding: 30px;
	
	font-size: 13px;
	background-color: #4337AA;
	color: #FFFFFF;
	text-align: center;
}

.hint_title_block {
	text-align: left;
	margin: -10px 0 -5px 7px;
	font-size: 18px;
}

.hint_title_block span {
	position: absolute;
	margin: 4px 0 0 7px;
}
/*-------------------------------------- End of Hint general styling --------------------------------------------*/

/* ---------------------------------------------- General form ------------------------------------------------- */

.form_header {  /* .................................................. An optional header at the top of the form */
	text-align: left;
	margin: 0 0 10px -25px;
	font-weight: bold;
	font-size: 12px;
}

.form_label {  /* ................................................... The labels of all form controls */
	float: left;
	width: 100px;
	font-weight: bold;
	vertical-align: top;
}

.form_text_field {  /* .............................................. The form text field controls */
	width: 200px;
	margin-bottom: 7px;
	font-family: Georgia, Arial;
}

.form_text_area {  /* ............................................... The form text area controls */
	width: 450px;
	height: 200px;
	border: 2px solid #999;
	font-family: Georgia, Arial;
}

.form_control_block {  /* ........................................... A form control block */
	margin-bottom: 17px;
}

.required {  /* ..................................................... The required label(*) */
	color: red;
	vertical-align: top;
	font-size: 20px;
}

.invalid {  /* ...................................................... The invalid label */
	display: none;
	font-family: Georgia, Arial;
	font-size: small;
	color: yellow;
	padding-left: 100px;
}

.error_msgs {
	margin: 0 0 0 90px;
	height: 30px;
}

.form_reset {  /* ................................................... The Reset form button */
	display: none;
}
/*------------------------------------------ End of general form -----------------------------------------------*/

/* --------------------------------- overview.php - Home ------------------------------------- */
.banner {
	width: 450px;
	height: 270px;
	margin: 10px 0px -40px 39px;
}

.download_trial {
	width: 150px;
	position: relative;
	top: -220px;
	left: 580px;
	margin-bottom: -100px;
	clear: left;
	font-size: large;
}

.download_trial img {
	margin-left: 12px;
	_margin-left: 6px;  /* Applies to IE(6) and below */
}

.Watch_video_block {
	margin-left: 500px;
}

.watch_video_link {
	vertical-align: 12px;
}

/* -------------------------------------- features.php ------------------------------------------- */

.features {
	margin-left: 10px;
}

.feature_icon {
	vertical-align: middle; 
	margin: 0 12px 5px 10px;
	float: left;
}

.long_feature_icon {
	padding-bottom: 33px;
}

/* ------------------------------------ reviews.php ------------------------------------------ */

.review_hint_icon {
	position: absolute;
	margin: 10px 0 0 7px;
}

.review_hint {
	margin: 10px 30px 0 40px;
	font-size: 15px;
	padding: 7px;
	border: 1px solid #4337AA;
}

.reviews_table, .reviews_table td {
	border: none;
}

.review_text {  /* .................................................. Review all inner text */
	position: absolute;
	width: 240px;
	margin: 80px 0 0 30px;
	font-family: "Comic Sans MS";
	font-size: 17px;
	
	/* Rotate the text by 3 degrees in all browsers */
	-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.99862953, M12=0.05233596, M21=-0.05233596, M22=0.99862953,sizingMethod='auto expand')";
	filter: progid:DXImageTransform.Microsoft.Matrix(M11=0.99862953, M12=0.05233596, M21=-0.05233596, M22=0.99862953,sizingMethod='auto expand');
	-moz-transform:  matrix(0.99862953, -0.05233596, 0.05233596, 0.99862953, 0, 0);
	-webkit-transform:  matrix(0.99862953, -0.05233596, 0.05233596, 0.99862953, 0, 0);
	-o-transform:  matrix(0.99862953, -0.05233596, 0.05233596, 0.99862953, 0, 0);
}

.review_signature {  /* ............................................. Review signature text */
	margin: 40px 0 0 0;
	font-family: Georgia;
	font-size: 13px;
}

.review_signature, x:-moz-any-link {  /* ............................ Review signature text - Mozilla only */
	font-family: "Comic Sans MS";
	font-weight: bold;
}

.smile_img {  /* .................................................... Smiley image used in some Alerts */
	position: absolute;
	padding: -3px 0 0 5px;
}

.new_review_block {  /* ............................................. The new review block(bg image + text) */
	margin: -40px 60px -20px 60px;
}

.new_review_block .review_text {  /* ................................ The new review text */
	width: 460px;
	padding: 80px 40px 40px 40px;
	_padding-left: 20px;  /* IE only */
}

.new_review_form_label {  /* ........................................ The labels of all form controls */
	font-weight: normal;
}

.new_review_required {  /* .......................................... The required label */
	position: absolute;
	margin-left: 3px;
}

.new_review_send_block {  /* ........................................ The send block(button + loading image) */ 
	margin-left: 380px;
}

.review_invalid {  /* ............................................... An invalid field in the form. */
	color: red;
}

.review_loading {  /* ............................................... A loading label for Ajax requests for links */ 
	margin: -100px 0 0 120px; 
} 

/* ------------------------------------ trialVsPro.php ------------------------------------------ */

.trial_note {  /* ................................................... Table cell note */
	text-align: center;
	font-size: 10px;
}

/* ------------------------------------ release_log.php ------------------------------------------ */

.release_note {  /* ................................................. The registered users div note */
	margin: 0 30px 25px 30px;
	padding: 25px;
	
	text-align: center;
	font: 15px Comic Sans, Georgia, sans-serif;
}

.logs_links {  /* ................................................... The log page upper links */
	margin: 0 0 10px 65px;
	font: 12px Comic Sans, Georgia, sans-serif;
}

.logs_link {  /* .................................................... Each log page upper link */
	margin: 0 8px 0 10px;
}

.release_logs {  /* ................................................. All the logs page content div */
	float: left;
	margin: 0 20px 5px 20px;
}

.release_log {  /* .................................................. Each log div */
	float: left;
}

.log_image {  /* .................................................... Each log icon image */
	float: left;
	margin-top: -10px;
	cursor: pointer;
	padding-right: 10px;
}

.log_header {  /* ................................................... Each log title + date */
	float: left;
	cursor: pointer;
}

.log_title {  /* .................................................... Each log title */
	float: left;
	height: 40px;
	padding: 12px 10px 0 0;
	font: bold 17px Comic Sans, Georgia, sans-serif;		
}

.log_date {  /* ..................................................... Each log date */
	float: left;
	height: 35px;
	_margin-right: 180px;
	padding: 22px 0 0 0;
	font: italic bold 14px Comic Sans, Georgia, sans-serif;	
}

.log_list {  /* ..................................................... The log list of changes */
	float: left;
	display: none;
	padding: 0 20px 10px 57px;	
	text-align: justify;
	font: 14px Comic Sans, Georgia, sans-serif;
	width: 600px;
}

.point_image {  /* .................................................. Each log change point icon */
	float: left;
	vertical-align: -2px;
	padding-right: 7px;
	height: 20px;
}

.point_text {  /* ................................................... Each point text in (1) Log */
	padding-left: 30px;
	padding-bottom: 20px;
}

/* --------------------------------- customer_login.php -------------------------------------- */

.blue_block_customer {
	padding: 40px 40px 20px 50px;
}

.username_customer {
	color: #C0B2A7;
}

.send_block_customer {
	margin: 10px 0 0 225px;
}

.forgot_password_link {
	font: 12px Georgia, sans-serif;
	margin-left: 50px;
}

/* --------------------------------- customer_home.php -------------------------------------- */
.welcome_msg {
	font: 16px Georgia, sans-serif;
	font-weight: 900;
	margin: 0 0 0 50px;
}

.logout_link {
	position: absolute;
	font: 16px Georgia, sans-serif;
	font-weight: bold;
	margin: -5px 0 0 600px;
}

.days_remaining {
	display: block;
	margin-left: -60px;
	text-align: center;
	height: 30px;
}

.versions_block input {
	margin-left: 20px;
}

.versions_block input, .versions_block label {
	margin-bottom: 10px;
	padding-left: 10px;
	cursor: pointer;
	font: 14px bold Georgia, sans-serif;
}

.versions_block label {
	_vertical-align: 0;
}

.beta_new_image {
	position: absolute;
	margin: 5px 0 0 -20px;
}

.send_block_home {
	margin: 30px 0 0 240px;
}

/* --------------------------------- download_pro.php -------------------------------------- */
.download_pro_msg {
	text-align: center;
	
	font-family: Georgia, Arial;
	font-size: 16px;
	color: yellow;
}

/* ----------------------------- screenshots.php - gallery ----------------------------------- */

ul#gallery-id table td {
	padding: 4px;
}

ul#gallery-id img {
	border: 2px solid #BC9CCF;
}

.hint{
	margin-top: 20px;
	font-size: 12px;
	text-align: justify;
}

// All the following styling just to make the <li> appear horizontally :
ul#gallery-id{
	width: 600px;  // The gallery max. width.
}

.ib-fix li{
	display: -moz-inline-box;
	-moz-box-orient: vertical;
	display: inline-block;
	verticalAlign: top;
	wordWrap: break-word;
}

* html .ib-fix li{
	display: inline;
}

* + html .ib-fix li{
	display: inline;
}

.ib-fix li > *{
	display: table;
	tableLayout: fixed;
	overflow: hidden;
}

* html .demo-ul li {
	width: 170px;  // For IE 6.
}

.demo-ul li{
	width: 170px;  // For all other browser.
}

/* ---------------------------------------------- videos.php ---------------------------------------------- */

div.videos_class {  /* .............................................. All the videos page content under the header */
	margin: 0 20px 0 30px;
	text-align: justify;
}

.a_video_title {  /* ................................................ The title of the video */
	font-size: 20px;
	font-weight: bolder;
}

span.watch_class {  /* .............................................. The watch link and time */
	float: right;
	text-align: right;
	margin-top: -24px;
}

span.watch_class a {  /* ............................................ The watch link only */
	border-bottom: dotted 1px;
}

div.div_description {  /* ........................................... The video description */
	display: none;
}

/* ------------------------------------ download.php ----------------------------------------- */

.download_win_any_os {  /* .......................................... The download buttons div */
	padding-top: 15px;
}

.download_win, .download_any_os {  /* ............................... Each download button */
	padding-left: 50px;
}

/* ----------------------------------- download_words.php --------------------------------------- */

.category_blocks {  /* .............................................. The categories block */
	float: left;
	margin-left: 20px;
}

.category_block {  /* ............................................... Each category block */
	vertical-align: 8px;
}

.category_title {  /* ............................................... The language files links */
	vertical-align: 7px;
	padding-left: 10px;
}

.tool_tip_icon {  /* ................................................ The language author tip icon */
	vertical-align: 3px;
	padding-left: 10px;
}

.tool_tip_text {  /* ................................................ The hidden tool tip div */
	display: none;
}

.fieldDescription {  /* ............................................. The tool tip div styling */
	font-family:verdana,arial,tahoma;
	font-size:13px;
	line-height: 20px;
	cursor: pointer;
	visibility: hidden;
	position: absolute;
	width: 300px;
	background-color: #FFFFA5;
	border: solid 3px white;
	padding: 5px 5px 10px 10px;
	filter: Alpha(opacity=95);
	-moz-opacity: 0.95;
	-khtml-opacity: 0.95;
	opacity: 0.95;
}

.author_title {  /* ................................................. The tool tip author title */
	font: 15px Georgia, sans-serif;
}

.author_name {  /* .................................................. The tool tip author name */
	font: bold italic 13px sans-serif;
	padding-left: 10px; 
}

.more_author_info {  /* ............................................. Any other info for the translation file author */
	font: 11px sans-serif;
	padding: 10px 0 0 10px; 
}

.close_img {  /* .................................................... The tool tip close image */
	float: right;
}

.contribute {  /* ................................................... The contribute div */
	float: right;
	margin: 10px 10px 0 0;
	width: 320px;
	padding: 15px;
	
	background: #4337AA;
	color: #FFFFFF;
	text-align: justify;
}

.contribute_title {  /* ............................................. The contribute title */
	font: italic 18px Georgia, sans-serif;
}

.contribute_body {  /* .............................................. The contribute body text */
	font-family: Georgia;
}

.how_it_works {  /* ................................................. The div of how it works part */
	margin-top: 770px;
}

.how_it_works_body {  /* ............................................ The body text of how it works part */
	padding-left: 40px;
	font-size: 15px;
}

.how_it_works_body li {  /* ......................................... How it works items */
	margin-top: 7px;
}

/* ---------------------------------------- download_samples.php ---------------------------------------------- */

.samples {  /* ...................................................... All the samples page content under the header */
	margin: 0 0 10px 60px;
}

.sample_header {  /* ................................................ Each sample title + download link */
	vertical-align: 25px;
}

.sample_header img {  /* ................................................ Each sample title + download link */
	vertical-align: -5px;
}

.sample_title {  /* ................................................. The title of the sample */
	font-size: 16px;
	font-weight: bold;
	margin: 0 5px 0 20px;
}

.sample_description {  /* ........................................... The sample description */
	display: none;
	margin-left: 85px;
	width: 465px;
	text-align: justify;
}

/* --------------------------------------------- buy.php -------------------------------------------------- */

.order_banner {  /* ................................................. The northwind sample image */
	width: 500px;
	margin: 20px 20px -30px 40px;
}

.order_block {  /* .................................................. The order button & price text div */
	float: right;
	margin: -230px 10px -80px 0; 
	font: bold 14px Comic Sans, Georgia, sans-serif;
	padding: 10px;
}

.order_button_win, .order_button_any_os {  /* ................................................. The order button & price text div */
	margin-left: 30px;
}

.order_title {  /* .................................................. AppGini title */
	margin-left: -7px;
}

.order_price {  /* .................................................. AppGini pro. price */
	color: green;
}

.buy_notes_block {  /* .............................................. Notes block div */
	padding: 0 0 10px 10px;
}

.buy_notes_title {  /* .............................................. The notes title */
	font: bold 20px Georgia, sans-serif;
	color: #31287F;
}

/* ------------------------------------ faqs.php ------------------------------------------ */

.blue_block_faqs {
	padding: 20px 40px 20px 50px;
}

.plus_icon {
	position: absolute;
	margin-left: -30px;
	cursor: pointer;
}

.question {
	color: yellow;
	font: bold 16px Georgia, sans-serif;
	cursor: pointer;
}

.answer {
	display: none;
	font: 14px Georgia, sans-serif;
	padding-bottom: 10px;
}

/* -------------------------------------------- End ----------------------------------------- */



	
	
	
	