@font-face {
    font-family: 'Amiri';
    src: url('font/Amiri-Regular.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Andalus';
    src: url('font/Andalus.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Almarai';
    src: url('font/Almarai-Regular.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}


@font-face {
    font-family: 'KSA';
    src: url('font/KSARegular.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}


@font-face {
    font-family: 'FreeSans';
    src: url('font/FreeSans.woff2') format('woff2');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'FreeSans';
    src: url('font/FreeSansBold.woff2') format('woff2');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}


:root {

  --Color_GOLDEN: 		#ECD591;
  --VRTOPCOLO: 			white;
  --HRTOPCOLO: 			white;
  --Color_CLOCK: 		gray;
  --Color_SEKSALATS: 	gray;
  --Color_LOWFOCUS: 	gray;
  --Color_BGTUBE: 		gray;
  --MED_VIS: 			visible;
  --METEO: 				visible;
  --IQAMAT: 			visible;
  --MTOSLWTS: 			visible;
  --PRGRSS: 			1;
  --OffIqmatNamesPOZ: 	5%;
  --OffIqmatHoursArPOZ: 30%;
  --OffIqmatHoursEnPOZ: 10%;
  --MTOXen : 27%;
  --MTOXar : 57%;
  --RoundsVrTOP : 54%;
  
  --XX_LANG_DIR: 'rtl';
  
  --HR_HHHTOP : 6.5%;
  --HR_NAMTOP : 41%;
  
  --TXT_SHDW: 1px 1px 3px rgba(0,0,0, 0.3);
  --CLK_SHDW: 2px 3px 5px rgba(0,0,0, 0.4);
   
  --BigIQ: '4.1vw';
  
  --XX_MAJORFONTO: 'Amiri';
  --FOXEN: 1.10;
  
  --XX_DIGITS:   'FreeSans';

  --bgSemiLITE: rgba(255,255, 255, 0.12);
  --bgHR0     : rgba(255,255, 255, 0.03);
  --bgHRB     : rgba(255,255, 255, 0.04);
  --bgSemiHRBG: url(./images/img4.png);
  --OPAK: 1;

}

html, body{ 
height			: 100%;
margin			: 0px; 
overflow		: hidden;
font-family		: 'FreeSans';
font-size		: 9pt; 
color			: #ACA091;
background-color: #151515;
-webkit-scrollbar:display: none;
scrollbar-width: none;
-ms-overflow-style: none;
} 

body {overflow-y : scroll; } 
body::-webkit-scrollbar {display: none; }
hr {border: 1px solid #333333;}

/* ================================================================================== */
/*  LANDSCAPE */

@media only screen and (orientation:landscape)
{




#eMainHORIZONTAL {display:block; width:100%; height:100%; background:url(); background-repeat:no-repeat; background-size:100% 100%;}
#eMainVERTICAL 	 {display:none;  width:100%; height:100%;}

#eMenuHR {position:absolute; z-index:9999333; left:1%; top:0; font-size:2.8vw; padding:2px;}

/* =================HR_A========================================================== */
#eMainHORIZONTAL.HR_A #HRMsqNAME{
position:absolute; font-family:var(--XX_MAJORFONTO); font-size:calc(var(--FOXEN) * 3.0vw); 
right:15%; top:19.5%; height:9%; width:70%; text-align:center; text-shadow:var(--TXT_SHDW);
color:var(--Color_LOWFOCUS); line-height:1em;
}

/* ===========================================HR_B================================ */
#eMainHORIZONTAL.HR_B #HRMsqNAME{
	position:absolute; font-family:var(--XX_MAJORFONTO); font-size:calc(var(--FOXEN) * 3.2vw); 
	right:15%; top:13%; height:9%; width:70%; text-align:center; text-shadow:var(--TXT_SHDW);
	color:var(--Color_LOWFOCUS); line-height:1em;
}
/* =============================================HR_B============================== */
#eMainHORIZONTAL.HR_B #HRdataHIJRI{visibility:hidden;}
#eMainHORIZONTAL.HR_B #_HR_MILADI{visibility:hidden;}

#eMainHORIZONTAL.HR_B #HRMILADIHIJRI {
	position:absolute; font-family:var(--XX_MAJORFONTO); font-size:calc(var(--FOXEN) * 3.0vw);
	left:15%; top:4%; height:9%; width:70%; line-height:1em; text-align:center;
	color:var(--HRTOPCOLO); direction:var(--XX_LANG_DIR); text-shadow:var(--TXT_SHDW);}
#eMainHORIZONTAL.HR_B #HRMILADIHIJRI:lang(AR){font-size:calc(var(--FOXEN) * 2.7vw);}
#eMainHORIZONTAL.HR_B #HRMILADIHIJRI:lang(UR){font-size:calc(var(--FOXEN) * 2.7vw);}

/* =========================================HR_A============================== */
/* =========================================================================== */
/* =========================================================================== */
#eMainHORIZONTAL.HR_A #HRdataHIJRI{
	position:absolute; font-family:var(--XX_MAJORFONTO); font-size:calc(var(--FOXEN) * 2.7vw); 
	right:2%; top:2.5%; height:9%; width:41%; line-height:1em; text-align:left;
	color:var(--HRTOPCOLO); direction:var(--XX_LANG_DIR); text-shadow:var(--TXT_SHDW);
}

#eMainHORIZONTAL.HR_A #_HR_MILADI{
	position:absolute; font-family:var(--XX_MAJORFONTO); font-size:calc(var(--FOXEN) * 2.7vw); 
	left:2%; top:2.5%; height:9%; width:41%; line-height:1em; text-align:right;
	color:var(--HRTOPCOLO); direction:var(--XX_LANG_DIR); text-shadow:var(--TXT_SHDW);
}


#eMainHORIZONTAL.HR_A #HRMILADIHIJRI{visibility:hidden;}






#HrMeteoBOX	{position:absolute; left:2%; top:12%; width:8%; height:10%;
	visibility:var(--METEO);text-shadow:var(--TXT_SHDW); text-align:left;}

#HRCELSIUS	{position:absolute; left:0%; top:2%; text-align:left;
	font-family :var(--XX_DIGITS); font-size:2.7vw; color:var(--HRTOPCOLO);}

#HRmeteoHL	{position:absolute; left:0%; top:53%; text-align:left; display:none;
	font-family :var(--XX_DIGITS); font-size:1.7vw; color:var(--Color_LOWFOCUS);}

