/* CSS Document */

#main h1,#main h2
{
	text-align: center;
}

.bodytext
{
	font-size: 12px;
	color: #000000;
	text-align:left;
}

#floating
{
	margin-bottom:50px;
	width:95%;
	text-align:center;
}

#fbcnt
{
	margin:50px auto;
	width:400px;
}

#fbcmplg
{
	background-color:#ffffff;
}

#tuitionlink
{
	font-size:1em;
	line-height:150%;
	margin-bottom:30px;
}


.sharesocial
{
    text-align: right;
}
.sharesocial a
{
    margin-right: 10px;
}

.indexcontent
{
	display: grid;
	grid-gap: var(--gap);
	grid-template-rows: 250px 600px auto;
}

.indexwelcome
{
	grid-row: 1 / 2;
}

#contenttop
{
	padding:10px 30px;
	position: relative;
}

.adcontent
{
	grid-row: 2 / 3;
	display: grid;
	grid-gap: var(--gap);
	grid-template-columns: 1fr 1fr;
}

.addivtitle
{
	text-align: center;
	text-decoration: none;
	color: var(--gry);
}

.addivsubtitle
{
	text-align: center;
	text-decoration: none;
	color:var(--gry);
}

.leftadcell
{
	/* background-color:#091f22; */
	background-image:url('/global/images/img/star_pattern_right.png');
	background-repeat:repeat;
}

.leftadcell a >div
{
	height: 100%;
}

.leftadcell a:hover
{
	text-decoration: none;
}

.adddivimg
{
	width:250px;
	height:246px;
	margin:-15px auto;
	margin-bottom: 5px;
}

.adddivimg img
{
	width:250px;
	height:246px;
}

.crss
{
	margin: 0 auto;
	margin-top: 10px;
	width: 55%;
	display: grid;
	grid-gap: 10px;
	grid-template-columns: 40px auto;
}

.crss h3
{
	margin: 0px inherit;
}

.crsslast
{
	margin-bottom: 10px;
}

.crsicon
{
	width: 40px;
	height: 40px;
	margin-top: 7px;
}

.crstxt
{
	color: var(--mid);
}

.rightadcell
{
	/* background-color:#491b10; */
	background-image:url('/global/images/img/star_pattern_left.png');
	background-repeat:repeat;
}

.rightadcell >div
{
	height: 100%;
}

.rightadcell a:hover
{
	text-decoration: none;
}

.rightadcell h2,.rightadcell h3
{
	
}

.rightadcell h4,.rightadcell h5
{
	margin:0;
	padding: 0;
}

.atuition
{
	width: 90%;
	margin: 0 auto;
	text-align: center;
	margin: 20px auto 10px auto;
}

.atuition1
{
	color: var(--gry);
}

.atuition2
{
	color:var(--gry);
}

.atuition3
{
	color:var(--gry);
}

.atuition4
{
	width: 60%;
	color:var(--shd);
	font-style: italic;
	text-align: left;
	line-height: 110%;
	/* text-shadow: 1px 1px 0 #1db0ed; */
}

.atuition5
{
	width: 70%;
	text-align: center;
	display: block;
	padding: 20px;
	/* background-color: #03233a; */
	color:var(--mid);
	text-shadow: 
	-0.5px -0.5px 0 var(--shd),  
    0.5px -0.5px 0 var(--shd),
    -0.5px 0.5px 0 var(--shd),
	0.5px 0.5px 0 var(--shd);
	margin:10px auto;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	-khtml-border-radius: 10px;
}

.atuition6
{
	text-align: center;
	padding: 20px;
	display: block;
	color:var(--txt);
	text-shadow: 
	-0.5px -0.5px 0 var(--shd),  
    0.5px -0.5px 0 var(--shd),
    -0.5px 0.5px 0 var(--shd),
	0.5px 0.5px 0 var(--shd);
	margin:10px auto;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	-khtml-border-radius: 10px;
}

.programs
{
	width: 90%;
	margin: 0 auto;
	display: grid;
	grid-gap: 10px;
	grid-template-columns: 1fr 1fr;
	text-align: left;
}

