﻿/* This file create by : Amer Al-Homsi */
body {
	font-family: Verdana;
	direction: ltr;
	margin: 0px;
	padding: 0px;
}
table{
	border-collapse: collapse;
}
/*
	Styles for home page
*/
#background {
	background: url('images/design/home/bg.jpg') no-repeat center top;
	width: 100%;
	height: 762px;
	min-width: 925px;
}
#main {
	position: relative;
	width: 910px;
	height: 445px;
	top: 200px;
	overflow: hidden;
	margin: 0px auto 0px auto;
}
#mainMenu, #mainMenu a {
	width: 600px;
	height: 20px;
	margin: 0px auto 0px auto;
	color: #e8078b;
	font-weight: bold;
	font-size: 13px;
	text-align: center;
	text-decoration: none;
}
#mainMenu a:hover {
	color: #280aaf;
}
#mainRight {
	position: relative;
	width: 165px;
	height: 365px;
	top: 32px;
	left: 734px;
	text-align: center;
}
#mainMiddle {
	position: relative;
	width: 515px;
	height: 330px;
	top: -311px;
	left: 197px;
	text-align: center;
}
#mainLeft {
	position: relative;
	width: 175px;
	height: 385px;
	top: -674px;
	left: 5px;
	text-align: center;
}
#mainLeftButtons {
	position: relative;
	height: 174px;
	width: 100%;
	top: 0px;
}
#mainLeftFlash {
	position: relative;
	width: 100%;
	height: 200px;
	top: 6px;
}
#mainLogo {
	position: relative;
	margin: 0px auto 0px auto;
	padding: 0px;
	top: -393px;
	width: 250px;
	height: 115px;
	left: -4px;
}
#mainBottom {
	background: url('images/design/home/bottom.gif') no-repeat center top;
	width: 100%;
	height: 110px;
	margin-top: -117px;
}
/*
	Styles for contact us page
*/
#contactContainer {
	background: url('images/design/contact/bg.gif') no-repeat center top;
	width: 100%;
	height: 712px;
	min-width: 925px;
	margin-top: -117px;
}
#contactMain{
	position: relative;
	width: 910px;
	margin: 0px auto 0px auto;
}
#contactText {
	position: relative;
	width: 340px;
	top: 280px;
	left: 25px;
	height: 230px;
	overflow: auto;
	color: #fc005e;
	font-weight: bold;
	font-size: 14px;
	text-align: left;
	line-height: 200%;
	vertical-align: middle;
}
#contactForm {
	position: relative;
	top: 60px;
	left: 385px;
	height: 220px;
	width: 435px;
}
#contactForm td {
	margin: 0px;
	padding: 0px;
}
#contactForm table {
	border-collapse: collapse;
	width: 100%;
	margin-bottom: 10px;
}
#contactFieldRight {
	background: url('images/design/contact/box-right.gif') no-repeat center top;
	width:5px;
	height: 37px;
}
#contactFieldLeft {
	background: url('images/design/contact/box-left.gif') no-repeat center top;
	width:5px;
	height: 37px;
}
#contactField {
	background-color: #ffa032;
	color: white;
	font-size: 14px;
	font-weight: bold;
}
#contactInput {
	border-style: none;
	font-size: 14px;
	font-weight: bold;
	color: white;
	width: 280px;
}
/*
	Styles for FMC pages ( Parents + About Us )
*/
#fmcContainer {
	background: url('images/design/fmc/bg.gif') no-repeat center top;
	position: relative;
	top: -117px;
	width: 100%;
	min-width: 925px;
}
#fmcMain {
	position: relative;
	width: 910px;
	/*height: 445px;*/
	top: 80px;
	left: 0px;
	margin: 0px auto 0px auto;
}
#fmcMenu {
	position: relative;
	width: 300px;
	height: 20px;
	left: 20px;
	text-align: left;
	word-spacing: 5px;
	color: #90039b;
	font-weight: bold;
	font-size: 12px;
}
#fmcMenu a {
	color: #90039b;
	text-decoration: none;
}
#fmcMenu a:hover {
	color: #be1473;
}
#fmcTitle {
	position: relative;
	width: 200px;
	height: 40px;
	font-weight: bold;
	font-size: 34px;
	color: #b42cdb;
	text-align: right;
	top: 50px;
	left: 650px;
}
#fmcText {
	position: relative;
	width: 860px;
	top: 160px;
	left: 40px;
	color: #be1473;
	font-weight: bold;
	font-size: 14px;
	text-align: left;
	line-height: 180%;
	padding-bottom: 300px;
}
#fmcTextTitle {
	color: #040C81;
}
#fmcBottom {
	background: url('images/design/fmc/fmcBottom.gif') no-repeat center top;
	position: relative;
	top: -117px;
	height: 120px;
	width: 100%;
}
/*
	Styles for programs page
*/
#programsContainer {
	background: url('images/design/programs/bg.jpg') no-repeat center top;
	width: 100%;
	height: 1732px;
	/* The pic width is '1001px' but here '925px' to allow clipping the image over '925px' */
	min-width: 925px;
	margin-top: -117px;
}
#programsMain {
	position: relative;
	width: 910px; /*height: 445px;*/;
	margin: 0px auto 0px auto;
	height: 1750px;
	overflow: hidden;
}
#programsThumb {
	position: relative;
	width: 400px;
	height: 50px;
	top: 30px;
	left: 270px;
	overflow: hidden;
}
#programsThumbSlide {
	position: relative;
	width: 1000px;
}
#programsMenu, #programsMenu a{
	position: relative;
	top: 40px;
	left: 11px;
	width: 450px;
	height: 15px;
	color: #8e1a93;
	font-weight: bold;
	font-size: 12px;
	direction: ltr;
	word-spacing: 5px;
	text-decoration: none;
	text-align: left;
}
#programsMenu a {
	position: static;
}
#programsMenu a:hover {
	color: white;
}
#programsSummary {
	position: relative;
	width: 495px;
	height: 200px;
	top: 250px;
	left: 25px;
	direction: ltr;
	font-size: 12px;
	font-weight: bold;
	color: #ea0056;
	text-align: left;
	line-height: 130%;
}
#programsTitle {
	position: relative;
	width: 315px;
	height: 40px;
	top: -60px;
	left: 570px;
	font-family: "Bauhaus 93";
	font-size: 36px;
	color: white;
	text-align:center;
}
#programsPicture {
	position: relative;
	width: 315px;
	top: -50px;
	left: 570px;
	height: 270px;
}
/*
	Comments Page ( included in programs page )
*/
#commentsRate{
	position: relative;
	top: 110px;
	left: 20px;
	height: 413px;
	width: 401px;
	background-image: url('images/design/programs/comments/rateBox.gif');
	background-repeat: no-repeat;
}
#commentsRateMovie {
	position: relative;
	width: 377px;
	height: 311px;
	margin: 0px auto 0px auto;
	top: 10px;
}
#commentsRateStars {
	position: relative;
	top: 30px;
	width: 380px;
	height: 60px;
	margin: 0px auto 0px auto;
	font-size: 12px;
	font-weight: bold;
	color: #001e44;
	text-align: center;
}
#commentsBox {
	position: relative;
	width: 450px;
	top: -703px;
	left: 435px;
}
#commentsBox td {
	margin: 0px;
	padding: 0px;
	font-size: 12px;
}
#commentsBoxCommentTable {
	width: 450px;
	margin-bottom: 10px;
	color: #001e44;
}
#commentsBoxCornerTL {
	background-image: url('images/design/programs/comments/corner-tl.gif');
	background-repeat: no-repeat;
	width: 10px;
	height: 18px;
}
#commentsBoxCornerTR {
	background-image: url('images/design/programs/comments/corner-tr.gif');
	background-repeat: no-repeat;
	width: 10px;
	height: 18px;
}
#commentsBoxCornerBL {
	background-image: url('images/design/programs/comments/corner-bl.gif');
	background-repeat: no-repeat;
	width: 10px;
	height: 18px;
}
#commentsBoxCornerBR {
	background-image: url('images/design/programs/comments/corner-br.gif');
	background-repeat: no-repeat;
	width: 10px;
	height: 18px;
}
#commentsBoxBar {
	background-color: #fef5e2;
	width: 215px;
	font-weight: bold;
}
#commentsBoxText {
	background-color: white;
	text-align: left;
	line-height: 130%;
	height: 90px;
	overflow: auto;
}
#commentsBoxPagingTable {
	border-collapse: separate;
	margin: 0px auto 0px auto;
}
#commentsBoxPagingCell, #commentsBoxPagingCell a {
	background-color: white;
	text-align: center;
	text-decoration: none;
	font-size: 11px;
	color: black;
	padding: 0px;
	margin: 0px;
	width: 15px;
	height: 15px;
}
#commentsBoxPagingCellActive, #commentsBoxPagingCellActive a {
	background-color: #ff9933;
	text-align: center;
	text-decoration: none;
	font-size: 11px;
	color: black;
	padding: 0px;
	margin: 0px;
	width: 15px;
	height: 15px;
}
/*
	Add Comment Styles
*/
#AddComment {
	position: relative;
	top: 156px;
	left: 20px;
	width: 400px;
	height: 400px;
}
#AddComment table {
	width: 100%;
	height: 37px;
	margin-bottom: 5px;
}
#AddComment td {
	padding: 0px;
	margin: 0px;
}
#AddCommentTitleLeft {
	background: transparent url('images/design/programs/addComment/title-left.gif') no-repeat;
	width: 5px;
}
#AddCommentTitleRight {
	background: transparent url('images/design/programs/addComment/title-right.gif') no-repeat;	
	width: 5px;
}
#AddCommentTitleText {
	background-color: white;
	font-size: 16px;
	font-weight: bold;	
	color: #040c81;
	text-align: center;
}
#AddCommentFieldLeftStyle1 {
	background: transparent url('images/design/programs/addComment/box1-left.gif') no-repeat;
	width: 5px;
}
#AddCommentFieldRightStyle1 {
	background: transparent url('images/design/programs/addComment/box1-right.gif') no-repeat;	
	width: 5px;
}
#AddCommentFieldTextStyle1, #AddCommentInputCell1 {
	background-color: #99ccff;
}
#AddCommentFieldLeftStyle2 {
	background: transparent url('images/design/programs/addComment/box2-left.gif') no-repeat;
	width: 5px;
}
#AddCommentFieldRightStyle2 {
	background: transparent url('images/design/programs/addComment/box2-right.gif') no-repeat;	
	width: 5px;
}
#AddCommentFieldTextStyle2, #AddCommentInputCell2 {
	background-color: #ccccff;
}
#AddCommentFieldTextStyle1, #AddCommentFieldTextStyle2 {
	width: 100px;
	font-size: 14px;
	font-weight: bold;	
	color: #040c81;
	text-align: left;
	padding-left: 10px !important;
}
#AddCommentInputCell1, #AddCommentInputCell2 {
	width: 290px;
	text-align: left;
}
#AddCommentInput {
	border-style: none;
	font-size: 14px;
	font-weight: bold;
	color: #040c81;
	width: 280px;
}
#AddCommentTextAreaLeft {
	background: transparent url('images/design/programs/addComment/box3-left.gif') no-repeat;
	width: 5px;
	height: 137px;
}
#AddCommentTextAreaRight {
	background: transparent url('images/design/programs/addComment/box3-right.gif') no-repeat;
	width: 5px;
	height: 137px;
}
#AddCommentTextAreaCell {
	background-color: #FFFFFF;
	text-align: center;
}
#AddCommentTextArea {
	background: transparent url('images/design/programs/addComment/textareabg.gif') repeat-y center top;
	border-width: 0px;
	width: 380px;
	height: 120px;
	overflow: auto;
	font-family: Verdana, Tahoma;
	font-size: 14px;
	font-weight: bold;
	color: #040c81;
}
/*
	Styles for Download page
*/
#downloadContainer {
	background: url('images/design/download/bg.jpg') no-repeat center top;
	width: 100%;
	height: 700px;
	min-width: 925px;
	margin-top: -117px;
}
#downloadMain{
	position: relative;
	width: 910px;
	height: 740px;
	margin: 0px auto 0px auto;
}
#downloadMenu {
	position: relative;
	top: 90px;
	height: 20px;
	width: 400px;
	left: 10px;
	text-align: left;
	color: #0b46bd;
	font-weight: bold;
	font-size: 12px;
}
#downloadMenu a {
	color: #0b46bd;
	text-decoration: none;
}
#downloadMenu a:hover, #downloadMenu span {
	color: red;
	text-decoration: none;
}
#downloadTitle {
	position: relative;
	top: 70px;
	left: 510px;
	height: 40px;
	width: 250px;
	color: #0b46bd;
	font-weight: bold;
	font-size: 26px;
	text-align: center;
}
#downloadIcons {
	position: relative;
	top: 260px;
	left: 15px;
	height: 230px;
	width: 340px;
	color: #1a7cba;
	font-size: 14px;
	font-weight: bold;
	text-align: center;
}
#downloadIcons img {
	border: 4px solid #83cc2b;
	height: 65px;
	width: 87px;
	cursor: pointer;
}
#downloadIcons div {
	width: 165px;
	height: 100px;
	float: left;
}
#downloadIcons table {
	border-collapse: separate;
	clear: left;
	margin: 0px auto 0px auto;
}
#PagingCellActive, #PagingCellActive a {
	background-color: #5391fd;
	color: #e1efff;
	text-decoration: none;
}
#PagingCell, #PagingCell a {
	background-color: #74aefd;
	color: #c7e0ff;
	text-decoration: none;
}
#PagingCellActive, #PagingCell {
	text-align: center;
	font-size: 11px;
	width: 15px;
	height: 15px;
}
#downloadPreview {
	position: relative;
	top: -148px;
	left: 380px;
	height: 375px;
	width: 501px;
}
#downloadPreview img {
	height: 375px;
	width: 501px;
}
#downloadButton {
	position: relative;
	top: -135px;
	left: 500px;
	height: 20px;
	width: 260px;
	text-align: center;
	color: white;
	font-size: 11px;
	font-weight: bold;
}
#downloadButton a {
	color: white;
	text-decoration: none;
}
#downloadButton a:hover {
	color: yellow;
	text-decoration: underline;
}