#HRMTOikon	{position:absolute; right:0%; top:3%; width:3.3vw; height:3.3vw; text-align:left;}



#eMainHORIZONTAL.HR_A #CLOKO_MINI_HR	{visibility:visible; position:absolute; 
	left:23%; top:28%; width:54%; height:25%; 
	text-shadow:var(--CLK_SHDW); font-family :var(--XX_DIGITS); 
	color:var(--Color_CLOCK); z-index:997;}

#eMainHORIZONTAL.HR_B #CLOKO_MINI_HR	{visibility:visible; position:absolute; 
	left:23%; top:24%; width:54%; height:25%; 
	text-shadow:var(--CLK_SHDW); font-family :var(--XX_DIGITS); 
	color:var(--Color_CLOCK); z-index:997;}

#HR_eFullHOUR	{position:absolute; line-height:1em; font-size:13vw; letter-spacing:0.065em; z-index:925; left:0%;  top:0%;  width:100%; text-align:center;}
#HR_eSECS		{position:absolute; line-height:1em; font-size:4.7vw; text-align:right;  z-index:926; right:4%; top:6%;  width:12%; }
#HR_eAMPM		{position:absolute; line-height:1em; font-size:3.3vw; text-align:right;  z-index:927; right:4%; top:52%; width:12%; text-shadow:var(--TXT_SHDW);}


#eMainHORIZONTAL.HR_A #CLOKO_FULL_HR	{position:absolute;	line-height:1em; font-size:13vw; 
	left:20%; top:28%; z-index:997; text-align:center; letter-spacing:0.065em;
	width:60%; height:25%; text-shadow:var(--CLK_SHDW); 
	font-family :var(--XX_DIGITS); color:var(--Color_CLOCK);}
	
#eMainHORIZONTAL.HR_B #CLOKO_FULL_HR	{position:absolute;	line-height:1em; font-size:13vw; 
	left:20%; top:24%; z-index:997; text-align:center; letter-spacing:0.065em;
	width:60%; height:25%; text-shadow:var(--CLK_SHDW); 
	font-family :var(--XX_DIGITS); color:var(--Color_CLOCK);}


#eMainHORIZONTAL.HR_A #HReAyatsHDR {position:absolute;font-family:'Amiri'; left:2.5%; font-size:3.1vw; 
	height:14%; width:95%; top:51%; line-height:1em; 
	text-align:center; z-index:500; color:var(--Color_GOLDEN); 
	text-shadow:var(--TXT_SHDW);}
	
#eMainHORIZONTAL.HR_B #HReAyatsHDR {position:absolute;font-family:'Amiri'; left:2.5%; font-size:3.1vw; 
	height:14%; width:95%; top:48%; line-height:1em; 
	text-align:center; z-index:500; color:var(--Color_GOLDEN); 
	text-shadow:var(--TXT_SHDW);}


#HRDataBOX {position:absolute; left:7%; font-family:'Amiri'; font-size:calc(var(--FOXEN) * 2.4vw);
	height:14%; width:86%; top:49%; line-height:1em; 
	text-align:center; z-index:400; color:var(--Color_SEKSALATS); 
	text-shadow:var(--TXT_SHDW);}
	
#eMainHORIZONTAL.HR_A #HahowaALONGO	{position:absolute; left:0.5%; top:63%; width:99%; z-index:888; direction:var(--XX_LANG_DIR);}
#eMainHORIZONTAL.HR_B #HahowaALONGO	{position:absolute; left:0.5%; top:62%; width:99%; z-index:888; direction:var(--XX_LANG_DIR);}
#HahowaALONGO	td {position:relative; text-shadow:var(--TXT_SHDW);
	 border:1px solid var(--bgHRB); background-color:var(--bgHR0);}

.tdbg {background: url(./images/img6.png) no-repeat 0 0; background-size:100% 100%;}

#HReFIXER {font-size:11vw;}