.programscol
{
	display: grid;
	grid-gap: 10px;
	grid-template-rows: 1fr 1fr 1fr;
}

.program
{
	display: grid;
	grid-gap: 10px;
	grid-template-columns: 30px auto;
	align-items: center;
}

.programicon
{
	width: 100%;
	height: 100%;
}

.programtxt
{
	color: #d89b46;
}

.indexlast
{
	grid-row: 3 / -1;
}

#maintitlemask
{
	height:380px;
}

#maintitlecontainer
{
	height:380px;
	padding-top:10px;
}

#maintitle
{
	margin-top:20px;
	text-align:center;
	margin-bottom:30px;
}

#maintitle h1
{
	margin:0;
	padding:0;
	font-size:1em;
}

#contentmenu
{
	font-size:0.8em;
}

#contentmenu1
{
	margin: 0 auto;
	width:280px;
	height:100px;
	margin-bottom:70px;
}

#contentmenu2
{
	margin: 0 auto;
	width:570px;
	height:100px;
}

#cmi1
{
	margin-right:5px;
	text-align:center;
	float:left;
}
		
#cmi1 a
{
	text-decoration:none;
}

#cmi2
{
	margin-right:5px;
	text-align:center;
	float:left;
}
		
#cmi2 a
{
	text-decoration:none;
}

#cmi3
{
	margin-right:5px;
	text-align:center;
	float:left;
}
		
#cmi3 a
{
	text-decoration:none;
}

#cmi4
{
	margin-right:5;
	text-align:center;
	float:left;
}
		
#cmi4 a
{
	text-decoration:none;
}

#cmi5
{
	margin-right:0px;
	text-align:center;
	float:left;
}
		
#cmi5 a
{
	text-decoration:none;
}

#cmi6
{
	margin-right:30px;
	text-align:center;
	float:left;
}
		
#cmi6 a
{
	text-decoration:none;
}

#cmi7
{
	margin-right:30px;
	text-align:center;
	float:left;
}
		
#cmi7 a
{
	text-decoration:none;
}

#cmi8
{
	margin-right:0;
	text-align:center;
	float:left;
}
		
#cmi8 a
{
	text-decoration:none;
}

#contentmiddle
{
	padding:10px 30px;
	position: relative;
}

#contentbottom
{
	padding-top:100px;
}



/* New CSS */
a
{
color: var(--lnk);
text-decoration:none;
}

a:hover
{
color:var(--ttl);
text-decoration:underline;
}

.homeMainTable
{
	padding:10px 30px;
	border-spacing: 0px;
	border-collapse: separate;
	width:100%;
}

.pagination
{
	padding:10px 30px;
	text-align:center;
	margin:30px auto;
	cursor:default;
	line-height:300%;
}

.pagination a
{
	width:100%;
	padding:10px;
	margin:5px;
	text-decoration: none;
	color: var(--bkg);
	background-color: var(--lnk);
	font-weight: bold;
	/*Corners*/
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px; /* future proofing */
	-khtml-border-radius: 5px; /* for old Konqueror browsers */
	cursor: pointer;
	text-decoration:none;
}

.pagination a:hover
{
	color: var(--wht);
	background-color: var(--ttl);
	text-decoration:none;
}

.pagination a.currentpage
{
	color: var(--wht) !important;
	background-color: var(--ttl);
	cursor: default;
	text-decoration:none;
}

.pagination a.disablelink, .pagination a.disablelink:hover
{
	background-color: var(--bkg);
	cursor: default;
	color: var(--shd);
	font-weight: normal !important;
}

.pagination a.prevnext
{
	font-weight: bold;
}

.liPart
{
	color: var(--bkg);
	font-weight: bold !important;

}

.buttonlink
{
	width:100%;
	padding:10px;
	margin:5px;
	text-decoration: none;
	color: var(--bkg);
	background-color: var(--lnk);
	font-weight: bold;
	/*Corners*/
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px; /* future proofing */
	-khtml-border-radius: 5px; /* for old Konqueror browsers */
	cursor: pointer;
	text-decoration:none;
}

