@charset "UTF-8";
/*@import url(https://fonts.googleapis.com/earlyaccess/droidarabickufi.css);*/
/*@import url('https://fonts.googleapis.com/css2?family=El+Messiri:wght@400;700&display=swap');*/
/*@import url('https://fonts.googleapis.com/css2?family=Cairo&family=El+Messiri:wght@400;700&display=swap');*/
/*@import url('https://fonts.googleapis.com/css2?family=Cairo&family=El+Messiri:wght@400;700&family=Tajawal:wght@700&display=swap');*/
:root {
--ButtonHvrColor:red;	
--BgBackIntro: transparent; 	
--BgBackFlash: transparent;	
--BgMenuFocusBack: transparent;	
--BgMenuBackColor: transparent;			
--BgBackColor:rgba(10, 75, 112,1);/*rgba(10, 75, 112,1);*/
--WindowsBck: rgba(242, 243, 250,0.9);	/*rgba(212, 216, 250,0.9);*/
--MenuListBck: 			rgba(10, 75, 112,1); 		
--MenuListColor: 		rgba(212, 216, 250,0.7);
--MenuListHvrBck: 		rgba(148, 200, 209,1);		
--MenuListHvrColor: 	blue;
--MenuListActiveBack:	rgba(10, 75, 112,1);		
--MenuListActiveColor:	rgba(212, 216, 250, 0.6);
--ButtonBck:rgba(212, 216, 250,0.6); 	
--ButtonColor:rgba(10, 75, 112,.5); 
--ButtonHvrBack: rgba(10, 75, 112,.2);	/**/
--ButtonColorAftr: blue;
--ButtonCloseWindowBck: rgba(10, 75, 112,0.5);	--ButtonCloseWindowHvrBck:rgba(10, 75, 112,1);
--TitleColor: #fff;			
--TextBck: rgba(212, 216, 250,0.6); 
--TextColor: rgba(0, 0, 0, 1);	
--TextActiveBack : rgba(113, 245, 144,0.4);	
--UrlLineColor:rgba(0, 0, 0, .5);	
--TextDefaultTextColor: rgba(0, 0, 0, .5);		
--bgProgress: 		rgba(10, 75, 112,0.6);	
--bgProgressFocus: 	rgba(10, 75, 112,0.3);	
--bgProgressCursor: rgba(113, 245, 144,0.7);
--TableBorderColor:rgba(212, 216, 250,0.6);
--shadowDeb:rgba(212, 216, 250,0.52);
--shadowFin:rgba(10, 75, 112, 0.90);
--ButtonHeight:40px; 
--ButtonMinWidth:1px;/*20px;*/
--ButtonMaxWidth:70px;/*20px;*/
--ButtonWidth:100%;/*20px;*/
--ButtonFntSz:16px;
}




/* for tartib */