.wwwNAME {position:absolute; font-family:var(--XX_MAJORFONTO); font-size:3.1vw; top:var(--HR_NAMTOP); left:5%; width:90%; line-height:1.3em; text-align:center; color:var(--Color_SEKSALATS);}
.wwwNAME:lang(AR) {font-size:calc(var(--FOXEN) * 3.0vw); line-height:1em;}
.wwwNAME:lang(UR) {font-size:calc(var(--FOXEN) * 3.0vw); line-height:1em;}

.wwwHOUR    {position:absolute; left:5%; top:var(--HR_HHHTOP);  letter-spacing:0.045em; width:90%; line-height:1em; font-size:4.1vw; text-align:center; color:var(--Color_CLOCK);}
.wwwIQAMA 	{position:absolute; left:5%; top:71.5%; letter-spacing:0.045em; direction:ltr; visibility:var(--IQAMAT); width:90%; line-height:1em; font-size:var(--BigIQ); text-align:center;}


.wwwDemain  {position:absolute; left:1%; top:-12%; line-height:1em; opacity:.5; font-size:1.4vw; color:var(--Color_LOWFOCUS);  }
.wwwDemain:lang(AR) {right:1%;}
.wwwDemain:lang(UR) {right:1%;}

#HRAzanCOMES {font-family:'Amiri'; position:absolute;
	right:0%; top:0%; width:100%; height:100%;
	line-height:1.3em; text-align:center; 
	background:var(--Color_BGTUBE);
	color:var(--Color_SEKSALATS); 
	font-size:calc(var(--FOXEN) * 6.5vw); 
	z-index:99991;}

#HRTextAZAN {margin-top:10%;}
#HHHNowNAMEazan {font-size:170%; color:var(--Color_CLOCK);}
#HHHTopTIME {position:absolute; right:1%; top:2%; font-family:var(--XX_DIGITS); 
	 line-height:1em; font-size:3vw; color:var(--Color_CLOCK);}
	 

#HRIQAMATIME { position:absolute;
	left:0%; top:0%; width:100%; height:100%;
	line-height:1em; text-align:center; font-family:'Amiri';
	z-index:99991; font-size:calc(var(--FOXEN) * 9vw); 
	background:var(--Color_BGTUBE);
	color:var(--Color_CLOCK);}

#HRnowIQAMA {margin-top:25%;}


.Hmtx{position:absolute; left:1%; top:31%; width:23%; height:31%; font-size:1.5vw; direction:ltr; visibility:var(--MTOSLWTS);}



#eMainHORIZONTAL.HR_A #HReDecompteBOX {position:absolute;font-family:var(--XX_DIGITS); text-align:center;
	text-shadow:var(--TXT_SHDW); font-size:calc(var(--FOXEN) * 2.9vw); visibility:hidden;
	z-index:9999337; line-height:1em; right:4%; bottom:51.5%; padding-top:4vw; 
	width:15vw; height:11vw; color:var(--Color_SEKSALATS);}
#eMainHORIZONTAL.HR_B #HReDecompteBOX {position:absolute;font-family:var(--XX_DIGITS); text-align:center;
	text-shadow:var(--TXT_SHDW); font-size:calc(var(--FOXEN) * 2.9vw); visibility:hidden;
	z-index:9999337; line-height:1em; right:4%; bottom:54.5%; padding-top:4vw; 
	width:15vw; height:11vw; color:var(--Color_SEKSALATS);}
	
#HReDecompteTEXT {position:absolute; right:0%; top:33%; width:100%; font-size:4.1vw; letter-spacing:0.065em;
	text-align:center; text-shadow:var(--TXT_SHDW); color:var(--Color_CLOCK);}

#HRBAQI2IQAMA {position:absolute; right:0%; bottom:18%; width:100%; 
			font-size:calc(var(--FOXEN) * 2.1vw); text-shadow:var(--TXT_SHDW);
			text-align:center; font-family:var(--XX_MAJORFONTO); color:var(--Color_SEKSALATS);}
#HRBAQI2IQAMA:lang(AR){font-size:calc(var(--FOXEN) * 1.8vw); bottom:16%;}
#HRBAQI2IQAMA:lang(UR){font-size:calc(var(--FOXEN) * 1.8vw); bottom:16%;}

#eMainHORIZONTAL.HR_A #HRtheSVG {position:absolute; z-index:9999333; right:1.5%; bottom:47.3%; 
	width:20vw; height:20vw; visibility:hidden; opacity:var(--PRGRSS);}
#eMainHORIZONTAL.HR_B #HRtheSVG {position:absolute; z-index:9999333; right:1.5%; bottom:50.3%; 
	width:20vw; height:20vw; visibility:hidden; opacity:var(--PRGRSS);}
#HRbasica {stroke:var(--Color_BGTUBE);    stroke-width:3.5; fill:var(--Color_BGTUBE);}
#HRdynamo {stroke:var(--Color_SEKSALATS); stroke-width:3.5; fill:none;}


#eMainHORIZONTAL.HR_A #HR_LOGO {position:absolute; left:7%; top:28%; width:15vw; height:15vw;}
#eMainHORIZONTAL.HR_B #HR_LOGO {position:absolute; left:4%; top:23%; width:15vw; height:15vw;}


#eMainHORIZONTAL.HR_A #HReNextBOX {position:absolute;font-family:var(--XX_DIGITS); text-align:center;
	background-image:url(./images/img1.png); background-size: 100% auto;
	text-shadow:var(--TXT_SHDW); font-size:calc(var(--FOXEN) * 3.1vw);
	z-index:337; line-height:1em; right:7%; top:28%; padding-top:4vw; 
	width:13vw; height:11vw; color:var(--Color_CLOCK);}