.buttonlink:hover
{
	color: var(--wht);
	background-color: var(--ttl);
	text-decoration:none;
}

.a-22-black-b
{
	text-align:left;
	font-size:22pt;
	color:var(--lnk);
	/*margin:5px;*/
	font-family:"Traditional Arabic";
	font-weight:bold;
	direction:rtl;
}

.a-22-white-b
{
	font-size:22pt;
	color:var(--lnk);
	/*margin:5px;*/
	font-family:"Traditional Arabic";
	font-weight:bold;
	direction:rtl;
}

.arabicTextLinks
{
	direction:rtl;
}

.a-22-red-b
{
	text-align:left;
	font-size:22pt;
	color:var(--lnk);
	margin:5px;
	font-family:"Traditional Arabic";
	font-weight:bold;
}

.redarabictxt
{
	color:red;
}


/* New version styles */

.paragraphs
{
	margin-left:10px;
	margin-right:10px;
	text-align:left;
	font-size:1em;
	line-height: 250%;
}

.lessonTitle
{
	width:100%;
	text-align:center;
	font-size:1.7em;
	color: var(--gry);
}

.lessonSubTitle
{
	width:100%;
	text-align:center;
	font-size:1em;
	color: var(--mid);
}

.LessonTable
{
	width:90%;
	border: 1px var(--shd) solid;
	border-collapse: collapse;
	margin:0 auto;
}

.LessonTableTR
{
	
}

.LessonTableTD
{
	border: 1px solid var(--shd);
	padding:10px 10px;
}
.LessonTableP
{
	/* direction:rtl; */
	padding:10px 20px;
	text-align: center;
	font-size:1em;
	line-height: 300%;
}
.LessonTableP span img
{
	margin:0 auto;
	padding: 5px 20px;
	background-color: var(--wht);
	border: 1px solid var(--shd);
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	-khtml-border-radius: 5px;
}

.voclink
{
	width:100%;
	text-align:center;
}

.nextbutton
{
	margin:0 auto;
	width:30%;
}

.nextbutton a, .nextbutton a:visited
{
	padding-top:5px;
	padding-bottom:5px;
	padding-left:20px;
	padding-right:20px;
	/* border: 1px solid #3F6500; */
	background-color:var(--lnk);
	color: var(--bkg);
	font-size:1em;
	font-weight:bold;
	display: block;
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
	border-radius: 7px;
	-khtml-border-radius: 7px;
	text-decoration:none;
}

.nextbutton a:hover
{
	/* border: 1px solid #2b66a5; */
	background-color: var(--lnk);
	color: var(--wht);
	font-size:1em;
	display: block;
}

.sitesubtitle
{
	margin-left:10px;
	font-size:0.9em;
	font-weight:bold;
}

.sitetext
{
	text-align: left;
	font-size:1.2em;
	line-height: 180%;
}

.sitetitle
{
	width:100%;
	text-align:center;
	font-size:0.9em;
	font-weight:bold;
	text-decoration:underline;
}

.ulclass
{
	text-align: justify;
	font-size:1.2em;
	line-height: 230%;
	padding-right:20px;
}

.ulclass ul 
{
	font-size: 100%;
	text-align: justify;
}

.ulclass ol 
{
	font-size: 100%;
	text-align: justify;
}

.ulclass li
{
	text-align: justify;
}

.ulclass li::marker
{
	color:var(--lnk);
}

.red
{
	color: red;
	font-size: 1.3em;
	font-weight: bold;
}
.green
{
	color: #5A9D37;
	font-size: 1.3em;
	font-weight: bold;
}


/* Learn Arabic */

.lrncont
{
	display: grid;
	grid-gap: 100px;
	grid-template-columns: 1fr 1fr;
	justify-content: center;
	align-items: center;
	width:80%;
	margin:0 auto;
	text-align:center;
}

.lrncont a
{
	text-decoration: none;
}

.lrncol
{
	display: grid;
	grid-gap: 10px;
	grid-template-rows: auto;
	color: var(--gry);
}