.borderCell{border-width:7px; border-style:ridge; border-color: #8c8672;background-color: #5c5645; color: #ffdd00;font-family: 'Orbitron', sans-serif;font-size:30px ; text-align: center;}
.lien{font-weight: 700;font-size: 1em;color: blue;padding-bottom: 15px;	}.lien:hover{color: rgba(22, 72, 110,0.9);text-decoration: underline;}
.poet{font-weight: 400;font-size: 1em;color: black;padding-bottom: 15px;}
.beyt{font-weight: 500;text-align: center;font-size: 1.5em;color:blue;padding-bottom: 15px;}
.tache{background-color: rgba(61, 99, 138,0.5);border-width: thin;border-top-style: solid;border-top-color: #c9c0af;box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.2);position: relative;width: 100%;margin: 0px 0px 0px 0px;font-weight: 600;text-align: right;font-size: 1.2em;color: black;text-align: center;}
.res {font-size: 3em;padding: 3px;display: inline-block;color: yellow;}
.entete{background: #e8e3c8 ;background-color: #e8e3c8;}
.box-5{border-width: thin;border-top-style: solid;border-top-color: #c9c0af;box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.2);position: relative;width: 100%;margin: 0px 0px 0px 0px;}
/* Deb quiz */
#quiz {text-align: center;margin: 0 0 15px 0;padding: 0;}
#quiz span { text-align: center;box-shadow: inset 0 2px 13px 0px rgba(255, 255, 255, 0.6), inset 0 -9px 10px -5px rgba(0, 0, 0, 0.9), 0 5px 10px -5px black;display: inline-block;margin: 0;background: #5e5954;margin-left: 5px;margin-right: 5px;padding-left: 5px;padding-right: 5px;color: #ffffff;text-shadow: -1px -1px 3px #928c86;font-weight: 600;cursor: move;
font-size: 2em;border-radius: 12%;vertical-align: middle;z-index: 10;cursor: -webkit-grabbing;}
#quiz span:hover {background-color: #928c86;-webkit-transition: all 500ms ease;-moz-transition: all 500ms ease;-o-transition: all 500ms ease;-ms-transition: all 500ms ease;transition: all 500ms ease;}
#quiz span.sortable-chosen {-webkit-transition: all 500ms ease;-moz-transition: all 500ms ease;-o-transition: all 500ms ease;-ms-transition: all 500ms ease;transition: all 500ms ease;background-color: green;}
.chosened {background-color: red !important;content: " ";top: -2px;left: -30px;cursor: move !important;}
.noClass {color: #ffffff;background-color: green;font-size: 30pt;font-weight: 600;cursor: auto;-webkit-box-shadow: none;-moz-box-shadow: none;box-shadow: none;text-shadow: -1px -1px 3px #928c86;border-radius: 0%;vertical-align: middle;z-index: 10;}
.noMove {color: red;background-color: blue;}
/* fin quiz */
	
@media screen and (max-width: 1080px){#quiz span ,.beyt{font-size: 1.5em;}.tache, .poet , .lien {font-size: 1em;}}
@media screen and (max-width: 780px) {#quiz span ,.beyt{font-size: 1em;}.tache, .poet , .lien {font-size: 0.7em;}}
@media screen and (max-width: 480px) {#quiz span ,.beyt{font-size: 0.7em;}.tache, .poet , .lien {font-size: 0.5em;}}

/* deb flipcard */

.flipcardcontainer {display: flex;align-items: center; justify-content: center; width:100%; background-color: transparent;}
.flipcard {position: relative;width: 200px;height: 100px;perspective: 1000px;cursor: pointer;}
.card__container {position: absolute;width: 100%;height: 100%;transform-style: preserve-3d;transition-duration: 1s;}
.card__back, .card__front {display: flex;align-items: center;position: absolute;top: 0;right: 0;bottom: 0;left: 0;width: 100%;height: 100%;padding: 1rem;border: 4px solid #999;border-radius: 5px;background-color: #222;color: #fff;-webkit-backface-visibility: hidden;backface-visibility: hidden;}
.card__front {text-align: center;justify-content: center;font-size: 16px;}
.card__back {transform: rotateY(180deg);background-color: #999;color: #333;font-size: 16px;}
.flipcard:hover .card__container, .flipcard:focus .card__container {transform: rotateY(180deg);transition-duration: 0.5s;}
/* fin flipcard */


/* deb marquee */
.marque-ver {overflow: auto;background: white;position:relative;max-width: 100%;height:6em;margin: 2em auto;border: 10px solid #F0F0FF;overflow: hidden;box-shadow: 0 .25em .5em #CCC,inset 0 0 1em .25em #CCC;}
.marque-ver > div {position:relative;padding: 2em;padding-top: 6em;animation: defilement-ver 20s infinite linear;cursor: pointer;}
.marque-ver:hover > div {animation-play-state: paused;}
.msg {font-size: 1.5em;line-height: 1.5em;}
@keyframes defilement-ver {0% {transform: translate3d(0,0,0);}100% {transform: translate3d(0,-100%,0);}}
/* fin marquee */

/* animations

jellyfall
jellyfall2		
glideInDown		
bounceInDown

bounceInRight bounceInLeft bounceInDrop 
glideInRight glideInLeft glideInUp 
kitchenSink 
bounceInScale bounceInScale2 
springScaleOut hoverJiggle hoverJiggle2 
twirlIn 
rubberband slideInRight slideInLeft 
flipInLeft flipInRight flipInBottom flipInTop 
flyInBottom flyInLeft flyInRight 
*/			

.MiniTitle{color: #fff;text-align: center;font-size:30px;font-weight: 600;}
.TitleMetre{margin: 0;border: 0;font: inherit;vertical-align: baseline;color: var(--TitleColor);font-weight: 600;line-height: 1.5;margin: 0 0 1rem 0;text-transform: uppercase;font-size: 1.5rem;line-height: 1.4;	color: var(--WindowsBck);text-align: right;padding-top: 15px;padding-right: 15px;}
.HugeDiv{display: flex;align-items: center;text-align:center;justify-content: center;/*margin-left : 10px;margin-right: 10px;padding: 4px 4px;box-shadow: 0 0 10px 5px;border-radius: 4px;*/margin-top: 2px;margin-bottom: 4px;//background-color: rgba(242, 243, 250,0.1);color: var(--TextColor);font-family: 'Tajawal', sans-serif;font-size:8px;text-align: center;}
.HugeDiv span{flex: 1;text-align:center;justify-content: center;color:white ; background: var(--BgBackColor);border-color:#d6ccb8;border-width: 1px;border-style: solid;border-radius: 8px;overflow: hidden;box-shadow: 0 4px 4px -2px rgba(0, 0, 0, 0.5);min-width: 50px;margin-left : 1px;margin-right: 1px;cursor: pointer;}
.HugeDiv span:hover{color: yellow;}
.anima {position: absolute;left: 0;top: 0;width: 100%;height: 100%;animation: bounceInScale 2s linear 1;opacity: 1;}

canvas{width: 550px;height: 200px;cursor: pointer;margin-left: auto; margin-right: auto; margin-top : 20px;margin-bottom: 20px;}

@media screen and (max-width: 1680px) {canvas{width: 550px;font-size: 40px;}.HugeDiv{font-size: 20px;}.TitleMetre,.MiniTitle{font-size: 1.5rem;}}
@media screen and (max-width: 1180px) {canvas{width: 450px;font-size: 26px;}.HugeDiv{font-size: 20px;}.TitleMetre,.MiniTitle{font-size: 1.2rem;}}
@media screen and (max-width: 736px){canvas{width: 300px;font-size: 12px;}.HugeDiv{font-size: 16px;}.TitleMetre,.MiniTitle{font-size: 1rem;}}
@media screen and (max-width: 400px){canvas{width: 200px;font-size: 6px;} .HugeDiv{font-size: 12px;}.TitleMetre,.MiniTitle{font-size: 0.8rem;}}

/* deb chart */
@charset "UTF-8";[ng\:cloak],[ng-cloak],[data-ng-cloak],[x-ng-cloak],.ng-cloak,.x-ng-cloak,.ng-hide:not(.ng-hide-animate){display:none !important;}ng\:form{display:block;}.ng-animate-shim{visibility:hidden;}.ng-anchor{position:absolute;}
/* fin chart */

/* deb carousel */
.swiper-container {width: 100%;height: 70%;margin-left: auto;margin-right: auto;}
.swiper-slide {text-align: center;font-size: 20px;background: transparent;/* Center slide text vertically */display: -webkit-box;display: -ms-flexbox;display: -webkit-flex;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;-webkit-justify-content: center;justify-content: center;-webkit-box-align: center;-ms-flex-align: center;-webkit-align-items: center;align-items: center;display: block;}
button.button-hidden {width:8px; height:8px;position: absolute !important;height: 1px; width: 1px; overflow: hidden;clip: rect(1px 1px 1px 1px); /* IE6, IE7 */ clip: rect(1px, 1px, 1px, 1px);}
button.button-hidden:focus {width:8px; height:8px;clip:auto;}
/* f carousel */

/* deb accordion */
.accordion_row {display: flex;}
.accordion_row .accordion_col {flex: 1;}
.accordion_row .accordion_col:last-child {margin-left: 0em;}
.accordion_tabs {border-radius: 8px;overflow: hidden;box-shadow: 0 4px 4px -2px rgba(0, 0, 0, 0.5);}
.accordion_tab {width: 100%;color: white;overflow: hidden;}
.accordion_tab-label {font-size: 1rem;width: 100%;display: flex;justify-content: space-between;padding: 1em;background: transparent;font-weight: bold;cursor: pointer;}
.accordion_tab-label::after {font-size: 1rem;text-align: center;transition: all 0.35s;}
.accordion_tab-label:hover{background: var(--BgBackColor);color:white;}
.tab-content {max-height: 0;padding: 0 1em;color: #2c3e50;background: white;transition: all 0.35s;}
.accordion_row .accordion_col .accordion_tabs .accordion_tab input {background:transparent;width: 0em;height: 0em;visibility: hidden;position: absolute;opacity: 0;z-index: -1;display: none;}
.accordion_row .accordion_col .accordion_tabs .accordion_tab input:checked + .accordion_tab-label {font-size: 1rem;color: white; background: var(--BgBackColor);}
.accordion_row .accordion_col .accordion_tabs .accordion_tab input:checked + .accordion_tab-label::after {font-size: 1rem;transform: rotate(90deg);}
.accordion_row .accordion_col .accordion_tabs .accordion_tab input:checked ~ .tab-content {max-height: 100vh;padding: 1em;}
/* f accordion */

/* debut player */
.DivContainer{ display:flex; flex-direction: column; margin-bottom: 0px ;padding-top: 2px;height: 100%;width: 100%;} 
.DivPlayer{ align-self: flex-end;right: 0;bottom: 0;left: 0;padding-top: 20px;padding-bottom: 20px;text-align: right;width: 100%;}
.DivSpacer{ align-self: flex-end;right: 0;bottom: 0;left: 0;padding-top: 20px;padding-bottom: 20px;}

.NormDiv{font-size: 20px; color: var(--TextColor); font-weight: 700;}
.warninglight {margin-right:30px;border-color:#d6ccb8;border-width: 1px;border-style: solid;text-align: center;font-size: 20px;padding:5px 5px 5px 5px;background-color:#fcf7eb;background-image:url('../images/light.png');background-position:left top;background-repeat:no-repeat;}
.banniere {border-color:#d6ccb8;border-width: 1px;border-style: solid;text-align: center;font-size: 20px;padding:10px 10px 10px 10px;background-color:#fcf7eb;background-image:url('../images/light.png');background-position:left top;background-repeat:no-repeat;background-color: var(--WindowsBck); }
.notepaper {position: relative; margin: 10px auto;padding: 10px 40px 10px 10px;width: 100%;line-height: 30px;color: #6a5f49;text-shadow: 0 1px 1px white; background-color: #f2f6c1; background-image: -webkit-radial-gradient(center, cover, rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0.1) 90%), -webkit-repeating-linear-gradient(top, transparent 0%, transparent 29px, rgba(239, 207, 173, 0.7) 29px, rgba(239, 207, 173, 0.7) 30px); background-image: -moz-radial-gradient(center, cover, rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0.1) 90%), -moz-repeating-linear-gradient(top, transparent 0%, transparent 29px, rgba(239, 207, 173, 0.7) 29px, rgba(239, 207, 173, 0.7) 30px);background-image: -o-radial-gradient(center, cover, rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0.1) 90%), -o-repeating-linear-gradient(top, transparent 0%, transparent 29px, rgba(239, 207, 173, 0.7) 29px, rgba(239, 207, 173, 0.7) 30px); border: 1px solid #c3baaa; border-color: rgba(195, 186, 170, 0.9);-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box; -webkit-box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), inset 0 0 5px #d8e071, 0 0 1px rgba(0, 0, 0, 0.1), 0 2px rgba(0, 0, 0, 0.02);box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), inset 0 0 5px #d8e071, 0 0 1px rgba(0, 0, 0, 0.1), 0 2px rgba(0, 0, 0, 0.02);}
.notepaper:before, .notepaper:after {content: '';position: absolute;top: 0;bottom: 0;}
.notepaper:before {right: 28px;width: 2px;border: solid #efcfad;border-color: rgba(239, 207, 173, 0.9);border-width: 0 1px;}
.notepaper:after {z-index: -1;left: 0;right: 0;background: rgba(242, 246, 193, 0.9);border: 1px solid rgba(170, 157, 134, 0.7);-webkit-transform: rotate(2deg);-moz-transform: rotate(2deg);-ms-transform: rotate(2deg);transform: rotate(2deg);}
.boxbase 	{color: black;padding: 10px 10px 10px 30px;margin-top: 10px;text-align: justify;position: relative; width: 100%;font-size: 20px;background-color: rgba(242, 243, 250,0.5);border-radius: 4px;box-shadow:inset 0 -3em 3em rgba(0,0,0,0.1),0 00 2px rgb(242, 243, 250),0.3em 0.3em 1em rgba(0,0,0,0.3);}/*var(--ButtonFntSz);*/
.playerback {width: 100%;text-align: center;padding: 4px 4px;margin-bottom: 4px;background-color: rgba(242, 243, 250,0.1);color: gray;vertical-align: middle;box-shadow: 0 0 10px 5px;border-radius: 4px;}/* box-shadow: 0 10px 10px -5px;*/
.playerbackclickable {cursor: hand; width: 100%;text-align: center;padding: 4px 4px;margin-bottom: 4px;background-color: rgba(242, 243, 250,0.1);color: gray;vertical-align: middle;box-shadow: 0 0 10px 5px;border-radius: 4px;}
.playerbackclickable:hover{background: rgba(242, 243, 250,0.5);}
.playerback2 {width: 100%;text-align: center;padding: 4px 4px;margin-bottom: 4px;background-color: rgba(182, 232, 252,0.2);color: gray;vertical-align: middle;box-shadow: 0 0 10px 5px;border-radius: 4px;}/* box-shadow: 0 10px 10px -5px;*/
.flex-container {display: flex;}
.flex-child {flex: 1;}  
.inputAdjusted{font-weight: bold;text-align: center; height: 56px; font-size: 1rem;color: white; background: var(--BgBackColor);width :var(--ButtonWidth);/*height:var(--ButtonHeight);*/font-size:var(--ButtonFntSz);font-weight: 600;border-radius: 4px;border: transparent 0px;min-width:50px;}
.ButtonBasicClear,.ButtonBasic,.ButtonHome,.ButtonStop,.ButtonOpenRecorder,.ButtonCloseRecorder,.ButtonPedagogie,.ButtonOk,.ButtonCancel,.ButtonPlayPause,.ButtonToggleLoop,.ButtonToggleRate	{background-color: transparent;/*var(--WindowsBck);*/display: flex; justify-content: center;align-items: center;text-align: center;padding-left: 10px;padding-right: 10px;margin-left: 10px;margin-right: 2px;/* */width :var(--ButtonWidth);/*height:var(--ButtonHeight);*/font-size:var(--ButtonFntSz);font-weight: 600;border-radius: 4px;border: transparent 0px;}	
.ButtonBasicClear{background-image: linear-gradient(white, var(--BgBackColor));color: white;} 
.ButtonBasicClear:hover{background-image: linear-gradient(var(--BgBackColor),white);color: blue;} 
.ButtonBasic,.ButtonHome,.ButtonStop,.ButtonOpenRecorder,.ButtonCloseRecorder,.ButtonPedagogie,.ButtonOk,.ButtonCancel,.ButtonPlayPause,.ButtonToggleLoop,.ButtonToggleRate	{color: var(--ButtonColor);} 
.ButtonBasic:hover,.ButtonHome:hover,.ButtonStop:hover,.ButtonOpenRecorder:hover,.ButtonCloseRecorder:hover,.ButtonPedagogie:hover,.ButtonOk:hover,.ButtonCancel:hover,.ButtonPlayPause:hover,.ButtonToggleLoop:hover,.ButtonToggleRate:hover	{background: var(--ButtonHvrBack);color: var(--ButtonHvrColor);box-shadow: 3px 2px 5px var(--shadowFin) ;}
.ButtonBasicClear:before,.ButtonBasic:before,.ButtonHome:before,.ButtonStop:before,.ButtonOpenRecorder:before,.ButtonCloseRecorder:before,.ButtonPedagogie:before,.ButtonOk:before,.ButtonCancel:before,.ButtonPlayPause:before,.ButtonToggleLoop:before,.ButtonToggleRate:before {color: white;/*var(--ButtonColor);*/ font-style: normal;}
.ButtonPlayPause.active:before,	.ButtonToggleLoop.active:before,.ButtonToggleRate.active:before	{color: blue;/*var(--ButtonColorAftr);*/}
.ButtonHome:before 				{content: "\f015";}
.ButtonStop:before 				{content: "\f04d";}
.ButtonOpenRecorder:before 		{content: "\f130";}
.ButtonCloseRecorder:before 	{content: "\f131";}
.ButtonPedagogie:before 		{content: "\f05a";}
.ButtonOk:before 				{content: "\f00c";}
.ButtonCancel:before 			{content: "\f00d";}
.ButtonPlayPause:before			{content: "\f0d9";}.ButtonPlayPause.active:before {content: "\f04c";}
.ButtonToggleLoop:before 		{content: "\f021";}.ButtonToggleLoop.active:before{content: "\f021";}
.ButtonToggleRate:before 		{content: "0.5X";} .ButtonToggleRate.active:before{content: "1X";}
.ButtonBasic:disabled {background: #ccc;}

/*
f007 : user
f059:question
f05b: target
f0ad: params
f0c0: users
f140:target
f19d:school
f19c school
f013,f085: param

f015: home
f026: volume off
f027: volume down
f02a: volupe up
f02d: book
f071: warning
f07c: folder open
f081,f099: tweeter
f082,f09a:facebook
f084: key
f0b1: cartable
f0eb:كعبة ضو
f13d: مرساة
f19d ecole
f2ce: أداف
*/
.progress {-webkit-appearance: none;width: 100%;height: 10px;}
.div-icon {font-size: 16px;color:var(--bgProgress);width: 100%;height: 100%;}/* margin-top: -18px; */
@media screen and (max-width: 1680px) {.inputAdjusted{height: 56px;}}
@media screen and (max-width: 1180px) {.inputAdjusted{height: 54px;}}
@media screen and (max-width: 736px) {.inputAdjusted{height: 52px;}}
@media screen and (max-width: 360px) {.inputAdjusted{height: 50px;}}


@media screen and (max-width: 1680px) {.inputAdjusted,.ButtonBasic,.ButtonOk, .ButtonCancel, .ButtonPlayPause,.ButtonToggleLoop,.ButtonToggleRate,.ButtonStop,.ButtonOpenRecorder,.ButtonCloseRecorder,.ButtonPedagogie,.ButtonHome {font-size: 26px;}}
@media screen and (max-width: 1180px) {.inputAdjusted,.ButtonBasic,.ButtonOk, .ButtonCancel, .ButtonPlayPause,.ButtonToggleLoop,.ButtonToggleRate,.ButtonStop,.ButtonOpenRecorder,.ButtonCloseRecorder,.ButtonPedagogie,.ButtonHome {font-size: 20px;}}
@media screen and (max-width: 736px)  {.inputAdjusted,.ButtonBasic,.ButtonOk, .ButtonCancel, .ButtonPlayPause,.ButtonToggleLoop,.ButtonToggleRate,.ButtonStop,.ButtonOpenRecorder,.ButtonCloseRecorder,.ButtonPedagogie,.ButtonHome {font-size: 16px;}}
@media screen and (max-width: 360px)  {.inputAdjusted,.ButtonBasic,.ButtonOk, .ButtonCancel, .ButtonPlayPause,.ButtonToggleLoop,.ButtonToggleRate,.ButtonStop,.ButtonOpenRecorder,.ButtonCloseRecorder,.ButtonPedagogie,.ButtonHome {font-size: 12px;}}
height: 56px;
/* fin player */

html, body, div, applet, object,iframe, h1, h3, h4, h5, h6, p, blockquote,pre, a, abbr, acronym, address, big, cite,code, del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var, b,u, i, center, dl, dt, dd, ol, ul, li, fieldset,form, label, legend, table, caption, tbody,tfoot, thead, tr, th, td, article, aside,canvas, details, embed, figure, figcaption,footer, header, hgroup, menu, nav, output, ruby,section, summary, time, mark, audio, video {margin: 0;padding: 0;border: 0;font: inherit;vertical-align: baseline;}
article, aside, details, figcaption, figure,footer, header, hgroup, menu, nav, section {display: block;}
body {line-height: 1;
/*display: grid;
place-items: center;
user-select: none;*/
color: black;

}

ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {content: '';content: none;}
table {border-collapse: collapse;border-spacing: 0;color: black;}
/*body {-webkit-text-size-adjust: none;}*/
mark {background-color: var(--TextBck);color: inherit;}
/* Basic */
@-ms-viewport {width: device-width;}
@media screen and (max-width: 480px) {html, body {min-width: 320px;}}
html {box-sizing: border-box;
scroll-behavior: smooth;
}
*, *:before, *:after {box-sizing: inherit;}
body {background:var(--BgBackFlash);}
/*
body.is-preload *, body.is-preload *:before, body.is-preload *:after {-moz-animation: none !important;-webkit-animation: none !important;-ms-animation: none !important;animation: none !important;-moz-transition: none !important;-webkit-transition: none !important;-ms-transition: none !important;transition: none !important;}
*/
/* Type */
html {font-size: var(--ButtonFntSz);}
@media screen and (max-width: 1680px) {html {font-size: 16pt;}}
@media screen and (max-width: 736px) {html {font-size: 14pt;}}
@media screen and (max-width: 360px) {html {font-size: 12pt;}}
body, input{color: var(--TextColor);font-family: "Simplified Arabic", Arial, Serif;font-weight: 300;font-size: var(--ButtonFntSz);line-height: 1.65;}
strong, b {color: var(--TextColor);font-weight: 600;}
em, i {font-style: italic;}
p {margin: 0 0 2rem 0;}


h1, h3, h4, h5, h6 {color: var(--TitleColor);font-weight: 600;line-height: 1.5;margin: 0 0 1rem 0;text-transform: uppercase;}
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {color: #fff;text-decoration: none;}
h1.major, h2.major, h3.major, h4.major, h5.major, h6.major {border-bottom: solid 1px var(--TitleColor);width: -moz-max-content;width: -webkit-max-content;width: -ms-max-content;width: max-content;padding-bottom: 0.5rem;margin: 0 0 2rem 0;}
h1 {font-size: 3.25rem;line-height: 1.3;}
h3 {font-size: 2rem;}
h4 {font-size: 1.8rem;}
h5 {font-size: 1.7rem;}
h6 {font-size: 1.6rem;}
h2{font-size: 15px;color: red;}/*var(--TitleColor);*/

.H2Title{
	font-size: 1.5rem;color: var(--TitleColor);font-weight: 800;margin: 0 0 1rem 0;text-transform: uppercase;margin: 0;padding: 0;border: 0;font: inherit;vertical-align: baseline;
	text-align:center;
	}

@media screen and (max-width: 1680px){#main article {padding: 0.8rem 0.8rem 0.8rem 0.8rem;} h1 {font-size: 3.rem; line-height: 1.4;}.H2Title {font-size: 1.5rem;} #header nav ul li a{font-size: 22px;line-height: 1.4;}}
@media screen and (max-width: 1180px){#main article {padding: 0.6rem 0.6rem 0.6rem 0.6rem;} h1 {font-size: 2.7rem;line-height: 1.4;}.H2Title {font-size: 1.2rem;}#header nav ul li a{font-size: 20px;line-height: 1.4;}}
@media screen and (max-width: 736px) {#main article {padding: 0.4rem 0.4rem 0.4rem 0.4rem;} h1 {font-size: 2.3rem;line-height: 1.4;}.H2Title {font-size: 1rem;}#header nav ul li a{font-size: 18px;line-height: 1.4;}}
@media screen and (max-width: 360px) {#main article {padding: 0.2rem 0.2rem 0.2rem 0.2rem;} h1 {font-size: 2rem;line-height: 1.4;}.H2Title {font-size: 0.8rem;}#header nav ul li a{font-size: 16px;line-height: 1.4;}}
*/

sub {font-size: var(--ButtonFntSz);position: relative;top: 0.5rem;}
sup {font-size: var(--ButtonFntSz);position: relative;top: -0.5rem;}
blockquote {border-left: solid 4px var(--TextColor);font-style: italic;margin: 0 0 2rem 0;padding: 0.5rem 0 0.5rem 2rem;}
code {background: var(--TextActiveBack);border-radius: 4px;font-family: "Simplified Arabic", Arial, Serif;font-size: var(--ButtonFntSz);margin: 0 0.25rem;padding: 0.25rem 0.65rem;}
pre {-webkit-overflow-scrolling: touch;font-family: "Simplified Arabic", Arial, Serif;font-size: var(--ButtonFntSz);margin: 0 0 2rem 0;}
pre code {display: block;line-height: 1.75;padding: 1rem 1.5rem;overflow-x: auto;}
hr {border: 0;border-bottom: solid 1px var(--TableBorderColor);margin: 2.75rem 0;}
.align-left {text-align: left;}
.align-center {text-align: center;}
.align-right {text-align: right;}
/* Form */
form {margin: 0 0 2rem 0;}
form > :last-child {margin-bottom: 0;}
form > .fields {display: -moz-flex;display: -webkit-flex;display: -ms-flex;display: flex;-moz-flex-wrap: wrap;-webkit-flex-wrap: wrap;-ms-flex-wrap: wrap;flex-wrap: wrap;width: calc(100% + 3rem);margin: -1.5rem 0 2rem -1.5rem;}
form > .fields > .field {-moz-flex-grow: 0;-webkit-flex-grow: 0;-ms-flex-grow: 0;flex-grow: 0;-moz-flex-shrink: 0;-webkit-flex-shrink: 0;-ms-flex-shrink: 0;flex-shrink: 0;padding: 1.5rem 0 0 1.5rem;width: calc(100% - 1.5rem);}
form > .fields > .field.half {width: calc(50% - 0.75rem);}
form > .fields > .field.third {width: calc(100%/3 - 0.5rem);}
form > .fields > .field.quarter {width: calc(25% - 0.375rem);}
@media screen and (max-width: 480px) {form > .fields {width: calc(100% + 3rem);margin: -1.5rem 0 2rem -1.5rem;}form > .fields > .field {padding: 1.5rem 0 0 1.5rem;width: calc(100% - 1.5rem);}form > .fields > .field.half {width: calc(100% - 1.5rem);}form > .fields > .field.third {width: calc(100% - 1.5rem);}form > .fields > .field.quarter {width: calc(100% - 1.5rem);}}
label {color: var(--TextColor);display: block;font-size: var(--ButtonFntSz);font-weight: 300;line-height: 1.5;margin: 0 0 1rem 0;text-transform: uppercase;}
input,textarea {color: blue;
	background-color: var(--TextBck);-moz-appearance: none;-webkit-appearance: none;-ms-appearance: none;appearance: none;
	-moz-transition: border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out, background-color 0.2s ease-in-out;
	-webkit-transition: border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out, background-color 0.2s ease-in-out;-ms-transition: border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out, background-color 0.2s ease-in-out;
	transition: border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out, background-color 0.2s ease-in-out;
	border-radius: 4px;border: solid 1px blue;display: block;outline: 0;padding: 0 1rem;text-decoration: none;width: 100%;}
input:invalid,textarea:invalid {box-shadow: none;}
input,textarea {background: #dee0e0; border-color: #9da0a1;box-shadow: 0 0 0 1px var(--TableBorderColor);}
input, textarea {-moz-appearance: none;-webkit-appearance: none;-ms-appearance: none;appearance: none;}
textarea{font-size: 60px;}
@media screen and (max-width: 1680px) {textarea{font-size: 60px;}}
@media screen and (max-width: 1180px) {textarea{font-size: 60px;}}
@media screen and (max-width: 736px) {textarea{font-size: 60px;}}
@media screen and (max-width: 360px) {textarea{font-size: 60px;}}




input::-moz-focus-inner {border: 0;padding: 0;}
::-webkit-input-placeholder {color: #b1b2b3 !important;opacity: 1.0;}
:-moz-placeholder 			{color: #b1b2b3 !important;opacity: 1.0;}
::-moz-placeholder 			{color: #b1b2b3 !important;opacity: 1.0;}
:-ms-input-placeholder 		{color: #b1b2b3 !important;opacity: 1.0;}
.formerize-placeholder 		{color: #b1b2b3 !important;opacity: 1.0;}


select {background-color: var(--BgBackColor);color: white;cursor:zoom-in; text-overflow: ellipsis; width: 10em}
select:invalid {box-shadow: none;}
select:focus {color: black;cursor:zoom-out;background: var(--TextActiveBack);border-color: var(--TableBorderColor);box-shadow: 0 0 0 1px var(--TableBorderColor);}
select option {color: blue;background: var(--TextBck);}
select:focus::-ms-value {background-color: var(--TextBck);}
select:focus{cursor:zoom-out;background-color: var(--TextBck);}
select::-ms-expand {cursor:zoom-in;display: none;}

input[type="text"],input[type="password"],input[type="email"] {height: 2.75rem;}

.containerCheck {display: block;position: relative;padding-left: 35px;margin-bottom: 12px;cursor: pointer;font-size: 22px;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}
.containerCheck .checkmark {position: absolute;top: 0;left: 0;height: 25px;width: 25px;background-color: #eee;}
.containerCheck input {position: absolute;opacity: 0;cursor: pointer;height: 0;width: 0;}
.checkmark {position: absolute;top: 0;left: 0;height: 25px;width: 25px;background-color: #eee;}
.containerCheck:hover input ~ .checkmark {background-color: #ccc;}
.containerCheck input:checked ~ .checkmark {background-color: #2196F3;}
.checkmark:after {content: "";position: absolute;display: none;}
.containerCheck input:checked ~ .checkmark:after {display: block;}
.containerCheck .checkmark:after {left: 9px;top: 5px;width: 5px;height: 10px;border: solid white;border-width: 0 3px 3px 0;-webkit-transform: rotate(45deg);-ms-transform: rotate(45deg);transform: rotate(45deg);}

input[type="radio"] {display: none;}
input[type="radio"] + label {position: relative;padding-left: 1.3rem;font-size:1rem;}
input[type="radio"] + label::before,input[type="radio"] + label::after {display: block;position: absolute;box-sizing: border-box;bottom: 0;left: 0;content:'';width: 1rem;height: 1rem;border-radius: 1rem;}
input[type="radio"] + label::before {border: 1px solid #00B7E8;background-color: #eee;color: blue;}
input[type="radio"]:checked + label::after { background-color: #00B7E8;color: blue; }
/* Box */
.box {border-radius: 4px;border: none 1px var(--TableBorderColor);margin-bottom: 2rem;padding: 1.5em;}
.box > :last-child,.box > :last-child > :last-child,.box > :last-child > :last-child > :last-child {margin-bottom: 0;}
.box.alt {border: 0;border-radius: 0;padding: 0;}

/* Icon */
.icon {text-decoration: none;border-bottom: none;position: relative;}
.icon:before {-moz-osx-font-smoothing: grayscale;-webkit-font-smoothing: antialiased;display: inline-block;font-style: normal;font-variant: normal;text-rendering: auto;line-height: 1;text-transform: none !important;font-family: "Simplified Arabic", Arial, Serif;font-weight: 400;}
.icon > .label {display: none;}
.icon:before {line-height: inherit;}
.icon.solid:before {font-weight: 900;}
.icon.brands:before {font-family: "Simplified Arabic", Arial, Serif;}
/* Image */

.image {border-radius: 4px;border: 0;display: inline-block;position: relative;}
.image:before {pointer-events: none;background-image: url("../images/overlay.png");background-color: var(--BgBackColor);border-radius: 4px;content: '';display: block;height: 100%;left: 0;opacity: 0.5;position: absolute;top: 0;width: 100%;}
.image img {border-radius: 4px;display: block;}
.image.left, .image.right {max-width: 40%;}
.image.left img, .image.right img {width: 100%;}
.image.left {float: left;padding: 0 1.5em 1em 0;top: 0.25em;}
.image.right {float: right;padding: 0 0 1em 1.5em;top: 0.25em;}
.image.fit {display: block;margin: 0 0 2rem 0;width: 100%;}
.image.fit img {width: 100%;}
.image.main {display: block;margin: 2.5rem 0;width: 100%;}
.image.main img {width: 100%;}
@media screen and (max-width: 736px) {.image.main {margin: 2rem 0;}}
@media screen and (max-width: 480px) {.image.main {margin: 1.5rem 0;}}
/* List */
ol {list-style: decimal;margin: 0 0 2rem 0;padding-left: 1.25em;}
ol li {padding-left: 0.25em;}
ul {list-style: disc;margin: 0 0 2rem 0;padding-left: 1em;}
ul li {padding-left: 0.1em;}
ul.alt {list-style: none;padding-left: 0;}
ul.alt li {border-top: none 1px var(--TableBorderColor);padding: 0.5em 0;}
ul.alt li:first-child {border-top: 0;padding-top: 0;}
dl {margin: 0 0 2rem 0;}
dl dt {display: block;font-weight: 600;margin: 0 0 1rem 0;}
dl dd {margin-left: 2rem;}
/* Actions */
ul.actions {display: -moz-flex;display: -webkit-flex;display: -ms-flex;display: flex;cursor: default;list-style: none;margin-left: -1rem;padding-left: 0;}
ul.actions li {padding: 0 0 0 1rem;vertical-align: middle;}
ul.actions.special {-moz-justify-content: center;-webkit-justify-content: center;-ms-justify-content: center;justify-content: center;width: 100%;margin-left: 0;}
ul.actions.special li:first-child {padding-left: 0;}
ul.actions.stacked {-moz-flex-direction: column;-webkit-flex-direction: column;-ms-flex-direction: column;flex-direction: column;margin-left: 0;}
ul.actions.stacked li {padding: 1.3rem 0 0 0;}
ul.actions.stacked li:first-child {padding-top: 0;}
ul.actions.fit {width: calc(100% + 1rem);}
ul.actions.fit li {-moz-flex-grow: 1;-webkit-flex-grow: 1;-ms-flex-grow: 1;flex-grow: 1;-moz-flex-shrink: 1;-webkit-flex-shrink: 1;-ms-flex-shrink: 1;flex-shrink: 1;width: 100%;}
ul.actions.fit li > * {width: 100%;}
ul.actions.fit.stacked {width: 100%;}
@media screen and (max-width: 480px) {
	ul.actions:not(.fixed) {-moz-flex-direction: column;-webkit-flex-direction: column;-ms-flex-direction: column;flex-direction: column;margin-left: 0;width: 100% !important;}
	ul.actions:not(.fixed) li {-moz-flex-grow: 1;-webkit-flex-grow: 1;-ms-flex-grow: 1;flex-grow: 1;-moz-flex-shrink: 1;-webkit-flex-shrink: 1;-ms-flex-shrink: 1;flex-shrink: 1;padding: 1rem 0 0 0;text-align: center;width: 100%;}
	ul.actions:not(.fixed) li > * {width: 100%;}
	ul.actions:not(.fixed) li:first-child {padding-top: 0;}
	ul.actions:not(.fixed) li input[type="submit"],ul.actions:not(.fixed) li input[type="reset"],ul.actions:not(.fixed) li input[type="button"],ul.actions:not(.fixed) li button,ul.actions:not(.fixed) li .button {width: 100%;}
	ul.actions:not(.fixed) li input[type="submit"].icon:before,ul.actions:not(.fixed) li input[type="reset"].icon:before,ul.actions:not(.fixed) li input[type="button"].icon:before,ul.actions:not(.fixed) li button.icon:before,ul.actions:not(.fixed) li .button.icon:before {margin-left: -0.5em;}
}
/* Icons */
ul.icons {cursor: default;list-style: none;padding-left: 0;}
ul.icons li {display: inline-block;padding: 0 0.75em 0 0;}
ul.icons li:last-child 	{padding-right: 0;}
ul.icons li a 			{background-color: var(--MenuListBck);color: var(--MenuListColor);border-radius: 100%;box-shadow: inset 0 0 0 1px var(--TableBorderColor);display: inline-block;height: 2.25rem;line-height: 2.25rem;text-align: center;width: 2.25rem;}
ul.icons li a:hover	{background-color: var(--MenuListHvrBck);color: var(--MenuListHvrColor);}
ul.icons li a:active 	{background-color: var(--MenuListActiveBack);color: var(--MenuListActiveColor);}

/*  Deb div avec Vscroll */
/* solution 1 */
.DivtableContainer{width: 100%;display: inline-block;font-size: 13px;}.DivtableContent{overflow-y: scroll;height: 437px;}
/* solution 2 */
.fixTableHead {overflow-y: auto;height: 300px;}.fixTableHead thead th {position: sticky;top: 0;}
/*  fin div avec Vscroll */



table.poem{direction: rtl;margin: auto;width: auto;}
table.poem td {padding-left: 3ex;padding-right: 3ex;text-align: justify;text-align-last: justify;-moz-text-align-last: justify;-webkit-text-align-last: justify;color:rgba(10, 75, 112,1);}
.table2 {width: 95%; /*background: #012B39;*/ background: #fff;border-radius: 0.25em;border-collapse: collapse;margin: 1em;}
.table2 td {font-size: 30px;color: #000;font-weight: 400;padding: 0.6em 0.6em;padding-left: 1ex;padding-right: 0.3ex;text-align: justify;text-align-last: justify;-moz-text-align-last: justify;-webkit-text-align-last: justify;}
.table2 tbody tr {transition: background 0.25s ease;}
.table2 tbody tr:hover {background: #e4e6eb;}

.table3 {width: 95%; /*background: #012B39;*/background: #fff;border-radius: 0.25em;border-collapse: collapse;margin: 1em;}
.table3 td {font-size: 30px;color: #000;font-weight: 400;padding: 0.6em 0.6em;padding-left: 1ex;padding-right: 0.3ex;text-align: right;text-align-last: right;-moz-text-align-last: right;-webkit-text-align-last: right;}
.table3 tbody tr {transition: background 0.25s ease;border-top: 1px solid #b4eef0;}
.table3 tbody tr:hover {background: #e4e6eb;}

.disabled td {color: #4F5F64;}
.charh {cursor: pointer; color: blue;}

@media screen and (max-width: 1680px) {.table2 td,.table3 td{font-size: 1.2rem;}}
@media screen and (max-width: 1180px) {.table2 td,.table3 td{font-size: 1rem;}}
@media screen and (max-width: 736px)  {.table2 td,.table3 td{font-size: .7rem;}}
@media screen and (max-width: 400px)  {.table2 td,.table3 td{font-size: .4rem;}}

.responsive-table {width: 100%;margin-bottom: 1.5em;}
.responsive-table thead {position: absolute;clip: rect(1px 1px 1px 1px);/* IE6, IE7 */clip: rect(1px, 1px, 1px, 1px);padding: 0;border: 0;height: 1px;width: 1px;overflow: hidden;}
.responsive-table thead th {background-color: #1d96b2;border: 1px solid #1d96b2;font-weight: normal;text-align: center;color: white;}
.responsive-table thead th:first-of-type {text-align: left;}
.responsive-table tbody,.responsive-table tr,.responsive-table th,.responsive-table td {display: block;padding: 0;text-align: left;white-space: normal;}
.responsive-table th,.responsive-table td {padding: .5em;vertical-align: middle;}
.responsive-table caption {margin-bottom: 1em;font-size: 1em;font-weight: bold;text-align: center;}
.responsive-table tfoot {font-size: .8em;font-style: italic;}
.responsive-table tbody tr {margin-bottom: 1em;border: 2px solid #1d96b2;}
.responsive-table tbody tr:last-of-type {margin-bottom: 0;}
.responsive-table tbody th[scope="row"] {background-color: #1d96b2;color: white;}
.responsive-table tbody td[data-type=currency] {text-align: right;}
.responsive-table tbody td[data-title]:before {content: attr(data-title);float: left;font-size: .8em;color: rgba(94, 93, 82, 0.75);}
.responsive-table tbody td {text-align: right;border-bottom: 1px solid #1d96b2;}


@media (min-width: 52em) {.responsive-table {font-size: .9em;}
.responsive-table thead {position: relative;clip: auto;height: auto;width: auto;overflow: auto;}
.responsive-table tr {display: table-row;}
.responsive-table th,.responsive-table td {display: table-cell;padding: .5em;}
.responsive-table caption {font-size: 1.5em;}
.responsive-table tbody {display: table-row-group;}
.responsive-table tbody tr {display: table-row;border-width: 1px;}
.responsive-table tbody tr:nth-of-type(even) {background-color: rgba(94, 93, 82, 0.1);}
.responsive-table tbody th[scope="row"] {background-color: transparent;color: #5e5d52;text-align: left;}
.responsive-table tbody td {text-align: center;}.responsive-table tbody td[data-title]:before {content: none;}}
@media (min-width: 62em) {.responsive-table {font-size: 1em;}.responsive-table th,.responsive-table td {padding: .75em .5em;}.responsive-table tfoot {font-size: .9em;}}
@media (min-width: 75em) {.responsive-table th,.responsive-table td {padding: .75em;}}


.table {width: 100%;border-collapse: collapse; }
.table td,.table th {cursor: pointer;padding: 12px 15px;border-top: 1px transparent #393b3d;text-align: center;font-size: 26px;vertical-align: middle;}
.table th {background-color: #9ea1a3;color: #ffffff;}
.table tbody tr:nth-child(even) {background-color: #838587;}
@media (max-width: 500px) {.table thead {display: none;}.table,.table tbody,.table tr,.table td {display: block;width: 100%;}.table tr {margin-bottom: 15px;}
.table td {padding-left: 50%;text-align: left;position: relative;}.table td::before {content: attr(data-label);position: absolute;left: 0;width: 50%;padding-left: 15px;font-size: 15px;font-weight: bold;text-align: left;}}

.Othertable {width: 90%;border-collapse: collapse; text-align: center;background: var(--BgBackColor); border-radius: 0.25em;border-collapse: collapse;margin: 1em;}
.Othertable th{color: #E2B842;font-size: 0.85em;font-weight: 600;padding: 0.5em 1em;text-align: left;}
.Othertable td{color: #fff;font-weight: 400;padding: 0.2em 0.2em;}
.Othertable td:hover { color: cyan;font-weight: 800;}
.Othertable tr{ border-bottom: 1px solid var(--WindowsBck);;margin-top: 10px;}
.Othertable .disabled td {color: #4F5F64;}
.Othertable tbody tr {transition: background 0.25s ease;}
/*.Othertable tbody tr:hover {background: #014055;}*/

.Clicked { padding-top: 5px; padding-bottom: 5px; color: blue;font-weight: 600;text-align: center;cursor: pointer;text-decoration:none;}
.Clicked:hover { color: white;font-weight: 600;text-align: center;cursor: pointer;text-decoration:none;}

.colored {color: blue;font-weight: 600;text-align: center;text-decoration:none;}
.coloredBig {font-size: 1.25em;white-space: nowrap; color: blue;font-weight: 600;text-align: center;text-decoration:none;}
.coloredBig2 {font-size: 1.25em;white-space: nowrap; color: black;font-weight: 600;text-align: center;text-decoration:none;}
.warningclear {color: var(--TitleColor);text-align: center;}
/*.warningclear::hover {color: blue;}*/
.warningdark {color: var(--BgBackColor);text-align: center;}



.centerThings {text-align: center;}
.tabs {margin: 0 auto;width: 100%; /* width of the whole tabs section */border: 1px solid #fff; /* border of the whole tabs section */color: #000; /* color of the text in each tab card */display: flex;flex-wrap: wrap;}
.tabs label {order: 1; /* Put labels first */display: block;padding: 1rem 2rem;margin-right: 0.2rem;cursor: pointer;background: #5D76FF;font-weight: bold;transition: background ease 0.3s;}
.tabs label:hover {background: #8597FF;}
.tabs .tab {order: 99; /* Put tabs last*/flex-grow: 1;width: 100%;min-height: 350px; /* minimum height of the tab content */display: block; /* HIDES unselected tab content with "none" */position: absolute;right: -9999px; /* move everything to the right to hide the content (not selected) */padding: 1rem;background: transparent; /* color of tab content */color: #fff;}
.tabs input[type="radio"] {display: none; /* hides circles of radio style */}
.tabs input[type="radio"]:checked + label {background: #fff; /* color of selected tab */}
.tabs input[type="radio"]:checked + label + .tab {display: block; /* SHOWS selected tab */position: relative;right: 0px;transition: .3s ease;}
@media (max-width: 45em) {.tabs .tab,.tabs label {order: initial;}.tabs label {width: 100%;margin-right: 0;margin-top: 0.2rem;}}




/* Table */
.table-wrapper {-webkit-overflow-scrolling: touch;overflow-x: auto;color: black;}
.tables {margin: 0 0 0rem 0;width: 100%;}
.tables tbody tr {border: yellow 1px var(--TableBorderColor);border-left: 0;border-right: 0;}
.tables tbody tr:nth-child(2n + 1) {background-color: transparent;}
.tables td {padding: 0em 0.25em;color: black;}
.tables th {color: var(--TextColor);font-size: var(--ButtonFntSz);font-weight: 600;padding: 0 0.75em 0.75em 0.75em;text-align: right;}
.tables thead {border-bottom: solid 2px var(--TableBorderColor);}
.tables tfoot {border-top: solid 2px var(--TableBorderColor);}
.tables.alt {border-collapse: separate;}
.tables.alt tbody tr td {border: solid 1px var(--TableBorderColor);border-left-width: 0;border-top-width: 0;}
.tables.alt tbody tr td:first-child {border-left-width: 1px;}
.tables.alt tbody tr:first-child td {border-top-width: 1px;}
.tables.alt thead {border-bottom: 0;}
.tables.alt tfoot {border-top: 0;}
/* Button */
input[type="submit"],input[type="reset"],input[type="button"],button,.button {background-color: var(--ButtonBck);color: var(--TextColor) !important; -moz-appearance: none;-webkit-appearance: none;-ms-appearance: none;appearance: none;-moz-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;-webkit-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;-ms-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;border-radius: 4px;border: 0;box-shadow: inset 0 0 0 1px var(--TableBorderColor);cursor: pointer;display: inline-block;font-size: var(--ButtonFntSz);font-weight: 300;height: 2.75rem;line-height: 2.75rem;outline: 0;padding: 0 1.25rem 0 1.35rem;text-align: center;text-decoration: none;text-transform: uppercase;white-space: nowrap;}
input[type="submit"]:hover,input[type="reset"]:hover,input[type="button"]:hover,button:hover,.button:hover {background-color: var(--ButtonHvrBack);color: var(--ButtonHvrColor);}
input[type="submit"]:active,input[type="reset"]:active,input[type="button"]:active,button:active,.button:active {background-color: var(--ButtonHvrBack);}
input[type="submit"].icon:before,input[type="reset"].icon:before,input[type="button"].icon:before,button.icon:before,.button.icon:before {margin-right: 0.5em;}
input[type="submit"].fit,input[type="reset"].fit,input[type="button"].fit,button.fit,.button.fit {width: 100%;}
input[type="submit"].small,input[type="reset"].small,input[type="button"].small,button.small,.button.small {font-size: var(--ButtonFntSz);height: 2.0625rem;line-height: 2.0625rem;}
input[type="submit"].primary,input[type="reset"].primary,input[type="button"].primary,button.primary,.button.primary {background-color: var(--ButtonBck);color: var(--ButtonColor) !important;font-weight: 600;}
input[type="submit"].disabled, input[type="submit"]:disabled,input[type="reset"].disabled,input[type="reset"]:disabled,input[type="button"].disabled,input[type="button"]:disabled,button.disabled,button:disabled,.button.disabled,.button:disabled {pointer-events: none;cursor: default;opacity: 0.25;}
input[type="submit"],input[type="reset"],input[type="button"],button {line-height: calc(2.75rem - 2px);}
/* BG */
#bg {-moz-transform: scale(1.0);-webkit-transform: scale(1.0);-ms-transform: scale(1.0);transform: scale(1.0);-webkit-backface-visibility: hidden;position: fixed;top: 0;left: 0;width: 100%;height: 100vh;z-index: 1;}
#bg:before, #bg:after {content: '';display: block;position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
#bg:before {-moz-transition: background-color 2.5s ease-in-out;-webkit-transition: background-color 2.5s ease-in-out;-ms-transition: background-color 2.5s ease-in-out;transition: background-color 2.5s ease-in-out;-moz-transition-delay: 0.75s;-webkit-transition-delay: 0.75s;-ms-transition-delay: 0.75s;transition-delay: 0.75s;background-image: linear-gradient(to top, var(--BgBackColor), var(--BgBackColor)), url("../images/overlay.png");background-size: auto, 256px 256px;background-position: center,center;background-repeat: no-repeat,repeat;z-index: 2;}
#bg:after {-moz-transform: scale(1.125);-webkit-transform: scale(1.125);-ms-transform: scale(1.125);transform: scale(1.125);-moz-transition: -moz-transform 0.325s ease-in-out, -moz-filter 0.325s ease-in-out;-webkit-transition: -webkit-transform 0.325s ease-in-out, -webkit-filter 0.325s ease-in-out;-ms-transition: -ms-transform 0.325s ease-in-out, -ms-filter 0.325s ease-in-out;transition: transform 0.325s ease-in-out, filter 0.325s ease-in-out;background-image: url("../images/bg.jpg");background-position: center;background-size: cover;background-repeat: no-repeat;z-index: 1;}
body.is-article-visible #bg:after {-moz-transform: scale(1.0825);-webkit-transform: scale(1.0825);-ms-transform: scale(1.0825);transform: scale(1.0825);-moz-filter: blur(0.2rem);-webkit-filter: blur(0.2rem);-ms-filter: blur(0.2rem);filter: blur(0.2rem);}
body.is-preload #bg:before {background-color: var(--BgBackIntro);}
/* Wrapper */
#wrapper {display: -moz-flex;display: -webkit-flex;display: -ms-flex;display: flex;-moz-flex-direction: column;-webkit-flex-direction: column;-ms-flex-direction: column;flex-direction: column;-moz-align-items: center;-webkit-align-items: center;-ms-align-items: center;align-items: center;-moz-justify-content: space-between;-webkit-justify-content: space-between;-ms-justify-content: space-between;justify-content: space-between;position: relative;min-height: 100vh;width: 100%;
padding: 1rem 1rem;z-index: 3;}
#wrapper:before {content: '';display: block;}
@media screen and (max-width: 1680px) {#wrapper {padding: 3rem 2rem;}}
@media screen and (max-width: 736px) {#wrapper {padding: 2rem 1rem;}}
@media screen and (max-width: 480px) {#wrapper {padding: 1rem;}}
/* Header */
#header {display: -moz-flex;display: -webkit-flex;display: -ms-flex;display: flex;-moz-flex-direction: column;-webkit-flex-direction: column;-ms-flex-direction: column;flex-direction: column;-moz-align-items: center;-webkit-align-items: center;-ms-align-items: center;align-items: center;-moz-transition: -moz-transform 0.325s ease-in-out, -moz-filter 0.325s ease-in-out, opacity 0.325s ease-in-out;-webkit-transition: -webkit-transform 0.325s ease-in-out, -webkit-filter 0.325s ease-in-out, opacity 0.325s ease-in-out;-ms-transition: -ms-transform 0.325s ease-in-out, -ms-filter 0.325s ease-in-out, opacity 0.325s ease-in-out;transition: transform 0.325s ease-in-out, filter 0.325s ease-in-out, opacity 0.325s ease-in-out;background-image: -moz-radial-gradient(var(--BgMenuFocusBack) 25%, var(--BgMenuBackColor) 55%);background-image: -webkit-radial-gradient(var(--BgMenuFocusBack) 25%, var(--BgMenuBackColor) 55%);background-image: -ms-radial-gradient(var(--BgMenuFocusBack) 25%, var(--BgMenuBackColor) 55%);background-image: radial-gradient(var(--BgMenuFocusBack) 25%, var(--BgMenuBackColor) 55%);max-width: 100%;text-align: center;}
#header > * {-moz-transition: opacity 0.325s ease-in-out;-webkit-transition: opacity 0.325s ease-in-out;-ms-transition: opacity 0.325s ease-in-out;transition: opacity 0.325s ease-in-out;position: relative;margin-top: 3.5rem;}
#header > *:before {content: '';display: block;position: absolute;top: calc(-3.5rem - 1px);left: calc(50% - 1px);width: 1px;height: calc(3.5rem + 1px);background: var(--TextColor);}
#header > :first-child {margin-top: 0;}
#header > :first-child:before {display: none;}
#header .logo {width: 5.5rem;height: 5.5rem;line-height: 5.5rem;border: none 1px var(--TableBorderColor);border-radius: 100%;}
#header .logo .icon:before {font-size: 2rem;}
#header .content {border-style: none;border-color: var(--TableBorderColor);border-top-width: 1px;border-bottom-width: 1px;max-width: 100%;}
#header .content .inner {-moz-transition: max-height 0.75s ease, padding 0.15s ease, opacity 0.325s ease-in-out;-webkit-transition: max-height 0.75s ease, padding 0.75s ease, opacity 0.325s ease-in-out;-ms-transition: max-height 0.75s ease, padding 0.75s ease, opacity 0.325s ease-in-out;transition: max-height 0.75s ease, padding 0.75s ease, opacity 0.325s ease-in-out;-moz-transition-delay: 0.25s;-webkit-transition-delay: 0.25s;-ms-transition-delay: 0.25s;transition-delay: 0.25s;padding: 1rem 1rem;max-height: 40rem;overflow: hidden;}
#header .content .inner > :last-child {margin-bottom: 0;}
#header .content p {text-transform: uppercase;font-size: var(--ButtonFntSz);line-height: 2;}

#header nav ul {display: -moz-flex;display: -webkit-flex;display: -ms-flex;display: flex;margin-bottom: 0;list-style: none;padding-left: 0;border: transparent 1px var(--TableBorderColor);border-radius: 4px;}
#header nav ul li {margin: 10px 10px 10px 10px;padding-left: 0;border-left: none 1px var(--TableBorderColor);}
#header nav ul li:first-child {border-left: 0;}
#header nav ul li a 		{background-color: var(--MenuListBck);color: var(--MenuListColor);display: block;height: 2.75rem;line-height: 2.75rem;text-transform: uppercase;font-size: 24px;border-bottom: 0;}
#header nav ul li a:hover {background-color: var(--MenuListHvrBck);color: var(--MenuListHvrColor);}
#header nav ul li a:active{background-color: var(--MenuListActiveBack);color: var(--MenuListActiveColor);}
#header nav.use-middle:after {content: '';display: block;position: absolute;top: 0;left: calc(50% - 1px);width: 1px;height: 100%;background: var(--TextColor);}
#header nav.use-middle ul li.is-middle {border-left: 0;}

body.is-article-visible #header {-moz-transform: scale(0.95);-webkit-transform: scale(0.95);-ms-transform: scale(0.95);transform: scale(0.95);-moz-filter: blur(0.1rem);-webkit-filter: blur(0.1rem);-ms-filter: blur(0.1rem);filter: blur(0.1rem);opacity: 0;}
body.is-preload #header {-moz-filter: blur(0.125rem);-webkit-filter: blur(0.125rem);-ms-filter: blur(0.125rem);filter: blur(0.125rem);}
body.is-preload #header > * {opacity: 0;}
body.is-preload #header .content .inner {max-height: 0;padding-top: 0;padding-bottom: 0;opacity: 0;}
#header .content .inner h1{color: white;}

@media screen and (max-width: 980px) {
	#header .content p br {display: none;}
}
@media screen and (max-width: 736px) {
	#header > * {margin-top: 2rem;}
	#header > *:before {top: calc(-2rem - 1px);height: calc(2rem + 1px);}
	#header .logo {width: 4.75rem;height: 4.75rem;line-height: 4.75rem;}
	#header .logo .icon:before {font-size: 1.75rem;}
	#header .content .inner {padding: 2.5rem 1rem;}
	#header .content p {line-height: 1.875;}
}
@media screen and (max-width: 480px) {
	#header {padding: 1.5rem 0;}
	#header .content .inner {padding: 2.5rem 0;}
	#header nav ul {-moz-flex-direction: column;-webkit-flex-direction: column;-ms-flex-direction: column;flex-direction: column;min-width: 10rem;max-width: 100%;}
	#header nav ul li {padding-left: 2px;padding-right: 2px;border-left: 0;border-top: solid 1px var(--TableBorderColor);}
	#header nav ul li:first-child {border-top: 0;}
	#header nav ul li a {padding-left: 5px;padding-right: 5px;height: 3rem;line-height: 3rem;min-width: 0;width: 100%;}
	#header nav.use-middle:after {display: none;}
}
@media screen and (max-width: 480px) {
	#main article {padding: 3rem 1.5rem 0.5rem 1.5rem ;}
}

/* Main */
#main {-moz-flex-grow: 1;-webkit-flex-grow: 1;-ms-flex-grow: 1;flex-grow: 1;-moz-flex-shrink: 1;-webkit-flex-shrink: 1;-ms-flex-shrink: 1;flex-shrink: 1;display: -moz-flex;display: -webkit-flex;display: -ms-flex;display: flex;-moz-align-items: center;-webkit-align-items: center;-ms-align-items: center;align-items: center;-moz-justify-content: center;-webkit-justify-content: center;-ms-justify-content: center;justify-content: center;-moz-flex-direction: column;-webkit-flex-direction: column;-ms-flex-direction: column;flex-direction: column;position: relative;max-width: 100%;z-index: 3;}
#main article {background-color: var(--BgBackColor);background-image: linear-gradient(var(--BgBackColor), var(--WindowsBck));padding: 1rem 1rem 1rem 1rem ;position: relative;width: 50rem;max-width: 100%;border-radius: 4px;opacity: 0;margin-bottom: 2rem;box-shadow: 0px 20px 20px var(--shadowDeb) ;padding:0 auto;}
#main article.active {opacity: 1;}
#main article .close {display: none;position: absolute;top: 0;right: 0;width: 4rem;height: 4rem;cursor: pointer;text-indent: 4rem;overflow: hidden;white-space: nowrap;}
#main article .close:before 		{background-color: var(--ButtonCloseWindowBck);-moz-transition: background-color 0.2s ease-in-out;-webkit-transition: background-color 0.2s ease-in-out;-ms-transition: background-color 0.2s ease-in-out;transition: background-color 0.2s ease-in-out;content: '';display: block;	position: absolute;top: 0.75rem;left: 0.75rem;width: 2.5rem;height: 2.5rem;border-radius: 100%;background-position: center;	background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='20px' height='20px' viewBox='0 0 20 20' zoomAndPan='disable'%3E%3Cstyle%3Eline %7B stroke: %23ffffff%3B stroke-width: 1%3B %7D%3C/style%3E%3Cline x1='2' y1='2' x2='18' y2='18' /%3E%3Cline x1='18' y1='2' x2='2' y2='18' /%3E%3C/svg%3E");background-size: 20px 20px;background-repeat: no-repeat;}
#main article .close:hover:before 	{background-color: var(--ButtonCloseWindowHvrBck);}
#main article .close:active:before{background-color: var(--ButtonCloseWindowHvrBck);}
#main article .close:before {top: 0.875rem;left: 0.875rem;width: 2.25rem;height: 2.25rem;background-size: 14px 14px;}

/* Footer */
#footer {-moz-transition: -moz-transform 0.325s ease-in-out, -moz-filter 0.325s ease-in-out, opacity 0.325s ease-in-out;-webkit-transition: -webkit-transform 0.325s ease-in-out, -webkit-filter 0.325s ease-in-out, opacity 0.325s ease-in-out;-ms-transition: -ms-transform 0.325s ease-in-out, -ms-filter 0.325s ease-in-out, opacity 0.325s ease-in-out;transition: transform 0.325s ease-in-out, filter 0.325s ease-in-out, opacity 0.325s ease-in-out;width: 100%;max-width: 100%;margin-top: 2rem;text-align: center;}
#footer .copyright {font-size: 0.6rem;opacity: 0.75;margin-bottom: 0;text-transform: uppercase;}
body.is-article-visible #footer {-moz-transform: scale(0.95);-webkit-transform: scale(0.95);-ms-transform: scale(0.95);transform: scale(0.95);-moz-filter: blur(0.1rem);-webkit-filter: blur(0.1rem);-ms-filter: blur(0.1rem);filter: blur(0.1rem);opacity: 0;}
body.is-preload #footer {opacity: 0;}

/* Style the buttons inside the tab */
.tab {overflow: hidden;border: 1px solid #ccc;background-color: #f1f1f1;}
.tab button {background-color: none;float: right;border: none;outline: none;cursor: pointer;padding: 14px 16px;transition: 0.3s;font-size: 1em;}
.tab button:hover {background-color: transparent;}
.tab button.active {background-color: var(--WindowsBck);display: inline-block;}
.tabcontent {display: none;padding: 6px 12px;border: 1px solid #ccc;border-top: none;}



[type="radio"]:checked,[type="radio"]:not(:checked) {position: absolute;left: -9999px;font-size: 8px;}
[type="radio"]:checked + label,[type="radio"]:not(:checked) + label{position: relative;padding-left: 20px;cursor: pointer;line-height: 20px;display: inline-block;font-size: 1em;}
[type="radio"]:checked + label:before,[type="radio"]:not(:checked) + label:before {content: '';position: absolute;left: 0;top: 0;width: 18px;height: 18px;border: 1px solid #ddd;border-radius: 100%;background: #fff;}
[type="radio"]:checked + label:after,[type="radio"]:not(:checked) + label:after {content: '';width: 12px;height: 12px;background: #F87DA9;position: absolute;top: 4px;left: 4px;border-radius: 100%;-webkit-transition: all 0.2s ease;transition: all 0.2s ease;}
[type="radio"]:not(:checked) + label:after {opacity: 0;-webkit-transform: scale(0);transform: scale(0);}
[type="radio"]:checked + label:after {opacity: 1;-webkit-transform: scale(1);transform: scale(1);}

.BlockRadio{display: right;}
/* Popup box BEGIN */
.tooltipCharh { position: relative;display: inline-block;border-bottom: 1px dotted black;color: red;font-weight: 600;}
.tooltipCharh .tooltiptextCharh {visibility: hidden;width: 350px;background-color: black;color: #fff;text-align: right;border-radius: 6px;padding: 5px 0;position: absolute;z-index: 1;top: 100%;left: 50%;margin-left: -60px;}
.tooltipCharh:hover .tooltiptextCharh {visibility: visible;}