#eMainHORIZONTAL.HR_B #HReNextBOX {position:absolute;font-family:var(--XX_DIGITS); text-align:center;
	background-image:url(./images/img1.png); background-size: 100% auto;
	text-shadow:var(--TXT_SHDW); font-size:calc(var(--FOXEN) * 3.1vw);
	z-index:337; line-height:1em; right:4%; top:23%; padding-top:4vw; 
	width:13vw; height:11vw; color:var(--Color_CLOCK);}

#HReNextPRAYER {letter-spacing:0.065em;}
#HReNextPrTEXT {position:absolute;font-family:var(--XX_MAJORFONTO); letter-spacing:0em;
	font-size:calc(var(--FOXEN) * 1.7vw); line-height:1em; text-align:center;
	top:59%; width:100%; color:var(--Color_LOWFOCUS);}



#HReJOMOA,#HRxSHRQDOHA span{font-family:var(--XX_MAJORFONTO); font-size:110%;}
#HReJOMOA:lang(AR){ font-size:140%;}
#HReJOMOA:lang(UR){ font-size:140%;}
#HReJOMOAXX{font-family:var(--XX_DIGITS);}





#HReMESSAGE0 {position:absolute; z-index:300; left:0%; bottom:0%; width:100%; height:7%; padding:.3% 0;
	font-family:'Amiri'; line-height:1.4em; text-align:center;
	font-size:3vw; color:var(--Color_CLOCK);}

#HReMESSAGE1 {position:absolute; display:inline; z-index:300; left:0%; bottom:0%; width:100%; height:7%; padding:.3% 5%;
	font-family:'Amiri'; line-height:1.4em;
	font-size:3vw; color:var(--Color_SEKSALATS);
	}






#HReALERT {position:absolute; right:3%; bottom:0.2%; font-size:calc(var(--FOXEN) * 2.2vw); 
	line-height:1em; padding:1% 0; text-align:center; 
	height:auto; width:94%; font-family:var(--XX_MAJORFONTO); 
	color:var(--Color_CLOCK); visibility:hidden;}



#HR_Btm0  {position:absolute;  left:1.8%; text-align:left;  bottom:1.8%; width:40%; line-height:1em; font-size:1.5vw; z-index:1300;  color:var(--Color_LOWFOCUS); opacity:0.65;}
#HR_Btm1  {position:absolute; right:1.8%; text-align:right; bottom:1.8%; width:50%; line-height:1em; font-size:1.5vw; color:var(--Color_LOWFOCUS); opacity:0.65; text-transform:uppercase;}

.c2 {color:var(--Color_SEKSALATS); }



select {width:100%; padding:1%; text-align:right; font-size:102%;}
select optgroup{padding:1.5%;  color:#913E23;}
select option{padding:1.5%; text-align:right; color:#252525;}

button {margin-top:5%; width:60%; font-size:2vw; padding:2%;}


#eHELPSCREEN 	{position:absolute; height:100%; width:55%; left:0%; top:0%; visibility:hidden; font-size:1.6vw; z-index:99998; background:#151515;}
.cssSET 		{position:absolute; display:table; left:0%; top:0%; width:100%; height:8%; background-color:#282828;}
.cssMenuBTN 	{width:90%; padding:3.1%; cursor:pointer;}
.cssMenuGRP 	{position:absolute; font-family:var(--XX_MAJORFONTO); font-size:calc(var(--FOXEN) * 2.3vw); line-height:1em; left:0%; top:10%; width:100%; height:90%;  overflow-y:auto; }



.cssModelSettingsWINDOW	{font-family:var(--XX_MAJORFONTO); position:absolute; width:60%; height:100%; 
	left:20%; top:0%; visibility:hidden; 
	font-size:calc(var(--FOXEN) * 2.3vw); z-index:99993; background:#151515;}
	
.cssTitlesHOLDER		{position:absolute; display:table; left:0%; top:0%; width:100%; height:10%;}
.cssSettingsDATA		{position:absolute; left:0%; top:10%; width:94%; height:84%; padding:3%;  overflow-y:auto;}



.cssNoMOBILE {position:absolute; left:40%; top:50%; width:20%; height:auto; visibility:hidden;}
.cssCheckBOX {height:3.5vw; width:2.5vw;}
.cccADJUSTER	{font-size:2vw; height:3vw; width:3.5vw;}


.cssMenuICO	{position:absolute; z-index:9999333; left:1%; top:-2%; font-size:2.5vw; padding:3px;}


.cssHR_DECOMTO_ALONGO 	{position:absolute; z-index:337; left:76.7%; bottom:41%; width:24%; height:61%;  visibility:hidden;}

.cssHR_NEXTPRAY_DATA_ALONGO	{position:absolute; z-index:337; left:79.7%; bottom:47%; width:18%; height:52%; visibility:visible; color:var(--Color_SEKSALATS);}



.CSS_AR33 {font-family:var(--XX_MAJORFONTO);    font-size:calc(var(--FOXEN) * 2.1vw); cursor:pointer;}
.CSS_AR44 {font-family:var(--XX_MAJORFONTO);    font-size:calc(var(--FOXEN) * 1.6vw); cursor:pointer;}
.CSS_EN33 {font-family:var(--XX_DIGITS); font-size:1.5vw; cursor:pointer;}

input[type='radio'] { vertical-align:middle; width:2.1vw; height:2.1vw;}

#AAA_ForcedVERTICAL{display:block;}

}



/*  VERTICAL  */
/* ================================================================================== */
@media only screen and (orientation:portrait)
{
#eMainVERTICAL 	 {display: block; width:100%; height:100%; background-repeat:no-repeat; background-size:100% 100%; }
#eMainHORIZONTAL {display: none;  width:100%; height:100%;}


#eMenuVR	{position:absolute; z-index:9999333; left:0%; top:-1%; font-size:6vw; padding:7px;}

#VRMsqNAME { position:absolute; right:2%; top:0.5%; width:90%; height:13%;
	font-family:'Amiri'; font-size:calc(var(--FOXEN) * 5.5vw); text-align:center; 
	line-height:1.55em; color:var(--VRTOPCOLO); text-shadow:var(--TXT_SHDW); }


#eVRDATES	{position:absolute; font-family:var(--XX_MAJORFONTO);
	font-size:calc(var(--FOXEN) * 5.9vw);  line-height:1.60em; direction:ltr;
	right:10%; top:14%; height:17%; width:80%; text-align:center;
	color:var(--Color_SEKSALATS); text-shadow:var(--TXT_SHDW);}

#eVRDATES:lang(AR){font-size:calc(var(--FOXEN) * 5.6vw); direction:rtl; top:13%; line-height:1.45em; }
#eVRDATES:lang(UR){font-size:calc(var(--FOXEN) * 5.6vw); direction:rtl; top:13%; line-height:1.45em; }

#_eHIJRI {color:var(--Color_CLOCK);}


#VReWebMSG	{position:absolute; right:4%; top:13%; width:10%; cursor:pointer; 
	font-family:var(--XX_DIGITS); line-height:1em; text-shadow:var(--TXT_SHDW);
	text-align:right; font-size:7vw; color:var(--Color_LOWFOCUS); opacity:.3;}


#VrMeteoBOX	{position:absolute; left:3%; top:9%; width:15%; height:7%;
	visibility:var(--METEO);text-shadow:var(--TXT_SHDW); text-align:left; color:var(--VRTOPCOLO);}