.lrncol img
{
	width:280px;
	height:215px;
	border:0;
}

.lrntxt
{
	color: var(--shd);
}

.learnarabic
{
	text-align: left;
	margin-top: 40px;
	margin-bottom: 40px;
}

#programmes {
	margin: 50px auto;;
	width: 90%;
	text-align: left;
	border-collapse: collapse;
	border-spacing: 10px;
	border: 1px var(--shd) solid;
}

#programmes th {
	padding: 20px;
	border: 1px var(--shd) solid;
	font-size: 1.3em;
}

#programmes td {
	padding: 20px;
	border: 1px var(--shd) solid;
}

#programmes a {
	padding: 10px 20px;
	text-decoration: none;
	color: var(--bkg);
	background-color: var(--lnk);
	border-radius: 10px;
	margin-left: 10px;
}

#programmes ul li {
	line-height: 200%;
}

#programmes ul li::marker
{
	color:var(--lnk);
}

#programmes .plain-table {
	border: 0;
	border-collapse: collapse;
	border-spacing: 0;
}

#programmes .plain-table td {
	border: 0;
	padding: 10px;
}

#programmes .programme-name {
	
}

.syllabus {
	text-align: left;
}

.syllabus h3 {
	font-size: 1.3em;
}

.syllabus a {
	padding: 10px 20px;
	text-decoration: none;
	color: var(--bkg);
	background-color: var(--lnk);
	border-radius: 10px;
	margin-left: 10px;
}

.syllabus a:hover {
	color: var(--wht);
	background-color: var(--lnk);
}

.syllabus ul li {
	line-height: 200%;
}






/* Questions */

#qstcontainer
{
	width:100%;
	text-align:center;
	margin:30px auto;
}
.qstTable
{
	width:100%;
	border:0;
}
.qstTableStyle
{
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	grid-auto-rows: 1fr;
	grid-gap: 20px;
	border-width:1px solid var(--shd);
}
.question
{
	height: 100%;
}
.wordSubTxt
{
	text-align:center;
	font-family:Verdana;
	font-size:9pt;
	font-weight:bold;
}
.questionSound
{
	text-align:center;
	padding:5px;
}
.questionSubTxt
{
	text-align:center;
	font-family:Verdana;
	font-size:9pt;
	font-weight:bold;
	color:var(--lbu);
}
.questionTrs
{
	text-align:center;
	font-family:Verdana;
	font-size:9pt;
	font-weight:bold;
	color:var(--lbu);
}
.questionAnswer
{
	text-align:center;
	font-family:"Traditional Arabic";
	font-size:20pt;
	font-weight:bold;
	color:var(--red);
}
.redtxt
{
	color:var(--red);
}
#result {
	color: var(--gry);
}
#rslt
{
	display:none;
	width:70%;
	padding:10px;
	margin:10px auto;
	text-align:center;
	font-family:Verdana;
	font-size:0.9em;
	font-weight:bold;
	margin-bottom:20px;
	border: 1px solid var(--shd);
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
	border-radius: 7px;
	-khtml-border-radius: 7px;
}
.qstscore
{
	font-size:1em;
	padding:7px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	-khtml-border-radius: 5px;
	line-height:200%;
	color: var(--lbu);
}
.mrbuttons
{
	margin:30px auto;
	width:50%;
}
.mrbuttons a, .mrbuttons a:visited
{
	width:10%;
	margin:10px;
	padding-top:10px;
	padding-bottom:10px;
	padding-left:30px;
	padding-right:30px;
	color: var(--bkg);
	background-color:var(--lnk);
	font-size:1em;
	font-weight:bold;
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
	border-radius: 7px;
	-khtml-border-radius: 7px;
	text-decoration:none;
}
.mrbuttons a:hover
{
	color: var(--wht);
	background-color:var(--lnk);
}



/* new SEO lesson classes */
.fixalign
{
	text-align: left;
}

h2.fixalign , h3.fixalign 
{
	color: var(--gry) !important;
	margin-top: 50px;
	text-align: left;
}