#VRMTOikon	{position:absolute; right:0%; top:5%; width:6vw; height:6vw; text-align:left;}
#VRCELSIUS	{font-size:5.3vw;}
#VRmeteoHL	{font-size:3.1vw; font-family :var(--XX_DIGITS);color:var(--Color_LOWFOCUS); display:none;}



#CLOKO_MINI_VR	{visibility:visible; position:absolute; 
	left:0%; top:31%; width:100%; height:12%; 
	text-shadow:var(--CLK_SHDW); 
	font-family :var(--XX_DIGITS);
	color:var(--Color_CLOCK); z-index:997;}

#VR_eFullHOUR	{position:absolute; line-height:1em; font-size:22.7vw; letter-spacing:0.045em; z-index:925; left:0%;  top:0%;  width:100%; text-align:center;}
#VR_eSECS		{position:absolute; line-height:1em; font-size:8.7vw; text-align:right;  z-index:926; right:7%; top:6%;  width:12%; }
#VR_eAMPM		{position:absolute; line-height:1em; font-size:6.5vw; text-align:right;  z-index:927; right:7%; top:57%; width:12%; text-shadow:var(--TXT_SHDW);}


#CLOKO_FULL_VR	{position:absolute;	line-height:1em; font-size:22.7vw; 
	left:0%; top:31%; z-index:929; text-align:center; 
	width:100%; height:12%; text-shadow:var(--CLK_SHDW); 
	font-family :var(--XX_DIGITS);  z-index:997;
	color:var(--Color_CLOCK);}


.VR_LOGO {position:absolute; left:3%; bottom:7%; width:27.3%;}



#VrBoxROUND	{position:absolute; z-index:400; text-align:center;
	left:4%; top:54%; line-height:2.3em; width:26%; height:10%; padding-top:7%; 
	background:url(./images/img1.png) no-repeat center top;
	background-size: 100% auto;
	color:var(--Color_SEKSALATS);}

#VReNextPRAYER {font-size:7.1vw; letter-spacing:0.065em; font-family:var(--XX_DIGITS); color:var(--Color_CLOCK);}

#VReNextPrTEXT { font-size:calc(var(--FOXEN) * 4.2vw); 
	font-family:var(--XX_MAJORFONTO); color:var(--Color_LOWFOCUS); text-shadow:var(--TXT_SHDW);}


#VReMESSAGE0 {position:absolute; z-index:300; left:0%; bottom:0%; width:100%; height:5%; padding:.3% 0;
	font-family:'Amiri'; line-height:1.4em; text-align:center;
	font-size:5vw; color:var(--Color_SEKSALATS);}

#VReMESSAGE1 {position:absolute; z-index:300; left:0%; bottom:0%; width:100%; height:5%; padding:.3% 3%;
	font-family:'Amiri'; line-height:1.4em;
	font-size:5vw; color:var(--Color_SEKSALATS);
	}

#VRDataBOX {position:absolute; z-index:3000; left:3%; bottom:4.5%;
	width:94%; height:57%; background:var(--Color_BGTUBE); font-size:5vw;
	box-shadow:3px 3px 33px rgba(0,0,0, 0.5); visibility:hidden;
	color:var(--Color_SEKSALATS); opacity:.97;}

#VRDataHOLDO {position:absolute; left:0%; top:0%; width:100%; margin-top:10%; height:85%; overflow-y:auto;}
#VRDataCLOSE {position:absolute; right:3%; top:0%; color:var(--Color_SEKSALATS); cursor:pointer; }

#VRDataMESSAGE {padding:5%; font-family:'Amiri'; line-height:1.5em; font-size:calc(var(--FOXEN) * 5.4vw);}



.Vmtx{position:absolute; right:var(--MTOXen); top:21%; width:10%; height:65%; 
	font-size:2.3vw; direction:ltr; visibility:var(--MTOSLWTS);}
.Vmtx:lang(AR){right:var(--MTOXar);}
.Vmtx:lang(UR){right:var(--MTOXar);}

#VReDecompteBOX {position:absolute;font-family:var(--XX_DIGITS); text-align:center; visibility:hidden;
	text-shadow:var(--TXT_SHDW); font-size:calc(var(--FOXEN) * 2.9vw);
	z-index:337; line-height:1em; left:3.5%; bottom:32%; padding-top:4vw; 
	width:26vw; height:22vw; color:var(--Color_SEKSALATS);}

#VReDecompteTEXT {position:absolute; right:0%; top:38%; width:100%; font-size:7.0vw; letter-spacing:0.065em; 
	text-align:center; text-shadow:var(--TXT_SHDW); color:var(--Color_CLOCK);}

#VRBAQI2IQAMA {position:absolute; right:0%; bottom:23%; width:100%; 
			font-size:calc(var(--FOXEN) * 3.8vw); text-shadow:var(--TXT_SHDW);
			text-align:center; font-family:var(--XX_MAJORFONTO); color:var(--Color_SEKSALATS);}
#VRBAQI2IQAMA:lang(AR){font-size:calc(var(--FOXEN) * 2.8vw); bottom:23%;}
#VRBAQI2IQAMA:lang(UR){font-size:calc(var(--FOXEN) * 2.8vw); bottom:23%;}

#VRtheSVG {position:absolute; z-index:333; left:2.1%; bottom:31.3%;
	 width:29vw; height:29vw; visibility:hidden; opacity:var(--PRGRSS);}
#VRbasica {stroke:var(--Color_BGTUBE);    stroke-width:3.5; fill:var(--Color_BGTUBE); opacity:.7;}
#VRdynamo {stroke:var(--Color_SEKSALATS); stroke-width:3.5; fill:none;}



#VReJOMOA {position:absolute; z-index:400; text-align:center;
	left:5.4%; top:66.3%; width:22vw; height:17vw; padding-top:5vw;
	font-family:var(--XX_MAJORFONTO); font-size:4.9vw; opacity:.8;
	line-height:1.2em; color:var(--Color_LOWFOCUS);}
#VReJOMOA:lang(AR){font-size:calc(var(--FOXEN) * 4.7vw);}
#VReJOMOA:lang(UR){font-size:calc(var(--FOXEN) * 4.7vw);}


#VReDOHA {position:absolute; right:4%; bottom:44.1%; line-height:1em; font-size:2.8vw; text-align:right; height:3%; width:15%; color:var(--Color_LOWFOCUS);}


#VRAzanCOMES { position:absolute; z-index:400;
	left:0%; top:0%; width:100%; height:52%;
	line-height:1.9em; text-align:center; font-family:'Amiri';
	z-index:99991; font-size:calc(var(--FOXEN) * 9.1vw); 
	background:var(--Color_BGTUBE);
	color:var(--Color_SEKSALATS);}

#eeeTextAZAN {margin-top:31%;}
#eeeNowNAMEazan {font-size:190%; color:var(--Color_CLOCK);}
#eeeTopTIME {position:absolute; right:3%; top:3%; font-family:var(--XX_DIGITS); 
	 line-height:1em; font-size:7vw; color:var(--Color_CLOCK);}

#VRIQAMATIME { position:absolute;
	left:0%; top:0%; width:100%; height:100%;
	line-height:1em; text-align:center; font-family:'Amiri';
	z-index:99991; font-size:calc(var(--FOXEN) * 13vw); 
	background:var(--Color_BGTUBE);
	color:var(--Color_CLOCK);}

#VRnowIQAMA {margin-top:71%;}




#VReAyatsHDR {position:absolute; font-family:'Amiri'; 
	text-align:center; left:.5%; top:43.8%; 
	z-index:500; height:8%; width:99%; font-size:5.8vw; 
	color:var(--Color_GOLDEN);
	text-shadow:var(--TXT_SHDW);}


#VR_TITLES 	{position:absolute; right:0%; top:52.3%; direction:ltr; height:4%; width:67%; font-family:var(--XX_MAJORFONTO); line-height:1em;}
#VR_TITLES:lang(AR) 	{width:64%; direction:rtl;}
#VR_TITLES:lang(UR) 	{width:64%; direction:rtl;}

#ewSALAT, #ewAZAN, #ewIQAMA {text-align:center; text-transform:uppercase; font-size:calc(var(--FOXEN) * 3.4vw);}
#ewSALAT:lang(AR), #ewAZAN:lang(AR), #ewIQAMA:lang(AR) {font-size:calc(var(--FOXEN) * 3.5vw);}
#ewSALAT:lang(UR), #ewAZAN:lang(UR), #ewIQAMA:lang(UR) {font-size:calc(var(--FOXEN) * 3.5vw);}

#VRePrayersHDR 		{font-family:var(--XX_DIGITS); position:absolute; right:1%; top:var(--RoundsVrTOP); height:43%; width:67%;}
.cccROUND			{position:relative; border-radius:75px; left:0%; top:0px; height:13%; width:100%; margin-bottom:2.5%; background:var(--bgSemiLITE); opacity:0.5; }
.cccROUND_ACTIVE	{position:relative; border-radius:75px; left:0%; top:0px; height:13%; width:100%; margin-bottom:2.5%; background:var(--bgSemiLITE); opacity:1; }


#VReVERSIO	{position:absolute; font-size:3vw; text-align:center; z-index:99; left:0%; bottom:1%; width:100%; padding:0.7%; z-index:1300; color:var(--Color_LOWFOCUS);  opacity:0.65;}
#VReALERT {position:absolute;font-family:'Amiri'; font-size:calc(var(--FOXEN) * 4.7vw); z-index:109; visibility:hidden; left:0%; bottom:1.5%; width:100%; line-height:1.2em; text-align:center; color:var(--Color_CLOCK);}



.eeeNAME {font-family:var(--XX_MAJORFONTO); position:absolute; left:var(--OffIqmatNamesPOZ); font-size:5.9vw; bottom:17%; line-height:1em; color:var(--Color_SEKSALATS);}
.eeeNAME:lang(AR) {right:var(--OffIqmatNamesPOZ); font-size:6.1vw; bottom:19.1%; text-align:right;}
.eeeNAME:lang(UR) {right:var(--OffIqmatNamesPOZ); font-size:6.1vw; bottom:19.1%; text-align:right;}


.eeeHOUR {position:absolute; text-align:right; right:var(--OffIqmatHoursEnPOZ); bottom:11%; font-size:6.7vw; line-height:1em; letter-spacing: 0.065em;  color:var(--Color_CLOCK);}
.eeeHOUR:lang(AR) {right:var(--OffIqmatHoursArPOZ);}
.eeeHOUR:lang(UR) {right:var(--OffIqmatHoursArPOZ);}

.eeeIQAMA				{position:absolute; right:4%; bottom:11%; text-align:right; width:27%; line-height:1em; font-size:6.7vw; visibility:var(--IQAMAT); color:var(--Color_SEKSALATS); }
.eeeIQAMA:lang(AR)	{left:3%;}
.eeeIQAMA:lang(UR)	{left:3%;}

#VRdemain {position:absolute; line-height:1em; right:5%; top:-33%; font-size:2.8vw; color:var(--Color_LOWFOCUS);text-shadow:none;}


select {width:100%; padding:1%; text-align:right; font-size:102%;}
select optgroup{padding:1.5%;  color:#913E23;}
select option{padding:1.5%; text-align:right; color:#252525;}


button {margin-top:5%; width:60%; font-size:3.5vw; padding:2%;}


#eHELPSCREEN 	{position:absolute; height:100%; width:100%; left:0px; top:0%; visibility:hidden; font-size:3.0vw; z-index:99998; background:#151515;}
.cssSET 		{position:absolute; display:table; left:0%; top:0%; width:100%; height:5%; background-color:#282828;}
.cssMenuBTN 	{width:90%; padding:3.4%; cursor:pointer;}
.cssMenuGRP 	{position:absolute;font-family:var(--XX_MAJORFONTO); font-size:calc(var(--FOXEN) * 4.2vw); line-height:1em; left:0%; top:6%; width:100%; height:94%;  overflow-y:auto; }


.cssModelSettingsWINDOW	{font-family:var(--XX_MAJORFONTO); font-size:calc(var(--FOXEN) * 3.6vw); position:absolute; width:100%; height:100%; left:0%; top:0%; visibility:hidden; z-index:99993; background:#151515;}
.cssTitlesHOLDER		{position:absolute; display:table; left:0%; top:0%; width:100%; height:6%;}
.cssSettingsDATA		{position:absolute; left:0%; top:6%; width:94%; height:88%; padding:3%;  overflow-y:auto;}


.cssNoMOBILE {position:absolute; left:30%; top:40%; width:40%; height:auto; visibility:hidden;}
.cssCheckBOX {height:4vw; width:5vw;}
.cccADJUSTER	{font-size:3vw; height:5vw; width:6vw;}



.CSS_AR33 {font-family:var(--XX_MAJORFONTO);    font-size:calc(var(--FOXEN) * 4.2vw); cursor:pointer;}
.CSS_AR44 {font-family:var(--XX_MAJORFONTO);    font-size:calc(var(--FOXEN) * 3.4vw); cursor:pointer;}
.CSS_EN33 {font-family:var(--XX_DIGITS); font-size:2.8vw; cursor:pointer;}

input[type='radio'] { vertical-align:middle; width:3.5vw; height:3.5vw;}

#AAA_ForcedVERTICAL{display:none;}
}


/* ================================================================================== */
/* ================================================================================== */
/* ================================================================================== */
/* ================================================================================== */
/* ================================================================================== */

.otoHIDN {opacity:var(--OPAK);}

.CSS_X_LANG_DIRECTION {direction:var(--XX_LANG_DIR);}

.SSoff {visibility:hidden;  opacity:0; transition: visibility 0s linear 2.1s, opacity 2.1s linear;}
.SSon  {visibility:visible; opacity:1; transition: opacity 1.7s linear;}

.CSS_BlackSCREEN {position:absolute; z-index:996; left:0px; top:0px; height:100%; width:0%; transition: width 4s ease-out; background:black;}

.CSS_FullCONTO   {position:absolute; z-index:999; left:0px; top:0px; height:0%; width:100%; transition: height 4s ease-out;}

.CSS_FullCONTO  #ELAYATS {position:absolute; left:3%; top:11%; font-family:'Amiri'; 
							width:94%; height:15%; 
							text-align:center; 
							direction:rtl;
							font-size:3.1vw; 
							 color:var(--Color_GOLDEN);
							line-height:1.8em;
							font-weight: bold;
							text-shadow:var(--TXT_SHDW);
							color:var(--Color_SEKSALATS);}

/* background-color:black; opacity:0.95; */							
.CSS_FullCONTO  #ELKLOKO {position:absolute; right:2%; top:4px; font-family:var(--XX_DIGITS); width:20%; text-align:right; font-size:3.4vw;color:var(--Color_CLOCK);}

.CSS_FullCONTO  #ELBLACK {position:absolute; left:0; top:0; 
				height:100%; width:100%; }

.CSS_FullCONTO  #ELHOLDO {visibility:hidden; position:absolute; left:0; top:0%; 
				height:100%; width:100%;
				display: table-cell;
				text-align:center;
				vertical-align: middle;}
				
.CSS_FullCONTO  #ELCONTO { 
				font-size:23vw;
				line-height:1em;
				margin-top:15%; 
				font-family :var(--XX_DIGITS);
				color:var(--Color_SEKSALATS);
				text-shadow:var(--TXT_SHDW);}
				
.CSS_FullCONTO  #ELMOBIL {position:absolute; left:3%; top:30%;
				width:17%; height:auto;}


.CSS_PANO3_VISIBLE	{opacity:0.95; transition: all 3s ease-out;}
.CSS_PANO3_HIDDEN	{opacity:0;    transition: all 3s ease-out;}


.Cxvisible {visibility:visible; opacity: 1; transition: opacity 3s linear;}
.Cxhidden  {visibility:hidden;  opacity: 0; transition: visibility 0s 3s, opacity 3s linear;}


.lw	{color:var(--Color_LOWFOCUS);opacity:0.7; font-size:80%;}

.cSans	{font-family :var(--XX_DIGITS);}


.cARPM	{font-family:var(--XX_MAJORFONTO); color:var(--Color_LOWFOCUS); font-size:calc(var(--FOXEN) * 75%);}
.cEnPM	{color:var(--Color_LOWFOCUS);}


.cssColorLITE 	{color:#ACA091;}
.eLiter 		{color:#D2C7AA;}
.sm90 {font-size:90%;}
.sm85 {font-size:85%;}
.sm80 {font-size:80%;}


a {color:#D2C7AA; text-decoration:none;}
.deko {color:var(--Color_CLOCK);}

.cShdw {text-shadow:var(--TXT_SHDW); }


.centro1 {display:table;}
.centro2 {display:table-cell; vertical-align:middle; text-align:center;}
.centro3 {display:table-cell; vertical-align:top;}

.cssDISABLED {pointer-events: none; opacity: 0.4;}



.CSS_VR_THEMER	{width:100%; height:30vw; font-size:3vw; text-align:right; background: url() no-repeat center top; background-size:cover;}
.CSS_HR_THEMER	{width:100%; height:7vw;  font-size:2vw; text-align:right; background: url() no-repeat center top; background-size:cover;}


.cccTBL1	{padding-bottom:2%; border-bottom:2px solid gray;}

.btmline	{border-bottom:1px solid;}

.codePERSO	{color:#D5CCB9; padding:2%; width:93%; overflow-wrap: break-word;}

.w50 {width:50%}
.w40 {width:40%}
.w45 {width:45%}

input[type='checkbox'] { vertical-align:middle;}
label { vertical-align:middle;}

#BtnAudio {position:absolute; bottom:15px; z-index:3000; visibility:hidden;}

.otoDIS {opacity:var(--OPAK);}

.cssWindowCLOSE	{text-align:right; font-size:115%; display:table-cell; vertical-align:middle; background-color:#282828; padding-right:3%;}

.cssWindowTITLE	{width:60%; text-align:left; display:table-cell; vertical-align:middle; color:white; background-color:#282828;}

.cssLocationDATA {width:85%; padding:2% 0 2% 0%; color:white;}

.hnd{cursor:pointer;}

#LangsLINES {position:absolute; left:0%; top:-1%; width:53%; text-align:left; line-height:1.5em; direction:ltr;}
#eMenuGRP {padding-top:3%;}
#mntopo {position:absolute; right:5%; top:35%; font-size:115%;}