@charset "utf-8";
/*icon font begin*/
@font-face {
	 font-family: 'exxiteicon';
	 src:
	 url('exxite.woff2') format('woff2'),
	 url('exxite.woff') format('woff');
	 font-weight: normal;
	 font-style: normal;
	 font-display: block;
 }

/*css variables begin*/
.exxitebody{

    --black-h:0;
		--black-s:0;
		--black-l:0;
		--black-a:1;

		--white-h:0;
		--white-s:0;
		--white-l:100;
		--white-a:1;

		--darkest:hsla(var(--black-h),calc(var(--black-s) * 1%),calc(var(--black-l) * 1%),var(--black-a));
	  --lightest:hsla(var(--white-h),calc(var(--white-s) * 1%),calc(var(--white-l) * 1%),var(--white-a));
		--semidark:hsla(var(--black-h),calc(var(--black-s) * 1%),calc(var(--black-l) * 1%),calc(var(--black-a) * 0.5));
		--semilight:hsla(var(--white-h),calc(var(--white-s) * 1%),calc(var(--white-l) * 1%),calc(var(--white-a) * 0.5));

		--a0: hsla(
			calc(var(--black-h) + calc(calc(var(--white-h) - var(--black-h)) * 0.0 / 15.0)),
			calc(calc(var(--black-s) + calc(calc(var(--white-s) - var(--black-s)) * 0.0 / 15.0)) * 1%),
	    calc(calc(var(--black-l) + calc(calc(var(--white-l) - var(--black-l)) * 0.0 / 15.0)) * 1%),
	    calc(var(--black-a) + calc(calc(var(--white-a) - var(--black-a)) * 0.0 / 15.0))
    );/*#000 --black */
		--a1: hsla(
			calc(var(--black-h) + calc(calc(var(--white-h) - var(--black-h)) * 1.0 / 15.0)),
	    calc(calc(var(--black-s) + calc(calc(var(--white-s) - var(--black-s)) * 1.0 / 15.0)) * 1%),
	    calc(calc(var(--black-l) + calc(calc(var(--white-l) - var(--black-l)) * 1.0 / 15.0)) * 1%),
	    calc(var(--black-a) + calc(calc(var(--white-a) - var(--black-a)) * 1.0 / 15.0))
    );/*#111*/
		--a2: hsla(
			calc(var(--black-h) + calc(calc(var(--white-h) - var(--black-h)) * 2.0 / 15.0)),
	    calc(calc(var(--black-s) + calc(calc(var(--white-s) - var(--black-s)) * 2.0 / 15.0)) * 1%),
	    calc(calc(var(--black-l) + calc(calc(var(--white-l) - var(--black-l)) * 2.0 / 15.0)) * 1%),
	    calc(var(--black-a) + calc(calc(var(--white-a) - var(--black-a)) * 2.0 / 15.0))
    );/*#222*/
		--a3: hsla(
			calc(var(--black-h) + calc(calc(var(--white-h) - var(--black-h)) * 3.0 / 15.0)),
	    calc(calc(var(--black-s) + calc(calc(var(--white-s) - var(--black-s)) * 3.0 / 15.0)) * 1%),
	    calc(calc(var(--black-l) + calc(calc(var(--white-l) - var(--black-l)) * 3.0 / 15.0)) * 1%),
	    calc(var(--black-a) + calc(calc(var(--white-a) - var(--black-a)) * 3.0 / 15.0))
    );/*#333 --bodycolor*/
		--a4: hsla(
			calc(var(--black-h) + calc(calc(var(--white-h) - var(--black-h)) * 4.0 / 15.0)),
	    calc(calc(var(--black-s) + calc(calc(var(--white-s) - var(--black-s)) * 4.0 / 15.0)) * 1%),
	    calc(calc(var(--black-l) + calc(calc(var(--white-l) - var(--black-l)) * 4.0 / 15.0)) * 1%),
	    calc(var(--black-a) + calc(calc(var(--white-a) - var(--black-a)) * 4.0 / 15.0))
    );/*#444*/
		--a5: hsla(
			calc(var(--black-h) + calc(calc(var(--white-h) - var(--black-h)) * 5.0 / 15.0)),
	    calc(calc(var(--black-s) + calc(calc(var(--white-s) - var(--black-s)) * 5.0 / 15.0)) * 1%),
	    calc(calc(var(--black-l) + calc(calc(var(--white-l) - var(--black-l)) * 5.0 / 15.0)) * 1%),
	    calc(var(--black-a) + calc(calc(var(--white-a) - var(--black-a)) * 5.0 / 15.0))
    );/*#555*/
		--a6: hsla(
			calc(var(--black-h) + calc(calc(var(--white-h) - var(--black-h)) * 6.0 / 15.0)),
	    calc(calc(var(--black-s) + calc(calc(var(--white-s) - var(--black-s)) * 6.0 / 15.0)) * 1%),
	    calc(calc(var(--black-l) + calc(calc(var(--white-l) - var(--black-l)) * 6.0 / 15.0)) * 1%),
	    calc(var(--black-a) + calc(calc(var(--white-a) - var(--black-a)) * 6.0 / 15.0))
    );/*#666*/
		--a7: hsla(
			calc(var(--black-h) + calc(calc(var(--white-h) - var(--black-h)) * 7.0 / 15.0)),
	    calc(calc(var(--black-s) + calc(calc(var(--white-s) - var(--black-s)) * 7.0 / 15.0)) * 1%),
	    calc(calc(var(--black-l) + calc(calc(var(--white-l) - var(--black-l)) * 7.0 / 15.0)) * 1%),
	    calc(var(--black-a) + calc(calc(var(--white-a) - var(--black-a)) * 7.0 / 15.0))
    );/*#777*/
		--a8: hsla(
			calc(var(--black-h) + calc(calc(var(--white-h) - var(--black-h)) * 8.0 / 15.0)),
	    calc(calc(var(--black-s) + calc(calc(var(--white-s) - var(--black-s)) * 8.0 / 15.0)) * 1%),
	    calc(calc(var(--black-l) + calc(calc(var(--white-l) - var(--black-l)) * 8.0 / 15.0)) * 1%),
	    calc(var(--black-a) + calc(calc(var(--white-a) - var(--black-a)) * 8.0 / 15.0))
    );/*#888*/
		--a9: hsla(
			calc(var(--black-h) + calc(calc(var(--white-h) - var(--black-h)) * 9.0 / 15.0)),
	    calc(calc(var(--black-s) + calc(calc(var(--white-s) - var(--black-s)) * 9.0 / 15.0)) * 1%),
	    calc(calc(var(--black-l) + calc(calc(var(--white-l) - var(--black-l)) * 9.0 / 15.0)) * 1%),
	    calc(var(--black-a) + calc(calc(var(--white-a) - var(--black-a)) * 9.0 / 15.0))
    );/*#999 --bodycolorlight*/
		--a10: hsla(
			calc(var(--black-h) + calc(calc(var(--white-h) - var(--black-h)) * 10.0 / 15.0)),
	    calc(calc(var(--black-s) + calc(calc(var(--white-s) - var(--black-s)) * 10.0 / 15.0)) * 1%),
	    calc(calc(var(--black-l) + calc(calc(var(--white-l) - var(--black-l)) * 10.0 / 15.0)) * 1%),
	    calc(var(--black-a) + calc(calc(var(--white-a) - var(--black-a)) * 10.0 / 15.0))
    );/*#aaa*/
		--a11: hsla(
			calc(var(--black-h) + calc(calc(var(--white-h) - var(--black-h)) * 11.0 / 15.0)),
	    calc(calc(var(--black-s) + calc(calc(var(--white-s) - var(--black-s)) * 11.0 / 15.0)) * 1%),
	    calc(calc(var(--black-l) + calc(calc(var(--white-l) - var(--black-l)) * 11.0 / 15.0)) * 1%),
	    calc(var(--black-a) + calc(calc(var(--white-a) - var(--black-a)) * 11.0 / 15.0))
    );/*#bbb*/
		--a12: hsla(
			calc(var(--black-h) + calc(calc(var(--white-h) - var(--black-h)) * 12.0 / 15.0)),
	    calc(calc(var(--black-s) + calc(calc(var(--white-s) - var(--black-s)) * 12.0 / 15.0)) * 1%),
	    calc(calc(var(--black-l) + calc(calc(var(--white-l) - var(--black-l)) * 12.0 / 15.0)) * 1%),
	    calc(var(--black-a) + calc(calc(var(--white-a) - var(--black-a)) * 12.0 / 15.0))
    );/*#ccc --border*/
		--a13: hsla(
			calc(var(--black-h) + calc(calc(var(--white-h) - var(--black-h)) * 13.0 / 15.0)),
	    calc(calc(var(--black-s) + calc(calc(var(--white-s) - var(--black-s)) * 13.0 / 15.0)) * 1%),
	    calc(calc(var(--black-l) + calc(calc(var(--white-l) - var(--black-l)) * 13.0 / 15.0)) * 1%),
	    calc(var(--black-a) + calc(calc(var(--white-a) - var(--black-a)) * 13.0 / 15.0))
    );/*#ddd*/
		--a14: hsla(
			calc(var(--black-h) + calc(calc(var(--white-h) - var(--black-h)) * 14.0 / 15.0)),
	    calc(calc(var(--black-s) + calc(calc(var(--white-s) - var(--black-s)) * 14.0 / 15.0)) * 1%),
	    calc(calc(var(--black-l) + calc(calc(var(--white-l) - var(--black-l)) * 14.0 / 15.0)) * 1%),
	    calc(var(--black-a) + calc(calc(var(--white-a) - var(--black-a)) * 14.0 / 15.0))
    );/*#eee --bgaccent*/
		--a15: hsla(
			calc(var(--black-h) + calc(calc(var(--white-h) - var(--black-h)) * 15.0 / 15.0)),
	    calc(calc(var(--black-s) + calc(calc(var(--white-s) - var(--black-s)) * 15.0 / 15.0)) * 1%),
	    calc(calc(var(--black-l) + calc(calc(var(--white-l) - var(--black-l)) * 15.0 / 15.0)) * 1%),
	    calc(var(--black-a) + calc(calc(var(--white-a) - var(--black-a)) * 15.0 / 15.0))
    );/*#fff  --white */


		--darken3:hsla(0,0%,0%,0.3);
		--darken6:hsla(0,0%,0%,0.6);
		--darken9:hsla(0,0%,0%,0.9);
		--lighten3:hsla(0,0%,100%,0.3);
		--lighten6:hsla(0,0%,100%,0.6);
		--lighten9:hsla(0,0%,100%,0.9);



		/*
		Accounted accent color -- not now
		--accent-h:210;
		--accent-s:50;
		--accent-l:40;
		--accent-a:1;

		--acc:hsla(var(--accent-h),calc(var(--accent-s) * 1%),calc(var(--accent-l) * 1%),var(--accent-a));
		--hi-acc:hsla(calc(var(--accent-h) - 18),calc(calc(var(--accent-s) + 50) * 1%),calc(calc(var(--accent-l) + 10) * 1%),var(--accent-a));
   */



		--accent:hsla(192,100%,50%,1);
	  --accentmid:hsla(200.89,100%,30%,1);
	  --accentdark:hsla(200.0,100%,17%,1);
	  --semiaccent:hsla(200.0,100%,30%,0.2);
	  --accentpale:hsla(200.0,40%,60%,1);
	  --accentlight:hsla(200.0,75%,92%,1);



	/*monochromatics*/
  --bodybg:var(--a15);            /*#fefefe page background*/
  --bodycolor:var(--a3);          /*page text color*/
	--bodycolorlight:var(--a6);     /*lighter page text color*/
  --bodywhite:var(--a15);         /*higher background*/
  --bodybgaccent:var(--a14);      /*lower background*/
  --darkbg:var(--a3);             /*dark background -- console*/
  --border:var(--a12);            /*general border color*/


  /*actual coloring*/
	/*--accent:#0cf;                 accent color*/
  --link:var(--accentmid);         /*#369; link color*/
	--link-pale:var(--accentpale);   /*link inactive*/
  --hover:var(--accent);           /*link hover*/
  --visited:var(--accentdark);     /*visited link color*/
  --semihover:var(--semiaccent);   /*transparent hover color*/
	--focus:var(--accentlight);      /*not transparent hover color for tables*/
	--inputfocus:var(--accentlight); /*form input focus color*/


  /*fixed colors with meaning*/
  --info:#cce0f5;         /*messaging info bg*/
  --infoaccent:#26a1dc;   /*messaging info accent*/
  --error:#fee;           /*messaging error bg*/
  --erroraccent:#f66;     /*messaging error accent*/
  --ok:#DBEAD5;           /*messaging ok bg*/
  --okaccent:#2B8D00;     /*messaging ok accent*/
	--question:#333;        /*messaging question bg*/
	--questionaccent:#fa0;  /*messaging question accent*/
	--danger:#fe9;         /*danger warning bg*/
	--dangeraccent:#ff0;    /*danger warning accent*/

  --white:#fff;           /*real white*/
	--lightgray:#999;       /*real white*/
  --gray:#666;            /*gray*/
	--darkgray:#333;        /*dark*/
	--black:#000;           /*real black*/
	--red:#f33;             /*real red*/


	/*special colors*/
	--exxitelogo:#00ABC1;  /*exxite company blue*/
	--notefg:#669;         /*notes color*/
  --notebg:#ffffea;      /*notes background*/

	--consolebg:#333;                      /*console background*/
	--consolefg:#eee;                      /*console foreground*/
	--console-statement:var(--consolefg);  /*console statement -- css*/
	--console-property:#3cf;               /*console property -- css*/
	--console-value:#f33;                  /*console value -- css*/
	--console-default:#eee;                /*console default -- js,php*/
	--console-keyword:#c6f;                /*console keyword -- js,php*/
	--console-string:#6c0;                 /*console string -- js,php*/
	--console-funcname:#69f;               /*console function name -- js,php*/
	--console-comment:#999;                /*console comment -- js,php*/
	--console-html:#fcc;                   /*console html -- js,php*/
	--console-linenumber:#fe3;             /*line number -- libview*/


  --face:'Arial','Helvetica Neue','Roboto',sans-serif;   /*global font face*/
  --codeface:'Consolas','Courier New',monospace;         /*global monospaced font face*/
  --icon:'exxiteicon';                                   /*icon font*/

  --trans:all 0.5s;                                  /*general transition*/
  --transf:all 0.1s;                                 /*fast transition*/
  --transcolor:color  0.5s, background-color 0.5s;    /*general color onlu transition*/

  --stripe-bg:linear-gradient(45deg, rgba(0,0,0,0.12) 25%, rgba(0,0,0,0.05) 25%, rgba(0,0,0,0.05) 50%, rgba(0,0,0,0.12) 50%, rgba(0,0,0,0.12) 75%, rgba(0,0,0,0.05) 75%, rgba(0,0,0,0.05) 100%);     /*form striped submit bg*/
  --stripe-bg-danger:       linear-gradient(45deg, rgba(0,0,0,0.2) 25%, rgba(0,0,0,0.05) 25%, rgba(0,0,0,0.05) 50%, rgba(0,0,0,0.2) 50%, rgba(0,0,0,0.2) 75%, rgba(0,0,0,0.05) 75%, rgba(0,0,0,0.05) 100%); /*form striped danger submit bg*/
	--stripe-bg-danger-strong:linear-gradient(45deg, rgba(0,0,0) 25%, rgba(255,255,0) 25%, rgba(255,255,0) 50%, rgba(0,0,0) 50%, rgba(0,0,0) 75%, rgba(255,255,0) 75%, rgba(255,255,0) 100%); /*form striped danger bg*/
  --stripe-bg-size:40px 40px;
	--checkerboard-bg:        linear-gradient(45deg, var(--border) 25%, transparent 25%),linear-gradient(-45deg, var(--border) 25%, transparent 25%),linear-gradient(45deg, transparent 75%, var(--border) 75%),linear-gradient(-45deg, transparent 75%, var(--border) 75%);
	--form-single:800px;

	--points_svg:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='35' height='7' fill='%23999'%3e%3ccircle cx='3.5' cy='3.5' r='3.5'/%3e%3ccircle cx='13.5' cy='3.5' r='3.5'/%3e%3ccircle cx='23.5' cy='3.5' r='3.5'/%3e%3c/svg%3e");
	--select_svg:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='629' height='512'%3e%3cpath fill='%23999' d='M15.3 175.8L256 416.4l240.7-240.6-80.3-80.2L256 256 95.6 95.6z'/%3e%3c/svg%3e");
}

@media (prefers-color-scheme: dark) {
.exxitebody{
	--black-h:0;
	--black-s:0;
	--black-l:100;
	--black-a:1;

	--white-h:0;
	--white-s:0;
	--white-l:0;
	--white-a:1;



	/*monochromatics*/
  --bodybg:var(--a13);            /*#fefefe page background*/
  --bodycolor:var(--a3);          /*page text color*/
	--bodycolorlight:var(--a6);     /*lighter page text color*/
  --bodywhite:var(--a15);         /*higher background*/
  --bodybgaccent:var(--a12);      /*lower background*/
  --darkbg:var(--a3);             /*dark background -- console*/
  --border:var(--a14);            /*general border color*/

	--accent:hsla(192,100%,60%,1);
	--accentmid:hsla(200.89,100%,50%,1);
	--accentdark:hsla(215.0,100%,50%,1);
	--semiaccent:hsla(200.0,100%,30%,0.2);
	--accentpale:hsla(200.0,41.71%,60.98%,1);
	--accentlight:hsla(201.29,20%,20%,1);

	/*fixed colors with meaning*/
  --info:#036;            /*messaging info bg*/
  --infoaccent:#26a1dc;   /*messaging info accent*/
  --error:#491212;        /*messaging error bg*/
  --erroraccent:#f66;     /*messaging error accent*/
  --ok:#23361b;           /*messaging ok bg*/
  --okaccent:#2B8D00;     /*messaging ok accent*/
	--question:#615b4e;        /*messaging question bg*/
	--questionaccent:#fa0;  /*messaging question accent*/
	--danger:rgba(255,238,153,0.3); /*danger warning bg*/
	--dangeraccent:#ff0;    /*danger warning accent*/

 /*special colors*/
	--consolebg:#111;                      /*console background*/

	--stripe-bg:              linear-gradient(45deg, rgba(0,0,0,0.22) 25%, rgba(255,255,255,0.05) 25%, rgba(255,255,255,0.05) 50%, rgba(0,0,0,0.22) 50%, rgba(0,0,0,0.22) 75%, rgba(255,255,255,0.05) 75%, rgba(255,255,255,0.05) 100%); /*form striped submit bg*/
  --stripe-bg-danger:       linear-gradient(45deg, rgba(0,0,0,0.22) 25%, rgba(255,255,255,0.05) 25%, rgba(255,255,255,0.05) 50%, rgba(0,0,0,0.22) 50%, rgba(0,0,0,0.22) 75%, rgba(255,255,255,0.05) 75%, rgba(255,255,255,0.05) 100%); /*form striped danger submit bg*/
	--stripe-bg-danger-strong:linear-gradient(45deg, rgba(0,0,0) 25%, rgba(255,255,0) 25%, rgba(255,255,0) 50%, rgba(0,0,0) 50%, rgba(0,0,0) 75%, rgba(255,255,0) 75%, rgba(255,255,0) 100%); /*form striped danger bg*/
	--checkerboard-bg:        linear-gradient(45deg, var(--border) 25%, transparent 25%),linear-gradient(-45deg, var(--border) 25%, transparent 25%),linear-gradient(45deg, transparent 75%, var(--border) 75%),linear-gradient(-45deg, transparent 75%, var(--border) 75%);

  }
}

/*css variables  end*/

/*general clearings begin XXX*/
body,div,dl,dd,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,p,blockquote,th,td {margin:0;padding:0; box-sizing:border-box;}
table {border-collapse:collapse;border-spacing:0; margin:0;}
fieldset,img {border:0;}
address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}
ol,ul {list-style: none;}
ol, ul, li {font-family: inherit;font-size: 100%;font-weight: inherit;font-style: inherit;vertical-align: baseline;white-space: normal;text-align: left;margin: 0;padding: 0;border: 0;outline: 0;background: transparent;}
caption,th {text-align:left}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight: normal;}
q:before,q:after{content:'';}
/*general clearings end*/

/*global styles begin XXX*/
.clearfix:after {visibility:hidden;display:block;font-size:0;content:" ";clear:both;height:0;}
div.clear{clear:both;}
.hidden {display:none;}
.shown {display:block;}
.break-word {word-wrap: break-word;}
.left {float:left;}
.right {float:right;}
.center {text-align:center;}
.r {color:var(--red);}
.handle{cursor:move;}
.checkerboard{
  background-image: var(--checkerboard-bg);
  background-size: 20px 20px;
  background-position: 0 0, 0 10px, 10px -10px, -10px 0px;}
.inset{border:none; border-top:2px solid var(--border);}
.edit2save{min-height:20px; min-width:30px; border-bottom:1px solid var(--bodybgaccent);}
.edit2save:focus{outline:none; background:var(--focus)}
.edit2save:hover{background:var(--focus);}
span.huge {font-size: 1.6em; font-weight:normal;}
.trans{transition:var(--trans);}
.transf{transition: var(--transf);}
.transcolor{transition: color  0.5s,background-color 0.5s;}
.top40 {padding-top:40px;}
/*global styles end*/

/*global animations begin XXX*/
@keyframes fade_in
{
	0% {opacity:0;}
  100% {opacity:1;}
}

@keyframes xgrow{
		0% {width:0%; opacity:0;}
		90% {width:102%; opacity:1;}
		100% {width:100%;}
	}
/*global animations end*/

/*body styles begin  XXX*/
body.exxitebody {margin:0px; padding:0px; background:var(--bodybg); color:var(--bodycolor);  font-family:var(--face);  min-height:100vh;}
body.exxitebody a {text-decoration:none;}
body.exxitebody a:link {color: var(--link);}
body.exxitebody a:visited {color:var(--visited);}
body.exxitebody a:hover {color: var(--hover);}
body.exxitebody a:focus {color: var(--hover);}
body.exxitebody a:active,a:hover, a:focus{outline: none;}
body.exxitebody img {border:0; display:block;}
input{color:var(--bodycolor);  font-family:var(--face);}
select{font-family:var(--face);}
button{font-family:var(--face);}
/*body style end*/

/*Browser spec begin XXX*/
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  div#exxitemain{display:none;}
  body.exxitebody:before{display:block; position:fixed; bottom:0; right:0; left:0; background:var(--erroraccent); color:var(--white); font-size:0.8em; padding:30px; text-align:center; position:absolute; z-index:10000;}
  body.exxitebody.hu:before{content:'Az Exxite nem támogatja az Intenet Explorer használatát. Kérjük, használjon modern böngészőt!';}
  body.exxitebody.en:before{content:'Intenet Explorer is not supported anymore. Use a modern browser please.';}
}
/*Browser spec end*/

/*icon font begin XXX*/
div.exxiteicon{font-family:var(--icon); font-weight:normal;}
div.exxiteiconlarge{font-size:2em; height:32px; width:32px;}
div.exxiteiconmid{font-size:2.2em; height:24px; width:24px; line-height:30px;}
div.exxiteiconsmall{font-size:1em; height:16px; width:16px;}
/*icon font end*/



/* insider RTF text style begin XXX*/
div.exxitertf strong {font-weight:bold;}
div.exxitertf h1 {font-size: 1.2em; font-style: normal;font-weight:  normal;color:var(--a6); margin:0 0 10px 0; padding:0;}
div.exxitertf h2 {font-size: 0.85em;font-style: normal;font-weight: bold;color:var(--a6); margin:0 0 10px 0;}
div.exxitertf h3 {font-size: 0.8em;font-style: normal;font-weight: bold;color:var(--a6); margin:0 0 10px 0;}
div.exxitertf h4 {font-size: 0.8em;font-style: normal;font-weight: bold;color: var(--bodycolor);margin:0 0 10px 0;}
div.exxitertf p  {font-size: 0.8em;font-style: normal;font-weight: normal;margin-bottom:20px;margin-top:0; line-height:1.4em;}
div.exxitertf hr {text-align: center;border:0px;height: 3px;width: 20%;color:var(--border);background-color: var(--border);}
div.exxitertf ul {font-size: 0.8em;font-style: normal;font-weight: normal;text-indent: 0px;list-style-position: outside;list-style-type: disc;padding: 0px;margin-top: 5px;margin-bottom: 15px;margin-left: 35px;margin-right: 5px;padding:0}
div.exxitertf ol {font-size: 0.8em;font-style: normal;font-weight: normal;text-indent: 0px;list-style-position: outside;padding: 0px;margin-top: 5px;margin-bottom: 15px;margin-left: 35px;margin-right: 5px;padding:0}

div.exxitertf .small {color: var(--a9);}
div.exxitertf .left {float:left;margin-right:20px;margin-bottom:10px;border:0}
div.exxitertf .right {float:right;margin-left:20px;margin-bottom:10px;border:0}

div.exxitertf pre {font-family:var(--codeface); font-size:12px; padding:0; margin:0; line-height: 16px; overflow:auto; white-space: pre-wrap; white-space: -moz-pre-wrap;}
div.exxitertf pre span {padding:0; margin:0;}
div.exxitertf code {font-family:var(--codeface); font-size:12px; color:var(--link);}
div.exxitertf img {display:block;}
/* insider RTF text style end*/


/*New Drag and drop styles begin*/
div.dragsprite{position:absolute; z-index:10000; opacity:0; max-width:400px;}
div.drop.target{background-color:var(--border);}

div.exxitetrash.active {border-color:var(--red);}
div.dropunder{height:8px; width:100%; overflow:hidden;}
div.dropunderspace{height:8px; width:100%; overflow:hidden;}
div.dropunder.active{height:15px; width:100%; overflow:hidden; background-color:var(--border);}
div.dropunder.huge.active{height:50px; margin-bottom:5px;}
div.dropbetween{width:10px; overflow:hidden;}
div.dropbetween.active{background-color:var(--border); margin:0 10px 0 10px;} /*margin:0 2px 0 2px;*/
div.dragdrop.active{ background-color:var(--border);}
div.drop.active{ background-color:var(--border);}
div.sortitem.dragging{opacity:0.2;}
/*New Drag and drip styles end*/



/*Exxite layout columns begin -- sys/interfacelib.php ifc::XXX*/
div.exxitenav{position:fixed; top:115px; bottom:0; left:0; width:20%; overflow:auto; z-index:100; background:var(--bodybg); container-type:inline-size;}
div.exxitecnt{padding-left:20%;}
div.exxitecntinner{padding:20px 50px 60px 10px;}
div.exxitenav div.control{position:absolute; top:0; bottom:0; right:0; width:20px; cursor:col-resize;}
div.exxitenav div.control:before{content:''; display:block; position:absolute; top:0; bottom:0; width:10px; border-right:1px solid var(--border);}
div.exxitenav div.control:hover:before{border-right:1px solid var(--hover);}
div.exxitenavinner{padding:20px 20px 10px 10px; container-type: inline-size;}
@container(inline-size < 150px)
{
	div.exxitenavinner{display:none;}
}
/*Exxite layout columns end*/

/*exxite console view styles begin -- interfacelib.php -- ifc::console() XXX*/
div.exxiteconsole {max-height:calc(100vh - 300px); min-height:300px; background:var(--consolebg); color: var(--consolefg); overflow:auto; padding:20px; font-size:12px; line-height:1.5em; margin-top:10px; overflow:auto; font-family:var(--codeface);}
div.exxiteconsole span.error{color:var(--erroraccent);}
div.exxiteconsole pre {white-space: pre-wrap;}
div.exxiteconsole span.statement{font-weight:normal; color:var(--console-statement);}
div.exxiteconsole span.property{color:var(--console-property);}
div.exxiteconsole span.value{color:var(--console-value);}
div.exxiteconsole span.default{color:var(--console-default);}
div.exxiteconsole span.keyword{font-weight:bold;color:var(--console-keyword);}
div.exxiteconsole span.string{color:var(--console-string);}
div.exxiteconsole span.html{color:var(--console-html);}
div.exxiteconsole span.funcname{font-weight:bold;color:var(--console-funcname);}
div.exxiteconsole span.comment{font-weight:bold;color:var(--console-comment);}
div.exxiteconsole span.n{color:var(--console-linenumber);}
div.exxiteconsole div{position:relative;}
div.exxiteconsole div:after{content:'>'; display:block; position:absolute; top:0; left:-10px;}
div.gen-ok{color:var(--okaccent);}
div.gen-error{color:var(--erroraccent); font-weight:bold;}
div.exxiteconsole div.console{background:transparent; margin:0; padding:0; color:var(--questionaccent); font-size:100%;}
div.exxiteconsole div.console a{display:none;}
div.exxiteconsole div.console br{display:none;}
div.exxiteconsole-filter{margin:0 0 10px 0;}
/*console styles end*/

/*exxite console view styles end*/

/*Header styles begin -- sys/interfacelib.php -- ifc_header class XXX*/
div.exxitesubheader{
	--headerfg:#ccc;
	--headerbg-darken:var(--darken3);
}
div.exxitesubheader{position:fixed; top:0; left:0; right:0; height:25px; background:var(--headerbg-darken); color:var(--headerfg); z-index:901;}
div.exxitesubheader.offline{background:rgba(255,0,0,0.4);}
div.exxitesubheader.offline:after {content: 'offline';display: block;position: absolute;left: 200px;bottom: -12px;font-size: 2em;color: rgba(255,255,255,0.2);}
div.exxitesubheader.loggedout{background:rgba(255,0,0,0.4);}
div.exxitesubheader.loggedout:before {content: 'logged out';display: block;position: absolute;left: 300px;bottom: -12px;font-size: 2em;color: rgba(255,255,255,0.2);}
div.exxitesubheader p{display:block; float:right; font-size:0.75em; padding:5px 10px 5px 10px}
div.exxitesubheader a{display:block; float:left; text-decoration:none; font-size:0.75em; padding:5px 10px 0 10px; height:25px;}
div.exxitesubheader a:link{color:var(--headerfg);}
div.exxitesubheader a:visited{color:var(--headerfg);}
div.exxitesubheader a:hover{color:var(--hover);}

div.exxiteheader{
	--headerbg:#333;
	--headerfg:#ccc;
	--headerlogo:rgba(255,255,255,0.8);
	--headerlogo-hover:#fff;
}
@media (prefers-color-scheme: dark) {
	div.exxiteheader{
		--headerbg:#222;
	}
}
div.exxiteheader{position:fixed; top:0; left:0; right:0; height:80px; background:var(--headerbg); padding:25px 10px 0 5px; z-index:900;}
div.exxiteheader div.logo{font-family:var(--icon); color: var(--headerfg); font-size:6em; line-height:0.5em; position:absolute; top:25px; left:5px; cursor:default;}
div.exxiteheader div.logo:after{content:'\00E9'; position:absolute; top:0; left:0;}
div.exxiteheader a.logo{font-family:var(--icon); text-decoration:none; font-size:6em; line-height:0.5em; position:absolute; top:25px; left:5px; width:100px; height:50px;}
div.exxiteheader a.logo:link{color:var(--headerlogo); }
div.exxiteheader a.logo:visited{color:var(--headerlogo);}
div.exxiteheader a.logo:hover{color:var(--headerlogo-hover);}
div.exxiteheader a.logo:focus{color:var(--headerlogo-hover);}
div.exxiteheader a.logo:after{content:'\00E9'; position:absolute; top:0; left:0;}
div.exxiteheader div.site{position:absolute; top:25px; right:0; font-size:3.3em; padding:0 20px 0 0; margin:-10px  10px 0 0; color:rgba(255,255,255,0.1); background-position:right 15px; background-repeat:no-repeat; background-size:24px; cursor:default;}
div.exxiteheader div.site a{display:block; position:absolute; top:0; left:0; bottom:0; right:0;}
div.exxiteheader div.site:hover{color:rgba(255,255,255,0.5);}

div.exxitemenu{
	--headerbg:#333;
	--headerfg:#ccc;
	--headerlogo-hover:#fff;
}
@media (prefers-color-scheme: dark) {
	div.exxitemenu{
		--headerbg:#222;
	}
}
div.exxitemenu{margin: 0 10px 0 180px; position:fixed; top:25px;  z-index:902;}
div.exxitemenu a{display:block; float:left; text-decoration:none; text-transform:uppercase; font-size:0.75em; padding:20px; height:11px; overflow:hidden; margin:0 1px 0 0;}
div.exxitemenu a:link{color:var(--headerfg); border-bottom:4px solid var(--headerbg);}
div.exxitemenu a:visited{color:var(--headerfg); border-bottom:4px solid var(--headerbg);}
div.exxitemenu a:hover{color:var(--headerlogo-hover); background:rgba(255,255,255,0.1); border-bottom:4px solid var(--hover);}
div.exxitemenu a:focus{color:var(--headerlogo-hover); background:rgba(255,255,255,0.1); border-bottom:4px solid var(--hover);}
div.exxitemenu a:active{color:var(--hover); border-bottom:4px solid var(--headerbg);}
div.exxitemenu a.sel{border-bottom:4px solid var(--hover); background:rgba(255,255,255,0.1)}

div.exxiteheaderholder{height:115px;}

div.exxitemainmenu{position:fixed; top:80px; left:0; right:0; background:var(--bodybgaccent); height:35px;  border-bottom:1px solid var(--border); z-index:903;}
body.scrolled_down  div.exxitemainmenu{box-shadow: 0 3px 3px 0 rgba(0,0,0,0.3);}

@media screen and (max-width:800px){
  div.exxiteheader{height:135px;position:absolute;}
  div.exxitesubheader{position:absolute;}
  div.exxitemainmenu{top:135px;position:absolute;}
  div.exxitemenu{position:absolute;}
  div.exxiteheaderholder{height:180px;}
}

@media screen and (max-width:920px){
  div.exxiteheader a.logo{display:none;}
  div.exxitemenu{margin:0 10px 0 10px;}
}

@media screen and (max-width:1200px){
  div.exxiteheader div.site{height:50px; width:50px;}
  div.exxiteheader div.site span{display:none;}
}
/*Header styles end*/

/*exxite footer styles begin sys/interfacelib.php ifc::footer()XXX*/
div.exxitefooter{position:fixed; bottom:0; right:0; font-size: 0.7em; padding:4px 20px 6px 20px; text-align:center; background:var(--bodybgaccent); z-index:20; border-radius:2px 0 0 0;}
div.exxitefooter strong{font-weight:bold;}
/*exxite footer styles end*/

/*splash screen styles begin -- sys/interfacelib.php ifc::splash()XXX*/
div.exxitesplash {margin:5%; text-align:center; padding:0; cursor:default; overflow:hidden; cursor:pointer;}
div.exxitesplash div.logo{font-size:20em; line-height:0.4em; color:var(--exxitelogo);}
div.exxitesplash div.logo:hover {color:var(--accent);}

@keyframes splash
{
	0%   {transform: rotate(-8deg) translate(0, -200%);}
	100% {transform: rotate(0deg) translate(0, 70%);}
}
@keyframes splashback
{
	0%   {transform: rotate(0deg) translate(0, 70%);}
	100% {transform: rotate(-8deg) translate(0, -200%);}
}
div.splashbg {position: fixed; top: 0; right: 0; left: 0; bottom: 0;  z-index: 100000; display: grid; backdrop-filter: grayscale(1); cursor:pointer;}
div.splash{align-self:start; justify-self:center; text-align:center; transform: rotate(0deg) translate(0,70%); animation-name:splash; animation-duration:0.5s; animation-iteration-count:1;}
div.splash:after{content: ''; display: block; position: absolute; background: var(--bodybg); width: 1500%; height: 500%; top: 0; left: 0; transform-origin:0 0; transform: rotate(8deg) translate(-90%, -70%); z-index: -1; box-shadow: 0 0 100px rgb(0 0 0 / 50%);}
div.splash h1{font-family:var(--icon); font-size:20vw; color:var(--exxitelogo); transition: var(--transcolor);}
div.splash h1:hover{color:var(--accent);}
div.splash p{font-size:0.8em; color:var(--gray); margin-top:-7vw;}
div.splash.back{animation-name:splashback; animation-duration:0.5s; animation-iteration-count:1; transform: rotate(-8deg) translate(0,-200%);}
/*splash screen styles end*/

/*error message frame styles begin -- ini.php XXX*/
div.console {background:var(--bodybgaccent); padding:10px; font-size:75%; margin:20px; position:relative;}
div.consolebutton {font-size:0.6em; position:absolute; top:0px; right:5px;}
div.consolebutton a{display:block; padding:4px;}
div.consolebutton {width:16px; height:16px; color:rgba(0,0,0,0.5); font-size:1.5em;}
div.dbconsole {background:var(--error); padding:10px; font-size:80%; margin:20px;}
/*error message frame styles end*/


/*local menu styles begin -- interfacelib -- classifc_menu XXX*/
div.localmenu{
	--localmenuhover:var(--a13)
}
div.localmenu {margin:0px 0 10px 0;}
div.localmenuitem {font-size:0.75em;  border-bottom:1px solid var(--border); position:relative; text-overflow: ellipsis; overflow:hidden;}
div.localmenuitem span.icon{position:absolute; top:5px; right:10px; bottom:0; font-family: var(--icon); font-size:1.4em; color:var(--link); cursor:pointer; pointer-events: none;}
div.localmenuitem:hover span.icon{color:var(--hover);}
div.localmenuitem a {display:block; padding:7px 15px 7px 15px;}
div.localmenuitem a:link {color:var(--link);}
div.localmenuitem a:visited {color:var(--link);}
div.localmenuitem a:hover {color:var(--hover); background:var(--bodycolorlight);}
div.localmenuitem a:focus {color:var(--hover); background:var(--bodycolorlight);}

div.localmenuitem.module a{border:none; position:relative; padding-left:40px;}
div.localmenuitem.module a:after{content:'R'; font-family:var(--icon); display:block; position:absolute; left:15px; top:50%; transform:translate(0,-50%); color:var(--link);}
div.localmenuitem.module a:hover:after{color:var(--hover);}

div.localmenuitemsel {background:var(--border); font-size:0.7em;  border-bottom:1px solid var(--border); font-weight:bold;}
div.localmenuitemsel a {display:block; padding:7px 15px 7px 15px;}
div.localmenuitemsel a:link {color:var(--link);}
div.localmenuitemsel a:visited {color:var(--link);}
div.localmenuitemsel a:hover {color:var(--hover); background:var(--localmenuhover);}
div.localmenuitemsel a:focus {color:var(--hover); background:var(--localmenuhover);}
/*local menu styles end*/



/*new tree controls styles begin*/
div.treebasex{background:var(--bodybgaccent); padding:5px 10px 10px 10px; margin:0 0 10px 0;}
ul.treex{display:block; margin:5px 0 0 0;}
ul.treex a.label{float:left;display:block; box-sizing:border-box; text-decoration:none; font-size:0.8em; height:25px; padding:5px 5px 5px 30px; background:url(folder.svg) no-repeat 5px center; background-size:17px; transition: all 0.2s; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; max-width:100%;}
ul.treex a.label:link{color:var(--link);}
ul.treex a.label:visited{color:var(--link);}
ul.treex a.label:hover{color:var(--hover); background-color:var(--bodywhite);}
ul.treex a.label:active{background-color:rgba(0,0,0,0.8); color:var(--bodywhite);}
ul.treex a.label.sel{background-color:var(--border); color:var(--bodycolor);}
ul.treex a.label.drop.target{background-color:var(--border);}

ul.treex ul{margin:0;}
ul.treex li{margin:0 0 5px 30px;}
ul.treex ul:before{visibility:hidden;display:block;font-size:0;content:' ';clear:both;height:0;}
ul.treex li:after{visibility:hidden;display:block;font-size:0;content:' ';clear:both;height:0;}
ul.treex ul.closed{display:none;}
ul.treex ul.open{display:block;}
ul.treex a.cross{float:left;display:block; margin:0 0 0 -25px; box-sizing:border-box; height:25px; width:25px; transition: background-color 0.5s; position:relative;}
ul.treex a.cross:after{content:'('; display:block; background:var(--bodycolorlight); font-family:var(--icon); position:absolute; top:6px; left:6px; bottom:6px; right:6px; color:var(--bodybg); text-align:center; font-size:11px;}
ul.treex a.cross:hover{background-color:var(--bodywhite);}
ul.treex a.cross.open:after{content:'(';}
ul.treex a.cross.closed:after{content:',';}

ul.treex div.treex-item{display:grid; grid-template-columns: 20px auto;}
ul.treex div.handle{position:relative;}
ul.treex div.handle:after{content:'w'; display:block; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); font-family: var(--icon); color:var(--a9);}
ul.treex div.handle:hover:after{color:var(--hover);}
div.treex-item a.label{float:left;display:block; box-sizing:border-box; text-decoration:none; font-size:0.8em; height:25px; padding:5px 5px 5px 30px; background:url(folder.svg) no-repeat 5px center; background-size:17px; transition: var(--trans); white-space:nowrap; text-overflow:ellipsis; overflow:hidden; cursor:default;}
div.treex-item a.label:hover{color:var(--link);}
div.treex-item div.treex-under{height:8px; grid-column-start:2; grid-column-end:3; max-width:400px; transition: all 0.2s;}
div.treex-item div.treex-under.target{height:25px; background-color:var(--border); margin:0 0 0 25px;}
/*New tree control styles end*/

/*sidebar styles begin*/
div.exxitetoolbox {position:fixed; top:200px; right:0; border-top:1px solid var(--border); border-left:1px solid var(--border); border-bottom:1px solid var(--border); border-radius:2px 0 0 2px; width:36px; min-height:10px; z-index:100000; background:var(--bodywhite); transition-delay: 1s;}
div.exxitetoolbox:hover {width:200px;}
div.exxitetoolbox a{display:block; width:200px; height:40px; margin:1px 0 0 1px;}
div.exxitetoolbox a h6 {font-family:var(--icon); float:left; display:block; font-size:1.8em; padding:4px 10px 0 5px;}
div.exxitetoolbox a p { font-size:0.8em;  float:left; display:block; padding:10px 0 0 0;}
div.exxitetoolbox a:link{background-color:var(--bodybgaccent); }
div.exxitetoolbox a:visited{background-color:var(--bodybgaccent);}
div.exxitetoolbox a:hover{background-color:var(--bodywhite); }
div.exxitetoolbox a:focus{background-color:var(--bodywhite); }
div.exxitetoolbox a:active{background-color:var(--link); color:var(--bodywhite); }

div.exxitesidebox{background:var(--bodybgaccent); padding:10px; margin:0 0 10px 0;}
/*sidebar styles begin*/


/*tab style begin -- sys/interfacelib.php class ifc_tabs & class ifc_tabmenu XXX*/
div.exxitetabs{margin:0 0 10px 0;}
div.exxitetabs div.head {border-bottom:1px solid var(--border);}
div.exxitetabs div.head a{display:block; float:left; text-decoration:none; padding:10px 20px 10px 20px; font-size:0.7em; font-weight:bold; border-top:1px solid var(--border); border-right:1px solid var(--border); margin:0 0 -1px 0; border-bottom:1px solid var(--border);}
div.exxitetabs div.head a:first-child{border-left:1px solid var(--border); border-radius:4px 0 0 0;}
div.exxitetabs div.head a:last-child{border-radius:0 4px 0 0;}
div.exxitetabs div.head a:link{color:var(--bodycolorlight); background:var(--bodybgaccent);}
div.exxitetabs div.head a:visited{color:var(--bodycolorlight); background:var(--bodybgaccent);}
div.exxitetabs div.head a:hover{color:var(--hover); background:var(--bodybg);}
div.exxitetabs div.head a:focus{color:var(--hover); background:var(--bodybg);}
div.exxitetabs div.head a:active{color:var(--bodybg); background:var(--darkbg);}
div.exxitetabs div.head a.sel{cursor:default; border-bottom:1px solid var(--bodybg); position:relative;}
div.exxitetabs div.head a.sel:link{color:var(--bodycolor); background:var(--bodybg);}
div.exxitetabs div.head a.sel:visited{color:var(--bodycolor); background:var(--bodybg);}
div.exxitetabs div.head a.sel:hover{color:var(--bodycolor); background:var(--bodybg);}
div.exxitetabs div.head a.sel:focus{color:var(--bodycolor); background:var(--bodybg);}
div.exxitetabs div.head a.sel:active{color:var(--bodycolor); background:var(--bodybg);}
div.exxitetabs div.head a span{font-family: var(--icon); font-size: 2em; padding: 0 0 10px 0; display: block; text-align: center;}
div.exxitetabs div.items{ padding:20px; background:var(--bodybg); border-left:1px solid var(--border); border-right:1px solid var(--border); border-bottom:1px solid var(--border);}
div.exxitetabs div.items div.tabs_item{display:none;}
div.exxitetabs div.items div.tabs_item.sel{display:block;}


div.exxitetabs_menu{margin:0 0 10px 0;}
div.exxitetabs_menu div.head {border-bottom:1px solid var(--border);}
div.exxitetabs_menu div.head a{display:block; float:left; text-decoration:none; padding:10px 20px 10px 20px; font-size:0.7em; font-weight:bold; border-top:1px solid var(--border); border-right:1px solid var(--border); margin:0 0 -1px 0; border-bottom:1px solid var(--border);}
div.exxitetabs_menu div.head a:first-child{border-left:1px solid var(--border); border-radius:4px 0 0 0;}
div.exxitetabs_menu div.head a:last-child{border-radius:0 4px 0 0;}
div.exxitetabs_menu div.head a:link{color:var(--bodycolorlight); background:var(--bodybgaccent);}
div.exxitetabs_menu div.head a:visited{color:var(--bodycolorlight); background:var(--bodybgaccent);}
div.exxitetabs_menu div.head a:hover{color:var(--hover); background:var(--bodybg);}
div.exxitetabs_menu div.head a:focus{color:var(--hover); background:var(--bodybg);}
div.exxitetabs_menu div.head a:active{color:var(--bodybg); background:var(--darkbg);}
div.exxitetabs_menu div.head a.sel{cursor:default; border-bottom:1px solid var(--bodybg); position:relative;}
div.exxitetabs_menu div.head a.sel:link{color:var(--bodycolor); background:var(--bodybg);}
div.exxitetabs_menu div.head a.sel:visited{color:var(--bodycolor); background:var(--bodybg);}
div.exxitetabs_menu div.head a.sel:hover{color:var(--bodycolor); background:var(--bodybg);}
div.exxitetabs_menu div.head a.sel:focus{color:var(--bodycolor); background:var(--bodybg);}
div.exxitetabs_menu div.head a.sel:active{color:var(--bodycolor); background:var(--bodybg);}
div.exxitetabs_menu div.head a span{font-family: var(--icon); font-size: 2em; padding: 0 0 10px 0; display: block; text-align: center;}
/*tab style end*/

/*previous - next pager style begin sys/interfacelib.php -- class ifc XXX*/
div.exxiteprevnext{margin:0 0 10px 0; display:grid; grid-template-columns:1fr 10fr 1fr; grid-gap:5px;}
div.exxiteprevnext a.btn{display:block; font-size:0.7em; font-weight:bold; margin:0 0 10px 0;}
div.exxiteprevnext a.btn:link{background-color:var(--bodybgaccent);}
div.exxiteprevnext a.btn:visited{background-color:var(--bodybgaccent);;}
div.exxiteprevnext a.btn:hover{background-color:var(--bodycolorlight); color:var(--bodywhite);}
div.exxiteprevnext a.btn:focus{background-color:var(--bodycolorlight); color:var(--bodywhite);}
a.exxiteprev{position:relative; padding:10px 10px 10px 30px;}
a.exxiteprev:after{content: 'O'; font-family: var(--icon); display: block; position: absolute; font-size: 1.4em; font-weight:normal; left: 0; top: 2px; padding: 5px;}
a.exxitenext{position:relative; padding:10px 30px 10px 10px;}
a.exxitenext:after{content: 'N'; font-family: var(--icon); display: block; position: absolute; font-size: 1.4em; font-weight:normal;  right: 0; top: 2px; padding: 5px;}
/*previous - next pager style end*/

/*hiddenbox style begin sys/interfacelib.php -- class ifc XXX*/
div.hiddenboxheader{background:var(--bodybgaccent); font-size:0.8em;}
div.hiddenboxheader p {font-size:0.8em; padding:5px; margin:0 0 0 30px;}
div.hiddenboxicon{position:absolute; margin:-4px 0 0 -5px;}
div.hiddenboxicon a{font-family:var(--icon); font-size:1.5em; line-height:1em; display:block; height:20px; width:20px; text-align:center; margin:5px 0 4px 10px}
div.hiddenboxicon a:link{color:var(--bodycolorlight);}
div.hiddenboxicon a:visited{color:var(--bodycolorlight);}
div.hiddenboxicon a:hover{color:var(--hover);}
div.hiddenboxicon a:focus{color:var(--hover);}
div.hiddenbox{display:none;}
/*hiddenbox style end*/

/*normal popup window styles begin*/
div.exxite-transparent-curtain{position:fixed; top:0; left:0; bottom:0; right:0; z-index:99999;}
div.floatwindow{box-shadow:0 4px 8px rgba(0,0,0,0.5); position:absolute; display:none; background:var(--bodybg); z-index:100000; display:grid; grid-template-columns:auto 26px; grid-template-rows:30px auto;}
div.floattitle{font-size:0.8em; color:var(--a9); align-self:center; padding:5px 10px; cursor:move;}
div.floatwindowbody{grid-column-start:1; grid-column-end:3; border-top:1px solid var(--a9);}
a.floatclose {display:block;font-family:var(--icon); font-size:1em; width:26px; text-decoration:none; text-align:center; align-self:center;}
a.floatclose:link{color:rgba(255,255,255,0.4);}
a.floatclose:visited{color:rgba(255,255,255,0.4);}
a.floatclose:hover{color:rgba(255,255,255,0.9);}
a.floatclose:focus{color:rgba(255,255,255,0.9);}
div.iframecover{position:absolute; top:0; left:0; right:0; bottom:0;}
/*normal popup window styles end*/


/*modal popup windw styles(2) begin*/
div.exxitemodalbg{position:fixed; top:0; right:0; left:0; bottom:0; display:none;  z-index:950; background:rgba(0,0,0,0.5);  backdrop-filter:grayscale(1) contrast(40%);}

div.exxitewindow{position:absolute; top:20px; left:5%; right:5%; bottom:5%; min-height:300px; max-height:90vh; background:var(--bodybgaccent); box-shadow:0 0 15px var(--black);}
div.exxitewindow.max900{width:100%;  max-width:900px;  left:50%; right:auto; transform:translate(-50%,0);}
div.exxitewindow.max1200{width:100%; max-width:1200px; left:50%; right:auto; transform:translate(-50%,0);}
div.exxitewindow.max600{width:100%;  max-width:600px;  left:50%; right:auto; transform:translate(-50%,0);}

div.exxitewindow.max{top:0; left:0; right:0; bottom:0; width:auto; height:auto; transform:none; max-height:none;}
div.exxitewindow.toleft{top:0; left:0; right:50%; bottom:0;  width:auto; height:auto; max-height:none; transform:none;}
div.exxitewindow.toright{top:0; right:0; left:50%; bottom:0; width:auto; height:auto; max-height:none; transform:none;}
div.exxitewindow.fix{left:50%; transform:translate(-50%,0);}
div.exxitewindow.fix div.head{grid-template-columns:auto 50px;}
div.exxitewindow.narrow{left:25%; right:25%;}

div.exxitewindow div.head{position:absolute; top:0; right:0; left:0; height:50px; background:var(--bodywhite); border-bottom:1px solid var(--border); display:grid; grid-template-columns:30px 30px 30px auto 50px; }
div.exxitewindow.max div.head{background:var(--bodybgaccent);}
div.exxitewindow div.head a{display:block; width:100%; height:50px;position:relative;}
div.exxitewindow div.head a:after{content:''; display:block; position:absolute; top:0; left:0; right:0; bottom:0; font-family:var(--icon); text-align: center; font-size:1.1em; line-height: 2.8em;}
div.exxitewindow div.head a.close:after{content:'á';}
div.exxitewindow div.head a.toleft:after{content:'Ö';}
div.exxitewindow.toleft div.head a.toleft:link{color:var(--bodycolorlight);}
div.exxitewindow.toleft div.head a.toleft:visited{color:var(--bodycolorlight);}
div.exxitewindow div.head a.toright:after{content:'Ú';}
div.exxitewindow.toright div.head a.toright:link{color:var(--bodycolorlight);}
div.exxitewindow.toright div.head a.toright:visited{color:var(--bodycolorlight);}
div.exxitewindow div.head a.size:after{content:'É';}
div.exxitewindow.max div.head a.size:after{content:'Í';}

div.exxitewindow div.head a:link{color:var(--a9);}
div.exxitewindow div.head a:visited{color:var(--a9);}
div.exxitewindow div.head a:hover{color:var(--hover);}
div.exxitewindow div.head a:active{color:var(--bodycolor); background:var(--bodybgaccent);}
div.exxitewindow div.head a.close:after{font-size:1.3em; line-height: 2.4em;}
div.exxitewindow div.head a.close:link{color:var(--link);}
div.exxitewindow div.head a.close:visited{color:var(--link);}
div.exxitewindow div.head a.close:hover{color:var(--hover);}

div.exxitewindow div.head a span{display:none;}
div.exxitewindow div.head h2{font-size:0.9em; color:var(--a9); font-weight:bold; padding:1.2em; white-space: nowrap;overflow: hidden; text-align:left;}

div.exxitewindow div.body{position:absolute; top:50px; right:0; left:0; bottom:0;}
div.exxitewindow div.body iframe{width:100%; height:100%; border:none;}
/*modal popup windw styles(2) end*/

/*modal popup window styles begin*/
div.modalcurtain {position:fixed; background:rgba(0,0,0,0.5);  backdrop-filter: grayscale(1); top:0; left:0; right:0; bottom:0; margin:0; z-index:950; display:none;}
div.modalcontainer {position:fixed;top:20px; left:0; text-align:center;  z-index:102; width:100%; height:100%; z-index:99999;}


div.modalframe{margin:auto; padding:50px 0 0 0; display:none; overflow:visible; background:var(--bodywhite); box-shadow:0 0 15px var(--black); max-width:90%; max-height:90%;}
div.modalframemax{margin:-20px 0 0 0; padding:50px 0 0 0; overflow:visible;  background:var(--bodywhite);}
div.modalframemax div.modalhead{height:25px; background:var(--darkbg);}
div.modalframemax div.modalhead div.modaltitle{font-size:0.8em; color:var(--bodywhite); padding:0.3em 1.4em;}
div.modalframemax a.modalebutton{width:25px; height:25px; padding:0;}
div.modalframemax a.modalebutton:link{color:rgba(255,255,255,0.5);}
div.modalframemax a.modalebutton:visited{color:rgba(255,255,255,0.5);}
div.modalframemax a.modalebutton:hover{color:var(--hover);}
div.modalframemax a.modalebutton:focus{color:var(--hover);}

div.fixmodalframe{margin:100px auto 0 auto; width:300px;  padding:10px 0 10px 0; display:none; overflow:visible; background:var(--bodywhite); box-shadow:0 0 8px #333; border-radius:3px; font-size:0.8em;}
div.fixmodalframeg{height:20px;}
div.modalbody{height:100%; position:relative; overflow:hidden;}

div.modalhead{position:relative; height:50px; margin:-50px 0 0 0; overflow:hidden; background:var(--bodywhite); border-bottom:1px solid var(--border);position:relative;}
div.modaltitle {font-size:0.9em; color:var(--a9); font-weight:bold; padding:1.2em; white-space: nowrap;overflow: hidden;margin: 0 100px 0 0; text-align:left;}

div.modalbutton{position:absolute; top:0; right:0; bottom:0; width:50px}
div.modalsizebutton{position:absolute; top:0; right:50px; bottom:0; width:50px;}
div.modalbuttonright{position:absolute; top:0; right:0; bottom:0; width:50px}
.modaliframe{border:0; width:100%; height:100%; margin:0; padding:0;}

div.exxiteajaxerror {width:100%; height:100%; min-height:100px; background:var(--bodybgaccent); text-align:center; font-family:var(--icon); font-size:2.5em; color:var(--a6);}
div.exxiteajaxerror p{padding:20px 0 0 0;}

a.modalebutton {display: block; width:50px; height: 50px; margin: 0;  text-decoration: none; font-family:var(--icon); font-size:1.4em; padding:10px 0 0 0;}
a.modalebutton:link{color:rgba(0,0,0,0.5);}
a.modalebutton:visited{color:rgba(0,0,0,0.5);}
a.modalebutton:hover{color:var(--hover);}
a.modalebutton:focus{color:var(--hover);}
/*modal popup window styles end*/

/*form styles begin -- sys/formlib.php -- class uniform*/
div.exxiteform {margin:0; padding:0px; text-align:left;}

div.exxiteformitem {padding:4px 0 4px 0; margin:0; position:relative;}
div.exxiteformitem div.exxiteformlabel {box-sizing:border-box; width:15%; font-size:0.7em; font-weight:bold; color:var(--bodycolorlight); float:left; text-align:right; padding-right:15px;}
div.exxiteformitem div.exxiteformlabel span{display:block; color:var(--link); cursor:pointer;}
div.exxiteformitem div.exxiteformlabel:hover span{color:var(--hover);}

div.exxiteform.full div.exxiteformlabel {width:100%; text-align:left; padding-right:15px; padding-bottom:5px; float:none;}
div.exxiteformitem.error div.exxiteformlabel{color:var(--erroraccent);}
div.exxiteformitem div.errormsg{font-size:0.75em;  background:var(--error); padding:5px 10px 5px 40px; margin:2px 0 2px 15%; position:relative;}
div.exxiteformitem div.errormsg:after{content: '\00F3';font-family: var(--icon); position: absolute; top: 2px; left: 10px; font-size:1.5em; color:var(--erroraccent);}

div.exxiteformitem2{display:grid; grid-template-columns:2fr 10fr; grid-column-gap:15px; grid-row-gap:4px; position:relative; margin:8px 0 8px 0; container-type:inline-size;}
div.exxiteform.full div.exxiteformitem2{grid-template-columns:1fr}
div.exxiteformitem2 div.exxiteformlabel {font-size:0.7em; font-weight:bold; color:var(--bodycolorlight); justify-self:right; text-align:right;}
div.exxiteformitem2 div.exxiteformlabel span{color:var(--link); cursor:pointer;}
div.exxiteformitem2 div.exxiteformlabel:hover span{color:var(--hover);}
div.exxiteformitem2 div.exxiteformcontrol {width:100%;}
div.exxiteformitem2.error div.exxiteformlabel{color:var(--erroraccent);}
div.exxiteformitem2.command{grid-template-columns:2fr 10fr auto;}
div.exxiteformitem2 div.errormsg{font-size:0.75em;  background:var(--error); padding:5px 10px 5px 40px; margin:2px 0 2px 15%; position:relative;}
div.exxiteformitem2 div.errormsg:after{content: '\00F3';font-family: var(--icon); position: absolute; top: 2px; left: 10px; font-size:1.5em; color:var(--erroraccent);}
div.exxiteformitem2 div.exxiteformcommand{position:static;top:0;}
div.exxiteformitem2.submit{background-image: var(--stripe-bg); background-size:var(--stripe-bg-size);}
div.exxiteformitem2.submit.danger{background-color:var(--danger); background-image: var(--stripe-bg-danger);}
div.exxiteformitem2 div.exxiteformsubmit{grid-column-start:2; background:none; padding:4px 0;}

div.exxiteform-info{padding:10px 10px 10px 45px; font-size:0.8em; background:var(--bodybgaccent); position:relative;}
div.exxiteform-info:after{content:'z'; display:block; position:absolute; top:5px; left:10px; font-family: var(--icon); color:var(--accentpale); font-size:2em;}
div.exxiteform-info span{display:block; max-width:65ch;}
div.exxiteform-info strong{font-weight: bold;}

@media screen and (max-width: var(--form-single)){
  div.exxiteformitem2{grid-template-columns:1fr;}
  div.exxiteformitem2 div.exxiteformlabel {justify-self:left; text-align:left;}
}
@container(max-width:700px){

	div.exxiteformitem2 div.exxiteformcontrol {grid-column-start:1; grid-column-end:3;}
	div.exxiteformitem2 div.exxiteformlabel {grid-column-start:1; grid-column-end:3; justify-self:left;text-align:left;}
	div.exxiteformitem2 div.exxiteformsubmit {justify-self:end;}
}

div.exxiteformitem2.submit.cent{grid-template-columns:10px auto 10px;}
div.exxiteformitem2.submit.cent div.exxiteformsubmit{justify-self:center;margin-right:0;}
div.exxiteformitem2.submit.cent div.exxiteformsubmit button{margin-right:0;}

div.exxiteformitem2.fixed{position:absolute; right:0; left:0;}
div.exxiteformitem2.fixed.top{top:0;}
div.exxiteformitem2.fixed.bottom{bottom:0;}

div.exxiteform.full div.exxiteformitem2.submit.cent{grid-template-columns:10px auto 10px;}
div.exxiteform.full div.exxiteformitem2.submit.cent div.exxiteformsubmit{justify-self:center; margin-right:0;}
div.exxiteform.full div.exxiteformitem2.submit.cent div.exxiteformsubmit button{margin-right:0;}


div.exxiteform.full div.exxiteformcontrol {box-sizing:border-box; float:none; margin:0; width:100%;}
div.exxiteformcontrol {box-sizing:border-box; margin:0; width:85%; float:right;}
div.exxiteformcontrol.full{width:100%; float:none;}
div.exxiteformcontrol.big{position:fixed; top:110px; left:0; right:0; bottom:0; background:var(--bodybg); z-index:100; padding:20px; box-shadow:0 0 8px #333;}
div.exxiteformcontrol.big textarea{position:absolute; top:20px; left:20px; right:20px; bottom:20px;}
div.exxiteformcommand{position:absolute; top:5px; right:0;}
div.exxiteformnote {position:relative; color: var(--bodybgaccent); font-weight:normal; font-size:0.7em; padding:5px 20px; background:var(--bodycolorlight); float:left; cursor:pointer; margin:5px;}
div.exxiteformnote:before{content: ' '; position: absolute; width: 0; height: 0; left: 10px; top: -10px; border: 5px solid; border-color:  transparent transparent var(--bodycolorlight)  transparent;}
div.exxiteformerror {font-size:0.7em; color:var(--erroraccent); }
div.exxiteformlistbase {width:95%; background:var(--bodybgaccent); overflow:auto;}
div.exxiteformitemlistelement {float:left; margin:1px; padding:1px; border:2px solid var(--border); cursor:pointer;}
div.exxiteformitemlistelementsel {float:left; margin:1px; padding:1px; border:2px solid var(--link); cursor:pointer;}

div.exxiteform.function div.exxiteformlabel{width:100%; float:none; text-align:left; margin:5px;}
div.exxiteform.function div.exxiteformcontrol{width:100%; float:none;}

div.exxitefileinputini{font-size:0.8em;}

div.exxiteformradio{margin:0 0 0 4px;}
div.exxiteformradio input{opacity:0; position:absolute;}
div.exxiteformradio div.radio-item{}
div.exxiteformradio div.radio-item label{font-size:0.8em; display:block; padding:5px 10px 5px 30px; cursor:pointer; background:url(radio_off.svg) no-repeat 5px center; background-size:15px; border-radius:12px;}
div.exxiteformradio div.radio-item label:hover{background-color:var(--bodybgaccent); color:var(--link);}
div.exxiteformradio div.radio-item input:focus ~ label{background-color:var(--bodybgaccent); color:var(--link);}
div.exxiteformradio div.radio-item input:checked ~ label{background-image:url(radio_on.svg);}

div.exxitecheckboxes{margin:0 0 0 4px;}
div.exxitecheckboxes input{opacity:0; position:absolute;}
div.exxitecheckboxes  div.exxitecheckbox{}
div.exxitecheckboxes  div.exxitecheckbox label{font-size:0.8em; display:block; padding:5px 10px 5px 30px; cursor:pointer; background:url(checkbox_off.svg) no-repeat 5px center; background-size:15px;}
div.exxitecheckboxes  div.exxitecheckbox label:hover{background-color:var(--bodybgaccent); color:var(--link);}
div.exxitecheckboxes  div.exxitecheckbox input:focus ~ label{background-color:var(--bodybgaccent); color:var(--link);}
div.exxitecheckboxes  div.exxitecheckbox input:checked ~ label{background-image:url(checkbox_on.svg);}

div.exxitecheckboxes.slim {max-height:200px; overflow:auto;}

div.exxitecheckboxcommand {font-size:0.7em;}
div.exxitecheckboxcommand strong{font-weight:bold;}
div.exxitecheckboxcommand.abs {position:absolute; top:0; right:10px;}
div.exxitecheckboxcommand a {display:block; float:left; padding:4px 10px 4px 10px; margin:4px 4px 0 0;  border-radius:2px;}
div.exxitecheckboxcommand a:link{background:var(--bodybgaccent);}
div.exxitecheckboxcommand a:visited{background:var(--bodybgaccent);}
div.exxitecheckboxcommand a:hover{background:var(--link); color:var(--bodywhite);}
div.exxitecheckboxcommand a:focus{background:var(--link); color:var(--bodywhite);}
div.exxitecheckboxcommand a:active{background:var(--darkbg); color:var(--bodywhite);}
div.exxitecheckboxcommand a.right {float:right;}
div.exxitecheckboxcommand a.sel:link {background:var(--a9); color:var(--bodywhite);}
div.exxitecheckboxcommand a.sel:visited {background:var(--border); color:var(--bodywhite);}
div.checkboxleft{display:grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr))}

div.exxiteformsubmit {padding:4px 10px 4px 15%; border-radius:2px; background-image: var(--stripe-bg); background-size:var(--stripe-bg-size);}
div.exxiteformsubmit.danger {background-color:var(--danger); background-image: var(--stripe-bg-danger); background-size:var(--stripe-bg-size);}
div.exxiteformsubmit.cent{padding:4px 10px 4px 10px; text-align:center;}
div.exxiteformsubmit.fixed{position:fixed; bottom:20px; left:20px; right:20px; background-color:var(--bodybg);}
div.exxiteform.function div.exxiteformsubmit{padding:4px 10px 4px 4px;}

/*
div.exxiteformfieldset fieldset {border:3px solid var(--border); padding:4px; margin:15px 0 15px 0;}
div.exxiteformfieldset legend {font-size:0.8em;font-weight:bold;color:var(--bodycolor); padding:0; margin:0 5px 0 25px;}
*/
div.exxiteformfieldset fieldset {border:1px solid var(--border); border-bottom:2px solid var(--border); padding:70px 20px 20px 20px; margin:10px 0 10px 0; position:relative;}
div.exxiteformfieldset legend{-webkit-padding-start:0;-webkit-padding-end:0;padding-left:0; padding-right:0;}
div.exxiteformfieldset legend span{display:block; position:absolute; top:0; right:0; left:0; font-size:0.9em; padding:20px; background:var(--bodybgaccent);}


div.exxiteformfieldsetint fieldset {border:1px solid var(--border); border-bottom:2px solid var(--border); padding:70px 20px 20px 20px;  margin:10px 0 10px 0; position:relative;}
div.exxiteformfieldsetint legend{-webkit-padding-start:0;-webkit-padding-end:0;padding-left:0; padding-right:0; display:block;}
div.exxiteformfieldsetint legend span{display:block; position:absolute; top:0; right:0; left:0; font-size:0.9em; padding:20px 20px 20px 50px; background:var(--bodybgaccent); cursor:pointer; color:var(--link); z-index:100;}
div.exxiteformfieldsetint legend span:hover{color:var(--link); background:var(--inputfocus);}
div.exxiteformfieldsetint legend span:after{content:'R'; font-family:var(--icon); display:block; position:absolute; left:20px; top:50%; transform:translateY(-50%) rotate(0deg); transition: var(--trans);}

div.exxiteformfieldsetint.close fieldset{border:1px solid  var(--bodybgaccent); padding-top:30px; z-index:100;}
div.exxiteformfieldsetint.close legend span:after{transform:translateY(-50%) rotate(180deg); transition:var(--trans);}

/*div.exxiteformfieldsetint fieldset {border:3px solid var(--border); padding:4px; margin:15px 0 15px 0;}
div.exxiteformfieldsetint legend {display:block; position:relative; height:25px; font-size:0.8em;font-weight:bold;color:var(--link); cursor:pointer; padding:10px 0 0 22px;}
div.exxiteformfieldsetint legend:hover{color:var(--hover);}
div.exxiteformfieldsetint legend:after{content:','; display:block; position:absolute; top:6px; left:0; font-family:var(--icon); font-size:1.6em;}
div.exxiteformfieldsetint legend.open:after{content:'(';}*/

div.exxiteformicongrid {overflow:auto; max-height:200px;}
div.exxiteformicongrid.color {background:transparent; border:none;}
div.exxiteformicon {float:left; border:1px solid rgba(0,0,0,0.0001); margin:1px;  border-radius:2px;}
div.exxiteformicon a {display:block; padding:4px; border:1px solid rgba(0,0,0,0.0001); border-radius:2px;}
div.exxiteformicon a:hover{border:1px solid var(--hover);}
div.exxiteformicon a:focus{border:1px solid var(--hover);}
div.exxiteformicon.sel a{border:1px solid var(--link);}
div.exxiteformiconinner {background-size:contain; background-repeat:no-repeat;}
div.exxiteformimage{margin:5px 0 0 0; max-width:50%;}
div.exxiteformimage img{max-width:300px; max-height:300px; object-fit:contain; object-position:top left;}

a.exxiteformcolor {display:grid; float:left; margin:10px; width:24px; height:24px;}
a.exxiteformcolor span{display:block; border-radius:50%; grid-column-start:1; grid-column-end:2; grid-row-start:1; grid-row-end:2;}
a.exxiteformcolor span.col{border:1px solid rgba(0,0,0,0.2);}
a.exxiteformcolor:hover{transform:scale(1.2);}
a.exxiteformcolor:focus{transform:scale(1.2);}
a.exxiteformcolor.sel{transform:scale(1.5);}
a.exxiteformcolor:hover span.col{border:0.8px solid rgba(0,0,0,0.2);}
a.exxiteformcolor.sel span.col{border:0.5px solid rgba(0,0,0,0.2);}




a.exxiteformcolor2{display:grid; grid-template-columns:100px auto; overflow:hidden;}
a.exxiteformcolor2 span{display:block;}
a.exxiteformcolor2 span.holder{grid-column-start:1; grid-column-end:2; grid-row-start:1; grid-row-end:2;}
a.exxiteformcolor2 span.inner{grid-column-start:1; grid-column-end:2; grid-row-start:1; grid-row-end:2;}
a.exxiteformcolor2 span.display{background:var(--points_svg) no-repeat center right var(--bodybgaccent); font-size:0.8em; padding:4px 8px; color:var(--bodycolor); border-left:none;}
a.exxiteformcolor2:hover span.display{background-color:var(--inputfocus);}
a.exxiteformcolor2:focus span.display{background-color:var(--inputfocus);}

div.exxitecolorinputboxholder{border:1px solid  var(--bodybgaccent);}
div.exxitecolorinputbox{height:50px;}
input.exxitecolorinput{border:none; color:var(--bodywhite); background:rgba(0,0,0,0.5); padding:5px; margin:10px; text-align:center; width:140px; cursor:pointer;}
.exxiteinput {font-size:0.8em; background:var(--bodybgaccent); width:100%; height:24px; padding:4px 8px 4px 8px;box-sizing: border-box;}
.exxiteinput:focus {background:var(--inputfocus); outline:none;}
input.exxiteinput.file{padding:0; height:23px;}
input.exxiteinput.exxiteyear{width:50px; margin:0 5px 0 0;}
.exxiteinputedited {font-size:0.8em; background:var(--points_svg) no-repeat center right var(--bodybgaccent); width:100%;  height:24px; cursor:pointer; padding:4px 40px 4px 8px;;box-sizing: border-box;}
.exxiteinputedited:hover {background-color:var(--inputfocus); outline:none;}
.exxiteinputedited:focus {background-color:var(--inputfocus); outline:none;}
.exxitefileinput {font-size:0.8em; background:var(--bodybgaccent); width:100%;  height:24px; border:1px solid var(--border); padding:4px 40px 4px 8px;;box-sizing: border-box;}
.exxitefileinput:focus {background:var(--inputfocus); outline:none;}

.exxiteformselect {-moz-appearance: none; -webkit-appearance: none;  font-size:0.8em; color:var(--bodycolor); background:var(--select_svg) no-repeat center right var(--bodybgaccent); background-size:20px; width:100%; box-sizing: border-box; padding:4px 25px 4px 8px;  }
.exxiteformselect:focus {background-color:var(--inputfocus); outline:none;}
.exxiteformselect::-ms-expand{display:none;}

.exxiteformselect.date {width:auto;}
.exxiteinput.date {width:auto; margin:0 5px 0 5px;}

.exxiteformselectsug {font-size:0.8em;  background:var(--bodywhite); color:var(--bodycolorlight); border:1px solid var(--border); width:100%; height:24px;}

div.exxiteformselect4{border-radius:2px;}
div.exxiteformselect4 a.item{display:block; text-decoration:none; padding:5px 10px; float:left; font-size:0.75em;}
div.exxiteformselect4 a.item:link{background:var(--bodybgaccent);}
div.exxiteformselect4 a.item:visited{background:var(--bodybgaccent);}
div.exxiteformselect4 a.item:hover{background:var(--hover); color:var(--bodywhite);}
div.exxiteformselect4 a.item:focus{background:var(--hover); color:var(--bodywhite);}
div.exxiteformselect4 a.item:active{background:var(--darkbg); color:var(--bodywhite);}
div.exxiteformselect4 a.item.selected{background:var(--link); color:var(--bodywhite);}


.exxitetextarea{display: block; font-size:0.8em; font-family:var(--face);  background:var(--bodybgaccent); color:var(--bodycolor); width:100%;  resize:vertical; padding:4px 8px 4px 8px; box-sizing: border-box;}
.exxitetextarea:focus {background:var(--inputfocus); outline:none;}

div.grow-wrap {display: grid;}
div.grow-wrap::after { content: attr(data-replicated-value) " "; white-space: pre-wrap; visibility: hidden;}
div.grow-wrap > textarea { resize: none; overflow: hidden;}
div.grow-wrap > textarea, div.grow-wrap::after { border-top: 2px solid var(--border); border-top-width:2px; padding:4px 8px 4px 8px; font-size:0.8em; font-family:var(--face); grid-area: 1 / 1 / 2 / 2;}


div.exxitertfpanel {font-size:0.7em; font-weight:bold; width:100%; padding:0;border-top:1px solid var(--border);border-left:1px solid var(--border);border-right:1px solid var(--border); box-sizing: border-box;}

div.exxitertfview {padding: 20px; background:var(--points_svg) no-repeat var(--bodybgaccent);  background-position-x:right; background-position-y:5px; position:relative;}
div.exxitertfview:hover{background:rgba(221,238,255,0.5);}
div.exxitertfview a.start{display:block; position:absolute; top:0; bottom:0; right:0; left:0;}
div.exxitertfpanel a {display:block; padding:4px 10px 4px 10px;}
div.exxitertfpanel a:link {color:var(--link);        background:var(--points_svg) no-repeat center right var(--border);}
div.exxitertfpanel a:visited {color:var(--link);     background:var(--points_svg) no-repeat center right var(--border);}
div.exxitertfpanel a:hover {color:var(--bodywhite);  background:var(--points_svg) no-repeat center right var(--link);}
div.exxitertfpanel a:focus {color:var(--bodywhite);  background:var(--points_svg) no-repeat center right var(--link);}

.exxitertftextarea{font-size:0.8em; font-family:var(--face), sans-serif;  background:var(--bodybgaccent); width:100%;
	border-top:0;
	border-left:1px solid var(--border);
	border-bottom:1px solid var(--border);
	border-right:1px solid var(--border);
	padding:4px 8px 4px 8px;;
	 resize:vertical;box-sizing: border-box;}
.exxitertftextarea:focus {background:var(--inputfocus); outline:none;}

.exxitetextareax{font-size:16px; font-family:var(--codeface);  background:var(--bodybgaccent); width:100%; resize:vertical; padding:4px 8px 4px 8px;; box-sizing:border-box;}
.exxiteresourceformicon {padding:2px 0 0 0;}
.exxiteresourceformicon img {border:1px solid var(--a9);}
.exxitecodearea {font-family:var(--codeface); font-size:13px; background:var(--bodybgaccent); width:100%; border:1px solid var(--border); border-radius:2px;  resize:vertical; padding:4px 8px 4px 8px;; box-sizing:border-box;}
.exxitecodearea:focus {background:var(--inputfocus); outline:none;}



button.exxitesubmit {font-weight:bold; font-size:0.7em; margin-right:15px;margin-bottom:5px; padding:12px 40px 12px 40px; border-right:0; border-left:0; border-top:0; border-radius:2px; cursor:pointer; color:var(--bodywhite);
background-color:var(--bodycolorlight); border-bottom:2px solid rgba(0,0,0,0.3);}
button.exxitesubmit:focus,button.exxitesubmit:hover{background-color:var(--hover); outline:none;}
button.exxitesubmit:active{background-color:var(--darkbg); border-bottom:2px solid var(--darkbg); padding:12px 40px 12px 40px;}

button.light{background-color:var(--a9);}
button.light:focus,button.exxitesubmit.light:hover{background-color:var(--hover);}


div.exxiterteform {padding:10px;}


div.exxitecaptcha {float:left; width:30%; font-size:0.7em;}
div.exxitecaptchainput {float:right; width:68%;}



div.exxiteformsubmitfixed {position:fixed; top:10px; right:27px; border-radius:2px 0 0 2px; padding:0 0 4px 4px;}
div.exxiteformsubmitfixed a {width:100px; display:block; padding:4px 10px 4px 10px; margin:4px 4px 0 0;  font-size:0.7em; border:1px solid var(--border);}
div.exxiteformsubmitfixed a:link{background:var(--bodybgaccent);}
div.exxiteformsubmitfixed a:visited{background:var(--bodybgaccent);}
div.exxiteformsubmitfixed a:hover{background:var(--link); color:var(--bodywhite);}
div.exxiteformsubmitfixed a:focus{background:var(--link); color:var(--bodywhite);}
div.exxiteformsubmitfixed a.right {float:right;}

a.exxiteformtag{display:block; font-size:0.8em; background:var(--points_svg) no-repeat var(--bodybgaccent); background-position:right 10px; width:100%; padding:5px; cursor:pointer;box-sizing: border-box;}
a.exxiteformtag:hover{background-color:var(--focus);}
a.exxiteformtag:focus{background-color:var(--focus);}
a.exxiteformtag span{color:var(--a9);}

div.exxiteformcl{padding:0 0 5px; border-bottom:1px solid var(--border); margin:0 0 5px 0;}
div.exxiteformcl p{display:block; float:right; font-size:0.8em; padding:8px 10px 0 10px;}

div.exxitefloatform{position:absolute; width:290px; top:-60px; left:50%; transform:translateX(-50%); background:var(--darkbg); padding:10px; color:var(--bodywhite);}
div.exxitefloatform input{ width:200px; height:30px; float:left; border:none; border-bottom:1px solid var(--bodycolorlight); color:var(--bodywhite); background:transparent;}
div.exxitefloatform input:focus{outline:none; border-color:var(--hover);}
div.exxitefloatform a{display:block; float:left; width:30px; height:30px; margin-left:5px; position:relative;}
div.exxitefloatform a:after{display:block; font-size:2.2em; position:absolute; top:0; left:0; right:0; bottom:0; text-align:center; font-family:var(--icon);}
div.exxitefloatform a.ok:after{content:'Z'; color:var(--bodywhite);}
div.exxitefloatform a.cancel:after{content:'á'; color:var(--border);}
div.exxitefloatform a:hover:after{color:var(--hover);}

div.exxiteitems{background:var(--bodybgaccent); width:100%; min-height:100px;}
a.sortablelink {display:block; padding:4px 10px 4px 10px; font-size:0.7em; border:1px solid var(--border);}
.sortablelink:link {color:var(--link);  background:var(--points_svg) no-repeat center right var(--border);}
.sortablelink:visited {color:var(--link);  background:var(--points_svg) no-repeat center right var(--border);}
.sortablelink:hover {color:var(--bodywhite);  background:var(--points_svg) no-repeat center right var(--link);}
.sortablelink:focus {color:var(--bodywhite);  background:var(--points_svg) no-repeat center right var(--link);}
div.exxiteitems p{text-align:center; padding:50px; font-size:0.9em; font-weight:bold; color:var(--a9);}
div.exxiteitems div.item{background:rgba(0,0,0,0.2); margin:2px 0 2px 0; position:relative; min-height:25px; padding:5px 50px 5px 50px; color:var(--bodycolor);}
div.exxiteitems div.item span{ font-size:0.9em; font-weight:bold;}
div.exxiteitems div.item div.sort-handle{position:absolute; top:0; bottom:0; left:0; width:40px; font-family:var(--icon);padding:5px; cursor:default; color:var(--bodywhite);}
div.exxiteitems div.item a.close{display:block;position:absolute; top:4px; right:4px; font-family:var(--icon); text-decoration:none; font-size:1.4em;}
div.exxiteitems div.item a.close:link{color:rgba(255,255,255,0.5);}
div.exxiteitems div.item a.close:visited{color:rgba(255,255,255,0.5);}
div.exxiteitems div.item a.close:hover{color:var(--bodywhite);}
div.exxiteitems div.item a.close:focus{color:var(--bodywhite);}
div.exxiteitems div.item div.itemicon{font-size:1.4em; margin-right:5px;}

/*textarea.tableedit{display:none;}
div.exxitetableedit table{border:2px solid var(--border); margin:0 0 10px 0;}
div.exxitetableedit td{border:1px solid var(--border); padding:10px; font-size:0.8em; height:40px;}
div.exxitetableedit td:hover{background:var(--bodybgaccent); cursor:pointer;}
div.exxitetableedit td.delcell{width:40px; background:var(--bodybgaccent); position:relative;}
div.exxitetableedit td.delcell:after{content:'á'; position:absolute; top:5px; right:0; left:0; text-align:center; font-family:var(--icon); color:var(--link); font-size:1em; line-height:2em;  transition: color 0.5s;}
div.exxitetableedit td.delcell:hover:after{color:var(--hover); transition: color 0.5s;}
div.exxitetableedit td.delcell.up:after{content:'R';}
div.exxitetableedit td.delcell.down:after{content:'S';}
div.exxitetableedit td.edited{background:var(--inputfocus);}
div.exxitetableedit td.edited input{background:var(--inputfocus); border:none; outline:none; width:100%;}
div.exxitetableedit th{border:1px solid var(--border); padding:10px; font-size:0.8em; font-weight:bold; background:var(--bodybgaccent);}
div.exxitetableedit div.addcell {margin:0 10px 0 0; float:left; font-size:0.7em; padding:5px 10px 5px 30px; background:var(--border); color:var(--bodywhite); cursor:pointer; position:relative;}
div.exxitetableedit div.addcell:hover{background-color:var(--hover); color:var(--bodywhite);}
div.exxitetableedit div.addcell:after{content:','; position:absolute; top:5px; left:5px; font-family:var(--icon); color:var(--bodywhite); font-size:1em;}*/

textarea.tableeditor{display:none;}
div.exxite-table-edit{display:grid; padding:10px 0; grid-gap:10px; grid-template-columns:auto 200px;}
div.exxite-table-edit div.xbase{display:grid; grid-template-columns:repeat(10,1fr);}
div.exxite-table-edit div.xbase div.inner{border:1px solid var(--border); height:25px; display:grid;}
div.exxite-table-edit div.xbase div.inner.sel{border-color:var(--accent); background:var(--bodybgaccent); cursor:pointer;}
div.exxite-table-edit div.xbase div.inner span{display:block; align-self:center; justify-self:center; color:var(--bodycolor); font-size: 0.8em; font-weight: bold;}
div.exxite-table-edit div.xbase div.inner:hover{background:var(--border);}
div.exxite-table-edit table.exxite-table-edit{width:100%; border-collapse:collapse;}
div.exxite-table-edit table.exxite-table-edit td{border:1px solid var(--border); height:40px; min-width:40px; padding:5px; font-size:0.8em; color:var(--bodycolor); vertical-align:top;}
div.exxite-table-edit table.exxite-table-edit td:focus{outline:none; background-color:var(--semihover);}
div.exxite-table-edit table.exxite-table-edit tr.sel{background:var(--bodybgaccent);}
div.exxite-table-edit table.exxite-table-edit td.sel{background:var(--bodybgaccent);}

div.exxite-table-edit table.exxite-table-edit tr td.command{width:40px; padding:0; border:none;}
div.exxite-table-edit table.exxite-table-edit tr td.command a{display:block; width:100%; height:40px; background:url(checkbox_off.svg) no-repeat center center; background-size:15px;}
div.exxite-table-edit table.exxite-table-edit tr td.command a span{display:none;}
div.exxite-table-edit table.exxite-table-edit tr.sel td.command{background:var(--bodybg);}
div.exxite-table-edit table.exxite-table-edit tr.sel td.command a{background-image:url(checkbox_on.svg)}

div.exxite-table-edit table.exxite-table-edit tr th a{display:block; width:100%; height:40px; background:url(checkbox_off.svg) no-repeat 10px center; background-size:15px; border:none;}
div.exxite-table-edit table.exxite-table-edit tr th a span{display:none;}
div.exxite-table-edit table.exxite-table-edit tr th.sel a{background-image:url(checkbox_on.svg);}

div.exxite-table-edit div.xcommands a{display:block; text-decoration:none; display:grid; height:25px; padding:5px 20px; margin:2px;}
div.exxite-table-edit div.xcommands a:link{background:var(--bodybgaccent); color:var(--link);}
div.exxite-table-edit div.xcommands a:visited{background:var(--bodybgaccent); color:var(--link);}
div.exxite-table-edit div.xcommands a:hover{background:var(--hover); color:var(--bodywhite)}
div.exxite-table-edit div.xcommands a span{font-size:0.8em; align-self:center; justify-self:left;}
div.exxite-table-edit div.table-holder{max-height:500px; overflow:auto;}

div.exxite-table-paste{background:var(--bodybgaccent); position:relative; height:25px; color:var(--bodybgaccent); outline:none;}
div.exxite-table-paste:after{content:'[';display:block; position:absolute;top:50%; left:5px; font-size:1.2em; font-family:var(--icon); color:var(--link-pale); transform:translate(0,-50%);}
div.exxite-table-paste:focus-visible{background:var(--inputfocus);}


div.exxiteuploadpreview{display:none; grid-template-columns:min-content auto;}
div.exxiteuploadpreview img{margin:5px 0 0 0; max-width:250px;}
div.exxiteuploadpreview div.txt{margin:5px 0 0 10px;}
div.exxiteuploadpreview div.txt div.line{display:grid; grid-template-columns:min-content auto; font-size:0.8em; margin:0 0 5px 0;}
div.exxiteuploadpreview div.txt div.line strong{font-weight:bold; font-size:1.2em;}
div.exxiteuploadpreview div.txt div.line div.desc:before{font-family:var(--icon); position:absolute; top:6px; right:6px; font-size:1.5em; display:block; line-height:0.7em;}
div.exxiteuploadpreview div.txt div.line div.desc{padding:5px 30px 5px 10px; position:relative;}
div.exxiteuploadpreview div.txt div.line.ok div.desc{}
div.exxiteuploadpreview div.txt div.line.ok div.desc:before{content:'Z'; color:var(--okaccent);}
div.exxiteuploadpreview div.txt div.line.info div.desc{background-color:var(--info);}
div.exxiteuploadpreview div.txt div.line.info div.desc:before{content:'z'; color:var(--infoaccent);}
div.exxiteuploadpreview div.txt div.line.info div.desc:after{content: ' '; position: absolute; width: 0; height: 0; left: -10px; top: 7px; border: 5px solid; border-color:  transparent var(--info) transparent transparent;}
div.exxiteuploadpreview div.txt div.line.error div.desc{background-color:var(--error);}
div.exxiteuploadpreview div.txt div.line div.label{white-space:nowrap; padding:5px 10px 5px 0; text-overflow:ellipsis;}
div.exxiteuploadpreview div.txt div.line.error div.desc:before{content:'\00F3'; color:var(--erroraccent);}
div.exxiteuploadpreview div.txt div.line.error div.desc:after{content: ' '; position: absolute; width: 0; height: 0; left: -10px; top: 7px; border: 5px solid; border-color:  transparent var(--error) transparent transparent;}


div.exxiteuploadpreview img.icon{width:100px; height:100px; background:url(fileicon.svg) no-repeat center center var(--bodybgaccent); background-size:100px;}
div.exxiteuploadpreview img.pdf   {background-image:url(fileicon_pdf.svg);}
div.exxiteuploadpreview img.doc   {background-image:url(fileicon_doc.svg);}
div.exxiteuploadpreview img.docx  {background-image:url(fileicon_doc.svg);}
div.exxiteuploadpreview img.eps   {background-image:url(fileicon_eps.svg);}
div.exxiteuploadpreview img.ps    {background-image:url(fileicon_eps.svg);}
div.exxiteuploadpreview img.rtf   {background-image:url(fileicon_rtf.svg);}
div.exxiteuploadpreview img.flv   {background-image:url(fileicon_flv.svg);}
div.exxiteuploadpreview img.ttf   {background-image:url(fileicon_font.svg);}
div.exxiteuploadpreview img.eot   {background-image:url(fileicon_font.svg);}
div.exxiteuploadpreview img.woff  {background-image:url(fileicon_font.svg);}
div.exxiteuploadpreview img.woff2 {background-image:url(fileicon_font.svg);}
div.exxiteuploadpreview img.htm   {background-image:url(fileicon_html.svg);}
div.exxiteuploadpreview img.html  {background-image:url(fileicon_html.svg);}
div.exxiteuploadpreview img.ppt   {background-image:url(fileicon_ppt.svg);}
div.exxiteuploadpreview img.pptx  {background-image:url(fileicon_ppt.svg);}
div.exxiteuploadpreview img.swf   {background-image:url(fileicon_swf.svg);}
div.exxiteuploadpreview img.tif   {background-image:url(fileicon_tif.svg);}
div.exxiteuploadpreview img.tiff  {background-image:url(fileicon_tif.svg);}
div.exxiteuploadpreview img.mp3   {background-image:url(fileicon_wmv.svg);}
div.exxiteuploadpreview img.mp4   {background-image:url(fileicon_wmv.svg);}
div.exxiteuploadpreview img.ogg   {background-image:url(fileicon_wmv.svg);}
div.exxiteuploadpreview img.xls   {background-image:url(fileicon_xls.svg);}
div.exxiteuploadpreview img.xlsx  {background-image:url(fileicon_xls.svg);}
div.exxiteuploadpreview img.zip   {background-image:url(fileicon_zip.svg);}
div.exxiteuploadpreview img.rar   {background-image:url(fileicon_zip.svg);}
div.exxiteuploadpreview img.js    {background-image:url(fileicon_js.svg);}

.option-danger{background:rgba(0,0,0,0.1);}
.option-no{background:rgba(255,255,255,0.6);}

/*slider styles begin*/
div.exxiteformslider{display:grid; grid-template-columns:100px auto; background:var(--bodybgaccent);overflow:hidden;}
div.exxiteformslider input.slider{border:none; box-shadow:none; border-radius:none; text-align:right;}

div.exxiterange{padding:0 10px 0 0;}
div.exxiterange input[type=range]{height:24px;}

/*chrome*/
div.exxiterange input[type=range] {-webkit-appearance: none; display:block; margin:0; width: 100%; background:transparent;}
div.exxiterange input[type=range]:focus {outline: none;}
div.exxiterange input[type=range]::-webkit-slider-runnable-track {width: 100%; height: 2px; cursor: pointer; transition:var(--trans); background:var(--border);}

*div.exxiterange input[type=range]:hover::-webkit-slider-runnable-track{background:var(--hover); }
div.exxiterange input[type=range]:focus::-webkit-slider-runnable-track{background:var(--hover); }


div.exxiterange input[type=range]::-webkit-slider-thumb {box-shadow: none; border: 0px solid #000; height: 16px; width: 16px; border-bottom:2px solid var(--border); margin-top:-7px; background:var(--white); cursor: pointer; -webkit-appearance: none; transition:var(--trans);}
div.exxiterange input[type=range]:hover::-webkit-slider-thumb {background:var(--hover);}
div.exxiterange input[type=range]:focus::-webkit-slider-thumb {background:var(--hover);}



/*firefox*/
div.exxiterange input[type=range]::-moz-range-track {width: 100%;height: 2px;cursor: pointer; animate: 0.2s; background: var(--border);}
div.exxiterange input[type=range]::-moz-range-thumb {appearance: none; box-shadow: none; border-radius:0; border: 0px solid #000; margin-top:-7px; height: 16px; width: 16px; border-bottom:2px solid var(--border); background:var(--white);cursor: pointer;}
div.exxiterange input[type=range]:hover::-moz-range-track {background:var(--hover);}
div.exxiterange input[type=range]:focus::-moz-range-track {background:var(--hover);}
div.exxiterange input[type=range]:hover::-moz-range-thumb {background:var(--hover);}
div.exxiterange input[type=range]:focus::-moz-range-thumb {background:var(--hover);}
div.exxiterange input[type="range"]::-moz-range-progress {background: var(--link);}

/*slider styles end*/

/*input legth indicator styles begin*/
div.exxite-input-length{position:relative;}
div.exxite-input-length p{display:block; font-size:0.7em; color:var(--a9); padding:4px 0 0; float:right;}
div.exxite-input-length p strong{font-weight:bold;}
div.exxite-input-length div.slider{position:relative;}
div.exxite-input-length div.slider div.knob{position:absolute; top:0; left:0; height:2px; background:var(--accent);}
div.exxite-input-length div.slider div.knob.warning{background:var(--erroraccent);}
/*input legth indicator styles end*/

/*form styles end*/

/* editable table styles begin*/
div.exxiteeditable {cursor:pointer;width:100%;  min-height:29px; padding:4px 6px 0 6px; box-sizing: border-box; overflow:hidden; line-height:2em;}
div.exxiteeditable:hover{background:var(--bodybgaccent);}
input.exxiteediatbleinput{width:100%; height:29px; background:var(--inputfocus); border:none; padding:4px 6px 0 6px; box-sizing: border-box;}
input.exxiteediatbleinput:focus{outline:none;}
textarea.exxiteediatbletextarea{width:100%; height:300px;  line-height:2em; background:var(--inputfocus); border:none; padding:4px 6px 0 6px; box-sizing: border-box;
font-family:var(--face); color:var(--bodycolor); font-size:1em; padding:6px;}
textarea.exxiteediatbletextarea:focus{outline:none;}

div.exxiteetab table {font-size: 0.75em; border-collapse: collapse;border: 2px solid var(--border);font-weight:normal;background: var(--bodywhite);padding-left:20px;padding-right:20px;margin-bottom:20px;}
div.exxiteetab td {border: 1px solid  var(--bodybgaccent);padding:0; min-width:200px;}
div.exxiteetab th {border: 1px solid  var(--bodybgaccent);padding:0; min-width:200px; padding:4px 10px 4px 10px;}
div.exxiteetab caption {padding: 0 0 5px 0;text-align: left;font-weight: bold;text-transform: uppercase;color: var(--bodycolor);background: transparent;}
div.exxiteetab thead th, tfoot th {border: 1px solid  var(--bodybgaccent);text-align:left;font-weight:bold;color: var(--bodycolor);background: var(--border);}
div.exxiteetab tfoot td {border: 2px solid  var(--bodybgaccent);}
div.exxiteetab tbody th {vertical-align: top; text-align: left;}
div.exxiteetab tbody td {vertical-align: top; text-align: left;}
div.exxiteetab tbody th {white-space: nowrap;}
/* editable table styles end*/


/*new button styles begin*/
a.exxitebutton1{display:block; box-sizing:border-box; position:relative; text-decoration:none; font-weight:bold; white-space:nowrap;  font-size:0.7em; padding:8px 15px 7px 15px; border-bottom:2px solid rgba(0,0,0,0.3); height:28px; line-height:1em; margin-bottom:5px;}
a.exxitebutton1.left{float:left; margin:0 5px 5px 0;}
a.exxitebutton1.right{float:right; margin:0 0 5px 5px;}
a.exxitebutton1.round{border-radius:50%;  border:none;}
a.exxitebutton1.round.big{width:40px; height:40px;}
a.exxitebutton1.round.big i{font-size:2.5em; margin:-14px 0 0 -14px; padding:0; position:absolute; top:50%; left:50%; width:28px; height:28px; line-height:1em;}
a.exxitebutton1.round.mid{width:28px; height:28px;}
a.exxitebutton1.round.mid i{font-size:2.5em; margin:-14px 0 0 -14px; padding:0; position:absolute; top:50%; left:50%; width:28px; height:28px; line-height:1em;}
a.exxitebutton1.round.small{width:20px; height:20px;}
a.exxitebutton1.round.small i{font-size:1.8em; margin:-10px 0 0 -10px; padding:0; position:absolute; top:50%; left:50%; width:20px; height:20px; line-height:1em;}

a.exxitebutton1.small{padding:4px 10px; font-weight:normal; height:20px;}
a.exxitebutton1.big{padding:15px 20px;  font-weight:normal; text-transform:uppercase;  height:40px;}

a.exxitebutton1.dark:link{background:var(--bodycolorlight); color:var(--bodywhite);}
a.exxitebutton1.dark:visited{background:var(--bodycolorlight); color:var(--bodywhite);}
a.exxitebutton1.dark:hover{background:var(--hover); color:var(--bodywhite);}
a.exxitebutton1.dark:focus{background:var(--hover); color:var(--bodywhite);}
a.exxitebutton1.dark:active{background:var(--bodycolor); color: var(--bodybgaccent);}

a.exxitebutton1.light {border-color:transparent;}
a.exxitebutton1.light:link{background:transparent; color:var(--link);}
a.exxitebutton1.light:visited{background:transparent; color:var(--link);}
a.exxitebutton1.light:hover{background:var(--bodywhite); color:var(--hover);}
a.exxitebutton1.light:focus{background:var(--bodywhite); color:var(--hover);}
a.exxitebutton1.light:active{background:var(--bodycolor); color: var(--bodybgaccent);}

a.exxitebutton1.none {border-color:transparent;}
a.exxitebutton1.none:link{background:transparent; color:var(--link);}
a.exxitebutton1.none:visited{background:transparent; color:var(--link);}
a.exxitebutton1.none:hover{background:transparent; color:var(--hover);}
a.exxitebutton1.none:focus{background:transparent; color:var(--hover);}
a.exxitebutton1.none:active{background:transparent;; color:var(--bodycolor);}

a.exxitebutton1 i{display:block; font-family:var(--icon); font-style:normal; font-weight:normal; font-size:1.5em; margin: -4px 6px 0 -7px; padding-top: 4px; height: 14px;}
a.exxitebutton1 i.right{margin: -4px -7px 0 6px;}
a.exxitebutton1.big i{text-transform:none;}
/*new button styles end*/

/*button styles begin*/
div.exxitebuttonbar {padding:4px 4px 0 4px; background-color:var(--bodybg); background-image: var(--stripe-bg); background-size: var(--stripe-bg-size); border-bottom:1px solid var(--border); position:fixed; top:0; left:0; right:0;}
body.scrolled_down div.exxitebuttonbar {box-shadow: 0 3px 3px 0 rgba(0,0,0,0.3);}

div.exxitebuttonline{display:grid; grid-auto-columns: 1fr; grid-auto-flow: column; background:var(--bodybgaccent); container-type:inline-size;}
div.exxitebuttonline.frame{margin:-20px -10px 10px -10px;}
div.exxitebuttonline a{text-decoration:none; display:block; border-right:1px solid var(--border); border-bottom:1px solid var(--border); padding:10px; white-space:nowrap; text-align:center; text-overflow:ellipsis; overflow:hidden; font-size:0.75em;}
div.exxitebuttonline a span.icon{font-family:var(--icon); display:block; font-size:1.8rem; margin:0 0 5px 0;}
div.exxitebuttonline a.sel{background:var(--bodybg); border-bottom:1px solid transparent;}
div.exxitebuttonline a:link{color: var(--link-pale);}
div.exxitebuttonline a:visited{color: var(--link-pale);}
div.exxitebuttonline a:hover{color: var(--hover); background:var(--bodybg);}
div.exxitebuttonline a:focus{color: var(--hover); background:var(--bodybg);}
div.exxitebuttonline a:last-child{border-right:none;}
div.exxitebuttonline a.sel:link{color: var(--link);}
div.exxitebuttonline a.sel:visited{color: var(--link);}
div.exxitebuttonline a.sel:hover{color: var(--link);}
@container(max-width:350px)
{
	div.exxitebuttonline a span.label{display:none;}
	div.exxitebuttonline a span.icon{font-size:1.4rem;}
}
/*button styles end*/

hr.exxiteseparator{height:1px; border:0; color:var(--border);background-color: var(--border);}



/*=============================================================================*/
/*TABLES BEGIN*/
/*=============================================================================*/
/*exxite base table style begin -- formlib.php -- class unitable XXX*/
div.exxitertf table {font-size: 0.75em; border-collapse: collapse; font-weight:normal; font-size:0.8em;width:100%;margin-bottom:20px;}
div.exxitertf td, div.exxitertf th {border: none; border-bottom: 1px solid var(--border); padding: 5px;}
div.exxitertf caption {padding: 0 0 5px 0;text-align: left;font-weight: bold;text-transform: uppercase;color: var(--bodycolor);background: transparent;}
div.exxitertf thead th, tfoot th {border:none; border-bottom:2px solid var(--border);text-align:left;font-weight:bold;color: var(--bodycolor);}
div.exxitertf tfoot td {border: 2px solid var(--border);}
div.exxitertf tbody th {vertical-align: top; text-align: left;}
div.exxitertf tbody td {vertical-align: top;}
div.exxitertf tbody th {white-space: nowrap;}
div.exxitertf.zebra tbody tr:nth-child(odd) {background:var(--bodybg);}
div.exxitertf.zebra tbody tr:nth-child(even) {background:var(--bodybgaccent);}
div.exxitertf.hover tbody tr:hover {background: var(--semihover);}
div.exxitertf .count{width:1%; text-align:right;}

div.exxitertf thead th {text-align:left; padding:5px 10px 5px 25px; position:relative;}
div.exxitertf thead th.sel{}
div.exxitertf thead th.selx{}
div.exxitertf th.asc:before {content:'S'; font-family:var(--icon); position:absolute; top:5px; left:5px;}
div.exxitertf th.desc:before {content:'R'; font-family:var(--icon); position:absolute; top:5px; left:5px;}
/*exxite base table style end*/
/*sort table header style begin -- formlib.php -- class unitable XXX*/
div.sort-table a {white-space:nowrap;}
div.sort-table thead th {padding:0; background:var(--bodybgaccent);}
div.sort-table th a {display:block; padding:6px 4px 6px 25px; position:relative;}
div.sort-table th a:link    {background:var(--bodybgaccent); color:var(--link);}
div.sort-table th a:visited {background:var(--bodybgaccent); color:var(--link);}
div.sort-table th a:hover   {background:var(--bodybg); color:var(--hover);}
div.sort-table th a:focus   {background:var(--bodybg); color:var(--hover);}
div.sort-table th.sel a{background:var(--a13);}
div.sort-table th.asc a{background:var(--a13);}
div.sort-table th.desc a{background:var(--a13);}
div.sort-table th.sel a:before {content:'S'; font-family:var(--icon); position:absolute; top:5px; left:5px;}
div.sort-table th.selx a:before {content:'R'; font-family:var(--icon); position:absolute; top:5px; left:5px;}
div.sort-table th.asc a:before {content:'S'; font-family:var(--icon); position:absolute; top:5px; left:5px;}
div.sort-table th.desc a:before {content:'R'; font-family:var(--icon); position:absolute; top:5px; left:5px;}
/*sort table header style end*/
/*site list table styles begin -- site.php XXX*/
div.exxitesites .a1{width:1%;}
div.exxitesites .a2{font-weight:bold;}
div.exxitesites td{padding:0;}
div.exxitesites a{display:block; padding:8px 20px;}
div.exxitesites div.siteicon{width:24px; height:24px; background-repeat:no-repeat; background-size:contain; background-position:center center; margin:5px;}
div.exxitesites tr.sel{background:var(--accentmid); color: var(--bodybgaccent);}
div.exxitesites tr.sel a:link{color: var(--bodybgaccent);}
div.exxitesites tr.sel a:visited{color: var(--bodybgaccent);}
div.exxitesites tr.sel a:hover{color:var(--hover);}
div.exxitesites tr.sel:hover{background:var(--accentmid);}
div.exxitesites tr:hover{background:var(--bodybgaccent);}
/*site list table styles end*/
/*function list style begin -- js.php XXX*/
div.functionlist a {display:block; white-space:nowrap;}
div.functionlist .a1 {text-align:right;}
div.functionlist .a2 {font-weight:bold;}
div.functionlist .a3 {white-space:nowrap;}
div.functionlist .a6 {font-weight:bold;}
div.functionlist .a7 {white-space:nowrap;}
/*function list style end*/
/*resource list style begin -- sys/reslib.php XXX*/
div.resourcelist td{border-bottom:none;}
div.resourcelist td a{display:block; padding:8px 25px 8px 5px;  position:relative;}
div.resourcelist td a:hover{background:var(--darken6); color:var(--hover);}
div.resourcelist td a:focus{background:var(--darken6); color:var(--hover);}
div.resourcelist .a1{text-align:right; width:1%;}
div.resourcelist .a2{padding:0 5px; vertical-align:middle; width:1%;}
div.resourcelist .a3{padding:0 5px; vertical-align:middle; width:1%;}
div.resourcelist .a4{padding:0; font-weight:bold;}
div.resourcelist .a5{padding-left:30px;}
div.resourcelist .a6{padding-left:30px;}
div.resourcelist .a8{padding-left:30px;}

div.resourcelist div.resicon{background-size:cover; width:20px; height:20px;}
div.resourcelist div.resmenu{width:20px; height:20px; color:var(--bodycolorlight); font-family:var(--icon); text-align:center; cursor:pointer;font-size:1.4em; border-radius:50%;}
div.resourcelist div.resmenu:hover{background:var(--hover); color:var(--bodywhite);}

div.resview{position:absolute; top:0; right:0; left:0; height:150px; background-repeat:no-repeat; background-position:center center; background-size:cover;}
div.resview.small{background-size:30%;}
/*resourcelist style end*/
/*resource list style end*/
/*content list style begin -- content.php XXX*/
div.contentlist tbody td{border-bottom:none; vertical-align:middle;}
div.contentlist td a{display:block; padding:8px 25px 8px 5px;  position:relative;}
div.contentlist td a:hover{background:var(--darken3); color:var(--hover);}
div.contentlist td a:focus{background:var(--darken3); color:var(--hover);}
div.contentlist tr:hover td a:before{content:''; font-family:var(--icon); position:absolute; top:5px; right:5px; font-size:1.6em;}
div.contentlist tr:hover td a.view:before{content:'j';}
div.contentlist tr:hover td a.clone:before{content:'Ž';}
div.contentlist tr:hover td a.delete:before{content:'ź';}
div.contentlist tbody tr:hover {background:var(--focus);}
div.contentlist .a1 {text-align:right;}
div.contentlist .a2 {font-weight:bold; padding:0; font-size:1.3em;}
div.contentlist .a3 {padding:0; text-align:center;}
div.contentlist .a4 {padding:0; text-align:center;}
div.contentlist .a5 {padding:0 0 0 30px; font-weight:bold; white-space:nowrap; text-align:right;}
div.contentlist .sel {background:var(--focus);}

div.contentlist.min {overflow:hidden;}
div.contentlist.min td a{white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
div.contentlist.min tbody tr.sel{background:var(--accentmid); color:var(--bodybg);}
div.contentlist.min tbody tr.sel a:link{color: var(--bodybg);}
div.contentlist.min tbody tr.sel a:visited{color: var(--bodybg);}
div.contentlist.min tbody tr.sel div.cl-icon{color: var(--bodybg);}

div.contentlist.pages .a3{text-align:left; padding:8px 6px 8px 6px;}
div.contentlist.pages .handle{cursor:default;}

div.cl-item{position:relative; padding:0 0 0 40px; font-size:0.75em; font-weight:bold;}
div.cl-item div.nhandle{cursor:move;}
div.cl-icon{position:absolute; top:0; left:0; bottom:0; width:40px; text-align:center; font-family:var(--icon); font-size:1.8em; color:var(--a9); font-weight:normal; line-height:1.5em;}
div.cl-icon:hover{color:var(--hover);}
div.contentlist.min table{width:100%;}
div.cl-item a{overflow:hidden;}

div.fileicon {width:20px; height:16px; background:url(file.svg) no-repeat left center; background-size:contain; float:left;}
input.contentlistcheck{float:left; margin:0 8px 0 0;}

div.exxitetabletoolbar{float:right; padding:5px 0 0 20px;}
div.exxitecontentupperbar{padding:20px 0 0 0;}
/*content list style end*/
/*trashlist styles begin -- trash.php*/
div.trashlist td{border-bottom:none;}
div.trashlist td a{display:block; padding:8px 25px 8px 5px;  position:relative;}
div.trashlist tr:hover td a:before{content:''; font-family:var(--icon); position:absolute; top:5px; right:5px; font-size:1.6em;}
div.trashlist tr:hover td a.view:before{content:'j';}
div.trashlist tr:hover td a.untrash:before{content:'0';}
div.trashlist tr:hover td a.delete:before{content:'ź';}

div.trashlist td a:hover{background:var(--darken3); color:var(--hover);}
div.trashlist td a:focus{background:var(--darken3); color:var(--hover);}
div.trashlist .a1 {text-align:right; width:1%;}
div.trashlist .a2 {font-weight:bold; padding:0;}
div.trashlist .a3 {padding:0; text-align:center;}
div.trashlist .a4 {padding:0;}
div.trashlist .sel {background:var(-focus);}
/*trashlist styles end*/
/*resource info box style begin -- resource_locator.php XXX*/
div.resinfo .a1{width:30%;}
div.resinfo .a2{font-weight:bold;}
/*resource info box style end*/
/*contentformat list style begin -- contentformat.php XXX*/
div.contentformatlist1 a{white-space:nowrap;}
div.contentformatlist1 .a2{width:1%; padding:0; font-size:2em; color:var(--bodycolorlight);}
div.contentformatlist1 .a3{font-weight:bold; padding-left:10px;}
div.contentformatlist1 .a7{width:1%; text-align:right;}
div.contentformatlist1 .a8{font-weight:bold; width:1%; text-align:right; padding-right:20px;}
div.contentformatlist1 .a9{font-weight:bold; width:1%; text-align:right; padding-right:20px;}
/*contentformat list style end*/
/*pagesearch list style begin --index.php XXX*/
div.pagesearch a { white-space:nowrap;}
div.pagesearch .a1 {text-align:right; width:1%;}
div.pagesearch .a2 {font-weight:bold;}
/*pagesearch list style end*/
/* contentheader list style begin -- sys/contentlib.php class content_view XXX*/
div.contentheader {margin-bottom:10px;}
div.contentheader table {font-size:0.7em; color:var(--bodycolorlight); border-collapse: collapse; width:100%; background:var(--bodybgaccent); border:0; margin:0;}
div.contentheader td {border:1px solid var(--bodybg); padding:2px 10px 2px 10px; vertical-align:top;}
div.contentheader .a1 {text-align:right; width:10%; white-space: nowrap; vertical-align:top;}
div.contentheader .a2 strong{font-weight:bold; color:var(--bodycolor);}
div.exxitecontenticon{position:absolute; top:7px; right:20px; font-family:var(--icon); font-size:1.7em; color:var(--bodywhite); background:var(--a9); width:40px; height:40px; text-align:center; border-radius:50%; line-height:1.4em;}
/* contentheader list style end*/
/* content preview style begin  -- sys/contentlib.php class content_view XXX*/
div.contentpreview td {padding:4px 4px 4px 4px;}
div.contentpreview .a1 {text-align:right; color:var(--bodycolorlight); font-weight:bold; white-space:nowrap;}
/* content preview style end*/
/*pagetemplate list style begin -- pagetemp.php XXX*/
div.pagetemplate td{border-bottom:none;}
div.pagetemplate .a1 {text-align:right; width:1%;}
div.pagetemplate .a2 {font-weight:bold;}
div.pagetemplate .a6 {font-weight:bold; text-align:right;}
/*pagetemplate list style end*/
/*log list styles begin -- tool_log.php XXX*/
div.log td {padding:8px;}
div.log .a1 {text-align:right; width:1%;}
div.log .a2 {white-space:nowrap; text-align:right; width:1%; font-size:1.2em; padding:5px 0 0 0;}
div.log .a3 {white-space:nowrap; text-align:right; width:2%;}
div.log .a4 {white-space:nowrap; text-align:right; width:2%;}
div.log .a6{font-weight:bold;}

div.log tr.flag-1{background:var(--error);}
div.log tr.flag-2{background:var(--error);}

div.log tr.flag0 td.a2{color:var(--okaccent);}
div.log tr.flag-1 td.a2{color:var(--erroraccent);}
div.log tr.flag-2 td.a2{color:var(--erroraccent);}
div.log tr.flag1 td.a2{color:var(--hover);}
div.log tr.flag2 td.a2{color:var(--questionaccent);}
div.log tr.flag3 td.a2{color:var(--infoaccent);}
/*log list styles end*/

/*user list styles begin -- userman2.php XXX*/
div.usert tbody tr{transition:var(--trans);}
div.usert tr th{background:var(--bodybgaccent); white-space:nowrap; font-weight:normal;}
div.usert .a2{font-weight:bold;}
div.usert .a6{padding:4px; font-size:1em;}
div.usert .a6 p{margin-bottom:0;font-size: 1.2em; line-height: 0.8em;}
div.usert a.role-label{display:inline-block; text-decoration:none; padding:4px; margin:0 2px 2px 0;}
div.usert a.role-label:link{background:var(--bodycolorlight); color:var(--bodybgaccent);}
div.usert a.role-label:visited{background:var(--bodycolorlight); color:var(--bodybgaccent);}
div.usert a.role-label:hover{background:var(--link); color:var(--bodybg);}

div.user2 .a7{white-space:nowrap; width:1%;}
div.user2 .a8{white-space:nowrap;width:1%;}
div.user2 .a9{white-space:nowrap;width:1%;}
div.user2 .a10{white-space:nowrap; text-align:right; font-weight:bold;}

div.user3 .a7{white-space:nowrap;width:1%;}
div.user3 .a8{white-space:nowrap;width:1%;}
div.user3 .a9{white-space:nowrap; text-align:right; font-weight:bold;}

div.rolet .a2{font-weight:bold;}
div.rolet .a5{font-weight:bold; text-align:right;}
div.rolet tbody tr{transition:var(--trans);}

div.exxiteuserlabels{margin:0 0 10px 0;}
div.exxiteuserlabels div.label{display:inline-block; margin:0 5px 5px 0; padding:5px 10px; font-size:0.75em; background:var(--bodybgaccent);}

div.exxiteroleselect{}
div.exxiteroleselect div.userroleitem{padding:10px 10px 10px 45px; cursor:pointer; position:relative; margin-bottom:1px; transition:var(--trans);}
div.exxiteroleselect div.userroleitem.on{background:var(--ok);}
div.exxiteroleselect div.userroleitem.on:before{content:'Z'; display:block; position:absolute; top:0; left:0; bottom:0; font-family:var(--icon); font-size:1.2em; padding:5px; color:var(--okaccent);}
div.exxiteroleselect div.userroleitem.on:hover{background:#f0ffea;}
div.exxiteroleselect div.userroleitem.off{background:var(--a13);}
div.exxiteroleselect div.userroleitem.off:hover{background:var(--bodybgaccent); color:var(--hover);}
div.exxiteroleselect div.userroleitem h4{font-size:0.7em; font-weight:bold;}
div.exxiteroleselect div.userroleitem span{font-weight:normal;}
div.exxiteroleselect div.exxitecheckboxcommand{margin:0 0 5px 0;}

div.exxiteroleselectframe{margin:0 0 30px 0;}
div.exxiteroleselectframe h3{font-size:0.8em; padding:10px 10px 10px 45px; color:var(--bodywhite); background:var(--bodycolorlight); margin:0 0 5px 0;}
/*user list styles end*/
/*config variable table styles begin -- opt_var.php XXX*/
div.exxiteconfigvar table{margin-top:10px;}
div.exxiteconfigvar .a1 {text-align:right; width:1%; padding-right:4px;}
div.exxiteconfigvar .a2 {font-weight:bold; color:var(--bodycolorlight); width:1%;}
div.exxiteconfigvar .a4 {font-weight:bold; width:1%; padding-right:10px;}
/*config variable table styles end*/
/*databse info table style begin -- tool_phpinfo.php XXX*/
div.dbinfo table {border-collapse: collapse; border:0; margin:0 0 20px 0; background:var(--bodybgaccent);}
div.dbinfo th {text-align:left; border:0; font-size:0.8em; padding:5px 10px 5px 10px;}
div.dbinfo td {border-top:1px solid var(--border); vertical-align:top; padding:4px; font-size:0.8em;}
div.dbinfo .a2 {text-align:right;}
div.dbinfo .a3 {text-align:right; font-weight:bold;}
/*databse info table style end*/
/*library config form's table -- apperance.php XXX*/
div.exxitelibconfig td{border-bottom:1px solid var(--border); vertical-align: middle;}
div.exxitelibconfig .a1 {width:300px; padding:10px 10px 0 10px;}
div.exxitelibconfig .a2 {width:340px; font-size:0.8em; font-weight:bold; color:var(--bodycolorlight); padding:10px;}
div.exxitelibconfig .a3 {font-size:0.8em; color:var(--bodycolor); padding:10px;}
/*library config form's table*/
/*ajax module styles begin -- module_ajax.php XXX*/
div.ajaxlist a { white-space:nowrap;}
div.ajaxlist .a1 {text-align:right;}
div.ajaxlist .a2 {font-weight:bold;}
div.ajaxlist .a3 {white-space:nowrap;}
div.ajaxlist .a5 {font-weight:bold;}
div.ajaxlist .a6 {white-space:nowrap;}
/*ajax module styles end*/
/*outer log list syles begin -- tool_outerlog.php XXX*/
div.olist .a1 {width:1%; text-align:right;}
div.olist .a2 {width:1%; white-space:nowrap;}
div.olist .a3 {width:20%;font-weight:bold;}
div.olist .a4 {width:78%; word-break:break-all;}
/*outer log list syles begin end*/

/*=============================================================================*/
/*TABLES END*/
/*=============================================================================*/

/*matrix styles begin*/
/*div.exxitematrix{display:flex; flex-direction:row; flex-wrap:wrap;  align-content:stretch;}
div.exxitematrix div.matrixitem{max-width:100%; flex-basis:100%; flex-grow: 1; flex-shrink:1; position:relative;}*/
div.exxitematrix{
	--bigbuttonbg:var(--a13);
	--bigbuttonhover:var(--bodybgaccent);
}

@media (prefers-color-scheme: dark) {
	div.exxitematrix{
		--bigbuttonbg:var(--a12);
		--bigbuttonhover:var(--a11);
	}
}

div.exxitematrix{display:grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); grid-gap:10px;}
div.exxitematrix div.matrixitem{position:relative;}

div.exxitematrix.c300{grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));}
div.exxitematrix.c400{grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));}
div.exxitematrix.c600{grid-template-columns: repeat(auto-fill, minmax(600px, 1fr));}

div.exxitematrix.exxitecards{margin:-4px;}
div.exxitematrix.exxitecards div.matrixitem{background:var(--bodybgaccent); padding:10px 10px 20px 10px; text-align:left;}
/*card styles begin*/
div.exxitecard{background:var(--bodybgaccent); padding:20px; border-bottom:1px solid var(--border);}
div.exxitecard a.page{font-weight:bold;}
/*card styles end*/

div.exxitematrix.exxiteplate{margin:-4px;}
div.exxitematrix.exxiteplate div.matrixitem{background:var(--bodybgaccent); padding:10px 10px 20px 10px; text-align:left; font-size:0.9em; font-weight:bold; color:var(--bodycolorlight);}


div.exxitematrix.cards{}
div.exxitematrix.cards div.matrixitem{background:var(--bodybgaccent); position:relative; transition: color  0.5s,background-color 0.5s; max-width:300px;}
div.exxitematrix.cards div.matrixitem div.imgholder{height:150px; overflow:hidden; background:rgba(0,0,0,0.2); }

div.exxitematrix.cards div.matrixitem div.imgholder div.imageicon{width:100%; height:100%; position:relative; background-repeat:no-repeat; background-size:cover; background-position:center center;}
div.exxitematrix.cards div.matrixitem div.imgholder div.iconimginner{width:100%; height:100%; position:relative; background-repeat:no-repeat; background-size:contain; background-position:center center;}
div.exxitematrix.cards div.matrixitem div.imgholder div.defaulticon{width:100%; height:100%; position:relative;}
div.exxitematrix.cards div.matrixitem div.imgholder div.defaulticonmod{font-size:4em; color: var(--bodybgaccent); text-align:center; position:absolute; top:50%;left:50%; transform:translate(-50%,-50%);}
div.exxitematrix.cards div.matrixitem div.imgholder div.txticon{width:100%; height:100%; overflow:hidden; font-size:0.75em; color:var(--bodywhite); padding:2em 60px 10px 10px;}

div.exxitematrix.cards div.matrixitem div.img{height:150px; background-position:center center; background-repeat:no-repeat; background-size:cover; transition: var(--trans);}
div.exxitematrix.cards div.matrixitem div.txt{padding:10px 10px 20px 10px; position:relative;}
div.exxitematrix.cards div.matrixitem div.txt h4{font-size:0.9em; font-weight:bold; margin:0 0 10px 0; display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
div.exxitematrix.cards div.matrixitem div.txt p{font-size:0.75em;}
div.exxitematrix.cards div.matrixitem div.txt:after{content: ''; display: block; background: rgba(0,0,0,0.3); position: absolute; bottom: 0; left: 0; right: 0; height: 2px;}

div.exxitematrix.cards div.matrixitem:hover {background-color:var(--bodybgaccent);}
div.exxitematrix.cards div.matrixitem:hover div.txt{color:var(--link);}
div.exxitematrix.cards div.matrixitem:hover div.img{transform:scale(1.1,1.1);}
div.exxitematrix.cards div.matrixitem a.url{display:block; position:absolute; top:0; bottom:0; left:0; right:0;}
div.exxitematrix.cards div.matrixitem a.nmenu{position:absolute; display:block; top:10px; right:10px; height:30px; width:30px; border-radius:50%; text-align:center; box-sizing:border-box; overflow:hidden; background:var(--link); font-family:var(--icon);padding-top:4px; font-size:1.2em; color:var(--bodywhite);}
div.exxitematrix.cards div.matrixitem a.nmenu:hover{background:var(--hover);}
div.exxitematrix.cards div.matrixitem a.nmenu:focus{background:var(--hover);}

div.exxitematrix.exxiteplate{margin:5px 0 10px 0;}
div.exxitematrix.exxiteplate div.matrixitem{background:var(--bodybgaccent); padding:10px 10px 20px 10px; text-align:left; font-size:0.9em; font-weight:bold; color:var(--bodycolorlight);}


div.exxitematrix.bigbuttons{grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));}
div.exxitematrix.bigbuttons div.matrixitem{background:var(--bigbuttonbg); padding:10px 10px 25px 10px; text-align:left;}

div.exxitematrix.bigbuttons div.matrixitem.sel{background:var(--darkbg); color: var(--bodybgaccent)}
div.exxitematrix.bigbuttons div.matrixitem.sel:hover{background:var(--darkbg); color:var(--bodywhite)}
div.exxitematrix.bigbuttons div.matrixitem.sel:before{content:'Z'; font-family:var(--icon); position:absolute; right:10px; top:10px; font-size:2em; color:var(--border);}

div.exxitematrix.bigbuttons div.matrixitem.dark{background:var(--darkbg); color: var(--bodybgaccent)}
div.exxitematrix.bigbuttons div.matrixitem.dark:hover{background:var(--darkbg); color:var(--bodywhite)}

div.exxitematrix.bigbuttons div.matrixitem:hover {background:var(--bigbuttonhover); color:var(--link);}
div.exxitematrix.bigbuttons div.matrixitem:hover div.exxitebigbuttonicon {color:var(--hover);}
div.exxitematrix.bigbuttons div.matrixitem:active {background:var(--border); color:var(--link);}
div.exxitematrix.bigbuttons div.matrixitem:active div.exxitebigbuttonicon {color:var(--hover);}
div.exxitematrix.bigbuttons div.matrixitem h2 {font-size:0.9em; font-weight:bold; overflow:hidden;}
div.exxitematrix.bigbuttons div.matrixitem p {font-size:0.8em;}
div.exxitematrix.bigbuttons div.matrixitem div.exxitebigbuttonicon {position:absolute; top:10px; left:10px; color:var(--link-pale);}
div.exxitematrix.bigbuttons div.matrixitem div.exxitebigbuttonimg{position:absolute; top:10px; left:10px; width:32px; height:32px; background-repeat:no-repeat; background-position:center center; background-size:contain;}
div.exxitematrix.bigbuttons div.matrixitem div.exxitebigbuttontxt {margin:0 20px 0 45px;}
div.exxitematrix.bigbuttons div.matrixitem a.exxitebigbuttonlink{display:block; position:absolute; top:0; right:0; left:0; bottom:0;}
div.exxitematrix.bigbuttons div.matrixitem a.exxitebigbuttonlink:after{content:''; display:block; background:rgba(0,0,0,0.3); position:absolute; bottom:0; left:0; right:0; height:2px; transition:var(--trans);}
div.exxitematrix.bigbuttons div.matrixitem a.exxitebigbuttonlink:hover:after{height:4px;}
div.exxitematrix.bigbuttons div.matrixitem a.exxitebigbuttonlink:active:after{display:none;}

div.exxitematrix.bigbuttons div.matrixitem.danger{padding-bottom:40px;}
div.exxitematrix.bigbuttons div.matrixitem.danger:after{content:''; display:block; background-size:var(--stripe-bg-size); background-color:var(--danger); position:absolute; bottom:0; left:0; right:0; height:10px;}
div.exxitematrix.bigbuttons div.matrixitem.danger div.exxitebigbuttonicon {color:var(--red);}
div.exxitematrix.bigbuttons div.matrixitem.danger:hover div.exxitebigbuttonicon {color:var(--erroraccent);}

div.exxitematrix.bigbuttons div.matrixitem a.exxitebadge{display:block; position:absolute; top:0; right:0; width:20px; height:20px; font-family:var(--icon); font-size:1.2em;}
div.exxitematrix.bigbuttons div.matrixitem a.exxitebadge:link{color:var(--bodybg);}
div.exxitematrix.bigbuttons div.matrixitem a.exxitebadge:visited{color:var(--bodybg);}
div.exxitematrix.bigbuttons div.matrixitem a.exxitebadge:hover{color:var(--hover);}
div.exxitematrix.bigbuttons div.matrixitem a.exxitebadge:focus{color:var(--hover);}
div.exxitematrix.bigbuttons div.matrixitem a.exxitebadge span{ display:none;}

/*bagde style begin*/
div.exxitebigbutton a.exxitebadge{display:block; position:absolute; top:0; right:0; width:20px; height:20px; font-family:var(--icon); font-size:1.2em;}
div.exxitebigbutton a.exxitebadge:link{color:var(--bodywhite);}
div.exxitebigbutton a.exxitebadge:visited{color:var(--bodywhite);}
div.exxitebigbutton a.exxitebadge:hover{color:var(--hover);}
div.exxitebigbutton a.exxitebadge:focus{color:var(--hover);}
div.exxitebigbutton a.exxitebadge span{ display:none;}
/*bagde style end*/

div.exxitematrix.dashboard{margin:0 0 10px 0; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); grid-gap:10px;}
div.exxitematrix.dashboard div.matrixitem{background:var(--bodybgaccent); position:relative;}
div.exxitematrix.dashboard div.exxiteicon{position: absolute; top: 10px;left: 10px; width: 40px;background: var(--border); color: var(--bodywhite); text-align: center; font-size: 1.8em; line-height:1.4em; height: 40px; border-radius: 50%; transition:var(--trans);}

div.exxitematrix.dashboard div.exxitedash.num{padding:0 5px 0 20px; margin:10px 5px 20px 60px; border-left:1px solid var(--border);}

div.exxitematrix.dashboard div.exxitedash.button div.exxiteicon{font-size: 1.4em; line-height:1.4em; width: 30px; height:30px; transition:var(--trans);}
div.exxitematrix.dashboard div.exxitedash.button:hover div.exxiteicon{background-color:var(--hover);}
div.exxitematrix.dashboard div.exxitedash.num:hover div.exxiteicon{background-color:var(--hover);}
div.exxitematrix.dashboard div.exxitedash.button{padding:0 5px 0 5px; margin:10px 5px 20px 60px; border-left:1px solid var(--border);}
div.exxitematrix.dashboard div.exxitedash h4{text-transform:uppercase; font-size:0.7em; color:var(--bodycolorlight); margin:0 0 20px 0;}
div.exxitematrix.dashboard div.exxitedash.num h3{font-size:2.4em; margin-bottom:10px;}
div.exxitematrix.dashboard div.exxitedash.button h3{font-size:0.9em; margin-bottom:10px; font-weight:bold; color:var(--link);}
div.exxitematrix.dashboard div.exxitedash h3 span{font-size:0.5em;}
div.exxitematrix.dashboard div.exxitedash p{font-size:0.8em; margin:0 0 10px 0;}
div.exxitematrix.dashboard div.exxitedash a.cmd{display:block; position:absolute; top:0; right:0; bottom:0; left:0;}
div.exxitematrix.dashboard div.exxitedash a.btn{display:block; font-size:0.8em; padding:1em; border-bottom:1px solid var(--border); color:var(--bodycolor);}
div.exxitematrix.dashboard div.exxitedash a.btn:last-child{border:none;}
div.exxitematrix.dashboard div.exxitedash a:hover{background-color:rgba(0,204,255,0.1); color:var(--link);}

/*matrix styles end*/

/*file thumbnail styles begin*/
div.exxitefilethumb{width:250px;position:relative; margin:0 0 10px 0;}
div.exxitefilethumb div.img{height:150px; position:relative;}
div.exxitefilethumb div.txt{padding:20px; background:var(--bodybgaccent); text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}
div.exxitefilethumb div.txt h5{font-size:0.9em; font-weight:bold; color:var(--bodycolor);}
div.exxitefilethumb a{display:block; position:absolute; top:0; left:0; right:0; bottom:0;}
/*file thumbnail styles end*/


/*textbox styles begin*/
div.exxitebox{background:var(--bodybgaccent); padding:10px; margin-bottom:10px;}
/*textbox styles end*/

/*If a page is a link this is displayed -- begin -- sys/genlib2.php XXX*/
div.exxitepagelink{background:var(--bodybgaccent); padding:2em 4em 4em 4em; position:relative;}
div.exxitepagelink a{font-size:0.8em; font-weight:bold;}
/*If a page is a link this is displayed -- end*/


/*loginframe style begin -- sys/usrlib.php XXX */
div.loginframe {margin:auto; max-width:750px;}
div.loginframeholder {padding:50px; }
div.caps {font-size:0.7em; color:var(--bodycolor); display:none; padding:10px; background:var(--error); text-transform:uppercase;}
/*loginframe style end*/

/* pager styles begin -- formlib.php -- class unipager XXX*/
div.pager {padding:4px 0 4px 0; border-bottom:1px solid var(--border);}

div.pagercount {float:right; font-size:0.8em; font-weight:bold; color:var(--bodycolorlight); padding:5px 10px 0 20px; text-align:right}
div.pagerlink {float:right; font-size:0.7em;}
div.pagerlink a{display:block;}
div.pagerlink a:link {background:var(--bodybgaccent); padding:5px 10px 5px 10px; border:1px solid var(--border); margin-left:5px;}
div.pagerlink a:visited {background:var(--bodybgaccent); padding:5px 10px 5px 10px; border:1px solid var(--border); margin-left:5px;}
div.pagerlink a:hover {background:var(--bodywhite); padding:5px 10px 5px 10px; border:1px solid var(--border); margin-left:5px;}
div.pagerlink a:focus {background:var(--bodywhite); padding:5px 10px 5px 10px; border:1px solid var(--border); margin-left:5px;}

div.pagerjump{text-align:left; font-size:0.8em; color:var(--border); padding:5px; margin:0 0 5px 0; display:none;}
div.pagerjump strong {color:var(--bodywhite); background:var(--semidark); padding:4px;}
div.pagerjump a{padding:0 5px 0 5px; line-height:2.3em;}

select.exxitepagesizer {float: right;margin: 0 0 0 5px; background:var(--bodybg); color:var(--bodycolorlight); border:1px solid transparent; height: 26px;}
select.exxitepagesizer:focus{outline:none; background-color:var(--focus);}
/* pager styles end*/



/*console mark and label styles begin*/
div.exxitemark{background:var(--bodybgaccent); padding:10px 10px 10px 60px; position:relative; min-height:55px; box-sizing:border-box; margin:0 0 10px 0;}
div.exxitemark:after{content:''; font-family:var(--icon); position:absolute; top:10px; left:10px; color:var(--bodycolor); font-size:2em;}
@container(max-width:250px)
{
	div.exxitemark{padding:5px 5px 5px 10px;}
	div.exxitemark:after{display:none;}
}

div.exxitemark.danger{background:var(--danger);}
div.exxitemark.danger:after{content:']';}
div.exxitemark.danger:before{content:''; display:block; position:absolute; bottom:0; left:0; right:0; height:10px; background:var(--stripe-bg-danger-strong); background-size:20px 20px; }



div.exxitelabel{background:var(--bodybgaccent); color:var(--bodycolor); padding:10px; font-size:0.7em; margin:0 0 5px 0;}
div.exxitelabel.left{float:left; margin-left:5px;}
/*console mark and label styles end*/

/*new messaging system CSS begin*/
div.exxitefloatholder {position:fixed; top:0; left:0; right:0; text-align:center; z-index:1000; height:0;}
@keyframes toast
{
  0% {top:-100px; opacity:0;}
  5% {top:25px; opacity:1;}
  95% {top:25px; opacity:1;}
  100% {opacity:0; top:25px; display:none;}
}

@keyframes floater
{
  0% {opacity:0;}
  80% {opacity:1; transform:scale(1.01);}
  100% {transform:scale(1);}
}

@keyframes jumper
{
  0% {transform:scale(1);}
  50% {transform:scale(1.01);}
  100% {transform:scale(1);}
}

div.exxitetoast{position:fixed; left:50%; transform: translate(-50%); background:var(--darkbg); color:var(--bodybg); font-size:0.8em; padding:1em 2em; box-shadow: 0px 4px 5px 0px rgba(0,0,0,0.4); max-width:30%;
  top:25px; opacity:0; animation:toast 3s 1; z-index: 100000;
}
div.exxitetoast.ok{background:var(--ok); color:var(--bodycolor); padding-left:3em;}
div.exxitetoast.ok:after{content:'Z'; font-family:var(--icon); display:block; position:absolute; top:0; left:0;  padding:1em; color:var(--okaccent); transform:scale(1.5);}
div.exxitetoast.info{background:var(--info); color:var(--bodycolor);padding-left:3em;}
div.exxitetoast.info:after{content:'z'; font-family:var(--icon); display:block; position:absolute; top:0; left:0; padding:1em; color:var(--infoaccent); transform:scale(1.5);}
div.exxitetoast.error{background:var(--error); color:var(--bodycolor);padding-left:3em;}
div.exxitetoast.error:after{content:'\00F3'; font-family:var(--icon); display:block; position:absolute; top:0; left:0; padding:1em; color:var(--erroraccent); transform:scale(1.5);}

div.exxitefloat{font-size:0.8em; position:relative; padding:1em 2em; box-shadow: 0px 4px 5px 0px rgba(0,0,0,0.4); max-width:50%; background:var(--darkbg); color:var(--bodybg); margin:0 auto 10px auto;
  text-align:left;
  animation:floater 0.2s 1;
}
div.exxitefloat h5{font-weight:bold;}
div.exxitefloat p{font-size:0.9em; margin-top:0.5em;}
div.exxitefloat a.close{display:grid; width:24px; height:24px; position:absolute; right:0; top:0; text-decoration:none;}
div.exxitefloat a.close span{display:none;}
div.exxitefloat a.close:before{content:'\00E1'; font-family:var(--icon); display:block; align-self:center; justify-self:center; color:var(--bodybg);}
div.exxitefloat a.close:hover:before{transform:scale(1.2);}

div.exxitefloat.ok{background:var(--ok); padding-left:3em; color:var(--bodycolor);}
div.exxitefloat.ok:after{content:'Z'; font-family:var(--icon); display:block; position:absolute; top:0; left:0; padding:1em; color:var(--okaccent); transform: scale(1.5); transform-origin: 50% 50%;}
div.exxitefloat.ok a.close:before{color:var(--bodycolor);}
div.exxitefloat.info{background:var(--info); padding-left:3em; color:var(--bodycolor);}
div.exxitefloat.info:after{content:'z'; font-family:var(--icon); display:block; position:absolute; top:0; left:0; padding:1em; color:var(--infoaccent); transform: scale(1.5); transform-origin: 50% 50%;}
div.exxitefloat.info a.close:before{color:var(--bodycolor);}
div.exxitefloat.error{background:var(--error); padding-left:3em; color:var(--bodycolor);}
div.exxitefloat.error:after{content:'\00F3'; font-family:var(--icon); display:block; position:absolute; top:0; left:0; padding:1em; color:var(--erroraccent); transform: scale(1.5); transform-origin: 50% 50%;}
div.exxitefloat.error a.close:before{color:var(--bodycolor);}
div.exxitefloat.question{background:var(--question); padding-left:3em;}
div.exxitefloat.question:after{content:'x'; font-family:var(--icon); display:block; position:absolute; top:0; left:0; padding:1em; color:var(--questionaccent); transform: scale(1.5); transform-origin: 50% 50%;}
div.exxitefloat.question a.close:before{color:var(--bodycolor);}

div.exxitefloat-modal{position:fixed; top:0; left:0; right:0; z-index:1000001;}
div.exxitefloat.static{position:relative; max-width:none; box-shadow:none;}

@media only screen and (orientation: portrait)
{
    div.exxitetoast{max-width:98%;}
    div.exxitefloat{max-width:98%;}
}

div.exxitemsgbuttons{padding-top:0.5em; margin-top:0.5em; border-top:1px solid var(--a9);}
div.exxitemsgbuttons a{text-decoration:none; display:inline-block; margin:0 10px 0 0; padding:0.5em 2em;}
div.exxitemsgbuttons a:link{background:var(--lighten6); color:var(--bodycolor); border-bottom:2px solid var(--darken3);}
div.exxitemsgbuttons a:visited{background:var(--lighten6); color:var(--bodycolor);  border-bottom:2px solid var(--darken3);}
div.exxitemsgbuttons a:hover{background:var(--bodybg); color:var(--bodycolor);  border-bottom:2px solid var(--darken3);}
div.exxitemsgbuttons a:active{background:var(--darkbg); color:var(--bodybg);}

@media (prefers-color-scheme: dark) {
	div.exxitemsgbuttons a:link{background:var(--darken3); color:var(--bodycolor); border-bottom:2px solid var(--darken6);}
	div.exxitemsgbuttons a:visited{background:var(--darken3); color:var(--bodycolor);  border-bottom:2px solid var(--darken6);}
	div.exxitemsgbuttons a:hover{background:var(--bodybg); color:var(--bodycolor); border-bottom:2px solid var(--darken6);}
}

div.jump{animation:jumper 0.2s 2;}
/*new messaging system CSS end*/

/*link selector styles begin*/
div.selectorframe {background:var(--border); margin:0 0 10px 5px;}
div.selectoritem {font-size:0.7em;}
div.selectoritem a {display:block;  padding:5px 10px 5px 10px;}
div.selectoritem a:hover{background:var(--bodycolorlight); color:var(--hover);}
div.selectoritem a:focus{background:var(--bodycolorlight); color:var(--hover);}
div.selectoritem a:active{background:var(--darkbg); color:var(--bodywhite);}
div.selectoritem.sel {background:var(--bodycolorlight)}
div.selectoritem.sel a {color:var(--bodywhite);}
div.selectorframe.big div.selectoritem{font-size:1em; }
div.selectorframe.big div.selectoritem a{font-family:var(--icon); padding:5px 20px 6px 20px;}
/*link selector styles end*/

/*switch styles begin*/
div.exxiteswitchcontrol{height:20px; display:grid; grid-template-columns:40px auto; grid-gap:10px;}

a.exxiteswitch{display:block; background:var(--border); height:20px; overflow:hidden; position:relative;}
a.exxiteswitch.sel{background:var(--link);}
a.exxiteswitch:after{content:''; display:block; position:absolute; top:2px; left:2px; bottom:2px; width:16px; background:var(--bodybg);}
a.exxiteswitch.sel:after{position:absolute; top:2px; left:auto; right:2px; bottom:2px;}
a.exxiteswitch:hover{background:var(--hover);}
a.exxiteswitch:focus{background:var(--hover);}

div.switchtxt{font-size:0.75em; display:grid;}
div.switchtxt span{align-self:center;}
div.switchtxt span.no{display:inline;}
div.switchtxt span.yes{display:none;}
div.switchtxt.sel span.no{display:none;}
div.switchtxt.sel span.yes{display:inline;}

/*switch styles end*/

/*link breadcrumb styles begin*/
div.breadcrumbframe {background:var(--bodybgaccent); margin:0 0 10px 0; }
div.breadcrumbitem {font-size:0.7em;}
div.breadcrumbitem a {display:block;  padding:10px 40px 10px 20px; position:relative;}
div.breadcrumbitem a:hover{background:var(--bodycolorlight); color:var(--bodywhite);}
div.breadcrumbitem a:focus{background:var(--bodycolorlight); color:var(--bodywhite);}
div.breadcrumbitem a:active{background:var(--darkbg); color:var(--bodywhite);}
div.breadcrumbitem a:after {content: 'N';font-family:var(--icon);display:block;position:absolute;font-size:1.4em;right:0; top:2px;padding:5px;}
div.breadcrumbitem:last-child a{padding-right:20px;}
div.breadcrumbitem:last-child a:after{display:none;}
/*link breadcrumb styles end*/

/*exxite grid2 styles begin*/
div.exxite-grid{display:grid;}
div.exxite-grid div.grid-item{container-type:inline-size;}
@container(inline-size < 100px)
{
  div.exxite-grid div.grid-item-inner{display:none;}
}
div.exxite-grid div.grid-grip{position:relative; cursor:col-resize;}
div.exxite-grid div.grid-grip:before{content:''; display:block; position:absolute; top:0; right:0; bottom:0; left:50%; width:1px; background:var(--border);}
div.exxite-grid div.grid-grip:hover:before{background:var(--hover);}
/*exxite grid2 styles end*/

/*exxite grid styles begin*/
div.exxitepane{float:left;}
div.exxitepaneinner{margin:0 10px 0 0;}
div.exxitepaneframe{overflow:hidden; width:100%; margin-top:10px;}
div.exxitepaneframefixed{position:relative;}
/*exxite grid styles end*/

/* exxite image viewer styles begin*/
div.exxiteimgframe {width:100%; height:100%; overflow:auto; padding:0; margin:0;}
div.exxiteimgframe.white {background:var(--bodywhite);}
div.exxiteimgframe.gray {background:var(--lightgra);}
div.exxiteimgframe.black {background:var(--black);}
/* exxite image viewer styles end*/


/*graph styles begin*/
div.exxitegraph {padding:10px; margin:0 0 10px 0;}
div.exxitegraph table {font-size:0.8em; border-collapse: collapse; width:100%; border:0; margin:0;}
div.exxitegraph .label {color:var(--bodycolorlight); width:10%; white-space:nowrap;}
div.exxitegraph .label a{ font-weight:bold;}
div.exxitegraph .num {color:var(--bodycolorlight); font-weight:bold; text-align:right; width:10%; padding:0 10px 0 0; height:25px;}
div.exxitegraph .sumnum {color:var(--bodycolorlight); font-weight:bold; text-align:right; width:10%; padding:0 10px 0 0; font-size:1.7em;  border-top:1px solid var(--a9); white-space:nowrap;  padding-top:10px;}
div.exxitegraph .sumlabel {color:var(--bodycolorlight); width:10%; white-space:nowrap; font-size:1.7em; border-top:1px solid var(--a9); padding-top:10px;}
div.exxitegraph .col {width:80%; border-left:1px solid var(--a9);}
div.exxitegraphcol {text-align:left; padding:0; margin:0;  animation:xgrow 1s;}
div.exxitegraphcolinner {background:var(--accent); height:15px; width:calc(var(--progress) * 1%);
--h-start: 120;
--s-start: 100;
--l-start: 50;
--h-end: 0;
--s-end: 100;
--l-end: 50;
background-color: hsl(
  calc(var(--h-start) + (var(--h-end) - var(--h-start)) * var(--progress) / 100),
	calc(calc(var(--s-start) + (var(--s-end) - var(--s-start)) * var(--progress) / 100) * 1%),
	calc(calc(var(--l-start) + (var(--l-end) - var(--l-start)) * var(--progress) / 100) * 1%));
}
div.exxitegraphcolinnersigned {background:var(--infoaccent); height:15px;}
/*graph styles end*/

/*dualgraph styles begin*/
div.exxitedualgraph{padding:10px; margin:0 0 10px 0; display:grid; grid-template-columns: 1fr 6fr 1fr; grid-gap:10px;}
div.exxitedualgraph div.dualbar{border:1px solid var(--border);}
div.exxitedualgraph div.dualbar-inner{height:100%; width:calc(var(--progress) * 1%);}
div.exxitedualgraph div.label{font-size:0.8em; color:var(--bodycolorlight);}
div.exxitedualgraph div.left-label{text-align:right;}
div.exxitedualgraph div.label span{font-weight: bold;}
div.exxitedualgraph div.sum{grid-column-start: 1; grid-column-end:4; text-align:center;}

/*dualgraph styles end*/


/* popup and main menu styles begin*/
/*div.exxitemainmenu {border-bottom:1px solid var(--a13); background:var(--bodybgaccent);}*/
div.exxitemm {font-size:0.75em; float:left; white-space: nowrap;}
div.exxitemm a {display: block;  padding:10px 20px 4px 20px; height:35px;  box-sizing:border-box;}
div.exxitemm a:hover {background:var(--a5);}
div.exxitemm a:focus {background:var(--a5);}

div.exxitemm a.sys{font-family:var(--icon); font-size:1.4em; display:block; font-weight:normal; height:35px; width:40px; padding:8px 10px 0 10px; overflow:hidden;}

div.exxitemi {background:var(--bodybgaccent); min-width:200px; position:relative;}
div.exxitemi a {display: block; padding:10px 20px 10px 10px; height:35px;}
div.exxitemi a:hover {background:var(--a5);}
div.exxitemi a:focus {background:var(--a5);}
div.exxitemi div.ico{padding:0 0 0 25px;}
div.exxitemi div.ico span{font-family:var(--icon); font-size:1.8em; line-height:1.6em; display:block; position:absolute; top:0; left:5px;}
div.exxitema {position:absolute; border-top:1px solid var(--border); box-shadow:0 4px 8px rgba(0,0,0,0.5); z-index:100; max-height:calc(100vh - 135px); overflow:auto;}


div.exxitemenuicon {position:absolute; top:42px; right:10px; z-index:12}
div.exxitemenuiconitem{float:right;}
div.exxitemenuiconlabel {font-size:0.7em; text-align:center;}
div.exxitemenuiconlabel a {}

div.exxitetoolbar {float:right; margin:-35px 0 0 0;padding:5px 10px 5px 10px;}
div.exxitetoolbaritem{float:right; padding:0 0 0 5px;}
div.exxitetoolbaritem img {width:36px; height:36px;}

div.exxitepopupmenu {position:absolute; box-shadow:0 4px 8px rgba(0,0,0,0.5); z-index:100; font-size:0.75em; background:var(--bodybgaccent);}
div.exxitepopupmenu a{display:block; padding:10px 20px 10px 20px; position:relative;}
div.exxitepopupmenu a:hover {background:var(--a5);}
div.exxitepopupmenu a:focus {background:var(--a5);}
div.exxitepopupmenu div.ico{padding:0 0 0 25px;}
div.exxitepopupmenu div.ico span{font-family:var(--icon); font-size:1.8em; line-height:1.6em; display:block; position:absolute; top:0; left:5px;}

a.micon{display:block; width:40px; height:32px; float:right; font-family:var(--icon); text-align:center; font-size:1.5em; padding-top:4px;}
a.micon:link{color:var(--a9);}
a.micon span{display:none;}

/* popup and main menu styles end*/

/*popupframe styles begin*/
div.interface_popupframe{padding:20px 20px 60px 20px;}
div.interface_popupframe.top40{padding-top:50px;}
div.popupframe {padding:10px 10px 40px 10px;}

div.popuptop {background:var(--bodybgaccent); font-size:0.7em;  border-bottom:1px solid var(--border);}
div.popuptop a {display:block; padding:7px 15px 7px 15px;}
div.popuptop a:link {color:var(--link); }
div.popuptop a:visited {color:var(--link); }
div.popuptop a:hover {color:var(--hover);  background:var(--a13);}
div.popuptop a:focus {color:var(--hover);  background:var(--a13);}

div.popupbottom {position:fixed; width:100%; bottom:0;  background:var(--bodybgaccent); font-size:0.7em;  border-top:1px solid var(--border); z-index:10;}
div.popupbottom a {display:block; padding:7px 15px 7px 15px;}
div.popupbottom a:link {color:var(--link); }
div.popupbottom a:visited {color:var(--link); }
div.popupbottom a:hover {color:var(--hover);  background:var(--a13);}
div.popupbottom a:focus {color:var(--hover);  background:var(--a13);}
/*popupframe styles end*/

/*linklist as menu styles begin*/
div.exxiterow2 ul {background:var(--a13); padding:1px; border-radius:2px;margin:0 0 10px 0;}
div.exxiterow2 li {font-size:0.8em; }
div.exxiterow2 li a {display:block; margin:0 0 1px 0; padding:5px 20px 5px 20px; }
div.exxiterow2 li:last-child a {margin:0;}
div.exxiterow2 li a:link {background:var(--bodybgaccent);}
div.exxiterow2 li a:visited {background:var(--bodybgaccent);}
div.exxiterow2 li a:hover {background:var(--bodywhite);}
div.exxiterow2 li a:focus {background:var(--bodywhite);}
div.exxiterow2 li a:active {background:var(--link); color:var(--bodywhite);}
div.exxiterow2 li h1 {margin:0 0 1px 0; padding:2px 10px 2px 10px; font-size:1.4em; font-weight:bold; color:var(--bodycolorlight); background:var(--bodybgaccent);}
div.exxiterow2 li p {margin:0 0 1px 0; padding:2px 10px 2px 10px; background:var(--bodybgaccent);}
div.exxiterow2 li strong {font-weight:bold;}
/*linklist as menu styles end*/




/*source view frame at index.php*/
div.exxitesource {border:4px solid  var(--bodybgaccent); padding:10px;}


/*compact search form styles begin -- sys/formlib.php uniform class XXX*/
div.exxitesearch{margin:0 0 10px 0; display:grid; grid-template-columns:auto 50px;}
input.exxitesearchinput {font-size:1.2em; background:var(--bodybgaccent); border:0; border-top:2px solid var(--border); color:var(--bodycolorlight); margin:0; padding:5px 10px;}
input.exxitesearchinput:focus{outline:none; background:var(--inputfocus)}
input.exxitesearchsubmit,button.exxitesearchsubmit {font-family:var(--icon); font-size:1.2em; overflow:hidden; border:0; background:var(--border); cursor:pointer; text-align:center; color:var(--bodycolor); padding:0;}
input.exxitesearchsubmit:hover, button.exxitesearchsubmit:hover {color:var(--bodywhite); background:var(--hover);}
input.exxitesearchsubmit:focus, button.exxitesearchsubmit:focus {color:var(--bodywhite); background:var(--hover); outline:none;}
input.exxitesearchsubmit:active, button.exxitesearchsubmit:active {color:var(--bodywhite); background:var(--darkbg);}
/*compact search form styles end*/

/*editable spreadheet style begin*/
div.exxitespreadcell {cursor:pointer; height:20px;}
div.exxitespreadcell:hover {background:var(--bodybgaccent); color:var(--link);}
div.exxitespreadcellinner {height:20px;}
.exxitespreadinput{width:100%; background:var(--bodybgaccent);}
/*editable spreadheet style end*/

/*file view styles begin*/
div.exxitefileviewtools{position:fixed; top:0; left:0; right:20%; padding:10px; background:var(--bodybgaccent);}

div.exxitefileinfo {position:fixed; top:0; left:80%; right:0; bottom:27px; padding:20px 20px 50px 20px; overflow:auto;}
div.exxitefileinfo div.info{margin:0 0 10px 0;}
div.exxitefileinfo div.info h1{font-size:1em; font-weight:bold; display:block; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;}
div.exxitefileinfo div.info p{font-size:0.8em; margin:0 0 10px 0;}
div.exxitefileinfo div.info h6{font-size:0.7em; text-transform:uppercase; font-weight:bold; margin:5px 0 5px 0;}
div.exxitefileinfo div.palette{display:grid; grid-template-columns:repeat(auto-fit, minmax(100px, 1fr)); grid-gap:4px; margin:2px 0 0 0; cursor:pointer;}
div.exxitefileinfo div.palette-item{font-size:0.7em; text-align:center; padding:10px;}
div.exxitefileinfo div.palette-item span{color:var(--bodywhite); background:rgba(0,0,0,0.4); padding:2px;}

div.exxitefileshow {position:fixed; top:0; left:0; right:20%; bottom:27px; overflow:auto;}
div.exxitefileshow.img{top:42px;}
div.exxitefileshow.dark{background:#000;}
div.exxitefileshow.light{background:#fff;}
div.exxitefileshow img{display:block; max-width:100%; max-height:100%; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); image-rendering: pixelated; object-fit:contain;}
div.exxitefileshow iframe{border:0; width:100%; height:100%; margin:0; padding:0; display:block;}
div.exxitefileshow video{display:block; max-width:100%; max-height:100%; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);}
div.exxitefileshow div.exxitenopreview {position:absolute; top:0; right:0; bottom:0; left:0; background:var(--bodybgaccent);}
div.exxitefileshow div.exxitenopreview span{display:block; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); font-size:0.8em; color:var(--bodycolorlight); text-transform:uppercase;}
div.exxitefileshow div.exxitenopreview span:before{content:'W'; font-family:var(--icon); color:var(--bodywhite); font-size:5em; display:block; position:absolute; bottom:100%; left:0; right:0; text-align:center;}
/*file view styles end*/

/*array print styles begin*/
div.exxitearrayprint{background:var(--bodybgaccent);}
div.exxitearrayprint div.item{border-bottom:1px solid var(--bodywhite); display:grid; grid-template-columns:150px auto;}

div.exxitearrayprint div.tree-item div.key.closed{border-bottom:1px solid var(--bodywhite); position:relative; cursor:pointer;}
div.exxitearrayprint div.tree-item div.key.opened{border-bottom:1px solid var(--bodywhite); position:relative; cursor:pointer;}
div.exxitearrayprint div.tree-item div.key.closed:hover{color:var(--hover); background:var(--bodycolorlight);}
div.exxitearrayprint div.tree-item div.key.opened:hover{color:var(--hover); background:var(--bodycolorlight);}
div.exxitearrayprint div.tree-item div.key.closed:after{content:'N'; display:block; position:absolute; top:0; left:0; bottom:0; width:25px; text-align:center; font-family:var(--icon); line-height:1.9em;}
div.exxitearrayprint div.tree-item div.key.opened:after{content:'S'; display:block; position:absolute; top:0; left:0; bottom:0; width:25px; text-align:center; font-family:var(--icon); line-height:1.9em;}

div.exxitearrayprint div.key{font-size:0.75rem; padding:4px 4px 4px 25px; overflow:hidden; text-overflow:ellipsis;}
div.exxitearrayprint div.value{font-size:0.8rem; padding:4px;}
/*array print styles end*/



/* notebook styles begin*/
div.exxitenotebookframe{line-height:0; position:relative;}
textarea.exxitenotepad{width:100%;height:200px; min-height:100px; background:var(--notebg); border:1px solid var(--border); padding:10px 60px 10px 10px; resize:vertical; box-sizing: border-box; font-family:var(--face); color:var(--notefg); font-size:0.8em; line-height:1.4em; outline:none;}
a.exxitenotepadtitle{display:block; line-height:1.4em; padding:4px 15px; font-size:0.7em; background-color:var(--bodybgaccent); border-bottom:1px solid var(--border); border-right:1px solid var(--border); border-left:1px solid var(--border); text-overflow:ellipsis; overflow:hidden; white-space:nowrap; position:relative;}
a.exxitenotepadtitle.sel:before{content:''; display:block; position:absolute; top:0; bottom:0; left:0; width:4px; background-color:var(--link); }

a.exxitenotesbtn{display:block; position:absolute; top:15px; right:25px; width:25px; height:25px;}
a.exxitenotesbtn:link:before{color:rgba(0,0,0,0.5);}
a.exxitenotesbtn:visited:before{color:rgba(0,0,0,0.5);}
a.exxitenotesbtn:hover:before{color:var(--hover);}
a.exxitenotesbtn:active:before{color:var(--bodycolor);}
a.exxitenotesbtn span{display:none;}
a.exxitenotesbtn:before{display:block; position:absolute; top:0; right:0; left:0; bottom:0; font-family:var(--icon); text-align:center; font-size:1.5em; line-height:1em; transition:0.5s all;}
a.exxitenotesbtn.new:before{content:',';}
a.exxitenotesbtn.del{top:50px;}
a.exxitenotesbtn.del:before{content:'ź';}
/* notebook styles end*/


/*jquery styles begin*/
div.bscol300 {overflow:hidden;}
div.bscolinner{margin:0 -5px 5px 0;}
div.bscol300 div.item{float:left; width:20%; box-sizing:border-box;}
div.bscolitem{margin:0 5px 5px 0;}
/*jquery styles end*/


/*bubble styles begin -- exxite.js -- bs_bubble XXX*/
div#bubble {position:absolute;  max-width:400px;  z-index:10000; animation-name:fade_in; animation-duration:0.2s; animation-iteration-count:1;}
div.exxitebubble {padding:10px 20px 10px 20px; font-size:0.7em; background:var(--bodycolor); color:var(--border); line-height:1.5em; border-radius:3px; overflow:hidden;}
div.exxitebubble strong {font-weight:bold; font-size:1.2em;}
div.exxitebubbletail {position:absolute; width:0; height:0; top:100%;    left:50%; transform:translate(-5px,0); border-style: solid; border-width: 8px 5px 0 5px; border-color: var(--bodycolor) transparent transparent transparent;}
div.exxitebubbletop  {position:absolute; width:0; height:0; bottom:100%; left:50%; transform:translate(-5px,0); border-style: solid; border-width: 0 5px 8px 5px; border-color: transparent transparent var(--bodycolor) transparent;}
div.exxitebubblecontent {display:none;}
div.exxitebubble td{vertical-align:top; padding:0 4px 0 4px;}
/*bubble styles end*/

/*css editor styles begin*/
div.exxitecsslabel {background:var(--bodybgaccent); color:var(--console-comment); line-height: 18px;font-family:var(--codeface); font-size:12px; padding:4px 10px 4px 20px; border-top:1px solid var(--border); margin:0 0 0 -9px; font-weight:bold;}
/*css editor styles end*/


div.exxitedossier{margin-bottom:10px;}
div.exxitedossier div.item{background:var(--bodybgaccent); padding:10px 60px 10px 10px; position:relative; min-height:60px; margin:0 0 5px 0;}
div.exxitedossier div.item.active{background:var(--border);}
div.exxitedossier div.item.target{background:var(--border);}
div.exxitedossier div.item h4{font-weight:bold; font-size:0.9em;}
div.exxitedossier div.item.sel{background-color:rgba(67,160,254,0.2);}
div.exxitedossier div.item p{font-size:0.8em;}
div.exxitedossier div.item a.show{display:block; position:absolute; top:0; left:0; bottom:0; right:30px; min-height:60px}
div.exxitedossier div.item a.show:hover{background:rgba(67,160,254,0.2);}
div.exxitedossier div.item a.show:focus{background:rgba(67,160,254,0.2);}

div.exxitedossier div.item a.trash{display:block; position:absolute; top:0; bottom:0; right:0; width:30px; height:60px;  font-family:var(--icon); text-align:center; font-size:1.2em; line-height:3em; color:var(--border); }
div.exxitedossier div.item a.trash:hover{background:rgba(67,160,254,0.2); color:var(--hover); }
div.exxitedossier div.item a.trash:focus{background:rgba(67,160,254,0.2); color:var(--hover); }

div.exxitedossier div.item a.menu{display:block; position:absolute; top:0; bottom:0; right:0; width:30px; height:60px;  font-family:var(--icon); text-align:center; font-size:1.2em; line-height:3em; color:var(--link); }
div.exxitedossier div.item a.menu:hover{background:rgba(67,160,254,0.2); color:var(--hover); }
div.exxitedossier div.item a.menu:focus{background:rgba(67,160,254,0.2); color:var(--hover); }

div.exxitecatid{float:left; background:var(--bodybgaccent); font-size:0.70em; padding:10px; margin:0 0 0 10px; cursor:pointer;}

div.exxitegalleryform a{display:block; font-size:0.8em; background:var(--points_svg) no-repeat center right var(--bodybgaccent); padding:10px; border:1px solid var(--border); border-radius:2px;box-sizing: border-box;}

div.exxiteform_contentlistbase{background:var(--bodybgaccent); border:1px solid var(--border); box-sizing: border-box;}

/* select many styles begin*/
div.exxiteselectmany{font-size:0.75em; margin:10px 0 10px 0;}
div.exxiteselectmany a{padding:6px; border-radius:2px; float:left; margin:0 4px 4px 0;}
div.exxiteselectmany a:link{color:var(--link); background:var(--bodybgaccent);}
div.exxiteselectmany a:visited{color:var(--link); background:var(--bodybgaccent);}
div.exxiteselectmany a:hover{color: var(--bodybgaccent);  background:var(--hover);}
div.exxiteselectmany a:focus{color: var(--bodybgaccent);  background:var(--hover);}
div.exxiteselectmany a:active{color:var(--bodywhite); background:var(--link);}
div.exxiteselectmany a.sel {color:var(--bodywhite); background:var(--link);}
div.exxiteselectmanycounter {color:var(--a9); padding:10px 0 0 0; border-top:1px solid var(--border); font-weight:bold;}
div.item_search{position:relative;}
input.item_search {width:90%;background:var(--bodywhite); padding:5px 10px 5px 10px; margin:0 0 10px 0; border-radius:2px; border:none; border-top:2px solid var(--border); background:var(--bodybgaccent); position:relative; color:var(--bodycolor);}
input.item_search.full {width:100%; box-sizing:border-box;font-size:1em; border-radius:2px; font-size:1em;}
input.item_search.full:focus{outline:none; background:var(--inputfocus);}
a.full-btn{display:none; position:absolute; right:0; top:0; bottom:10px; width:40px;}
a.full-btn:after{content:'á'; font-family: var(--icon); display:block; position:absolute; top:0; left:0; right:0; bottom:0; text-align:center; line-height: 1.9em;}
a.full-btn span{display:none;}
div.item_search.cnt a{display:block;}
/* select many styles end*/

/*editorial module styles end*/

/*direct editor list styles begin*/
div.exxitedirectlist{border-top:1px solid var(--border);}
div.exxitedirectlist a{overflow:hidden; text-overflow: ellipsis; display:block; text-decoration:none; border-bottom:1px solid var(--border); border-left:1px solid var(--border);  border-right:1px solid var(--border); padding:4px 10px 4px 10px; font-size:0.8em; font-weight:bold; background:var(--bodybgaccent); border-radius:2px 0 0 2px;}
div.exxitedirectlist a.sel,div.exxitedirectlist a:hover{background:var(--bodybg); border-right:1px solid var(--bodybg); color:var(--hover);}
div.exxitedirectlist a.sel,div.exxitedirectlist a:focus{background:var(--bodybg); border-right:1px solid var(--bodybg); color:var(--hover);}
/*direct editor list styles end*/

/*speech tool styles begin*/
div.speechframe{width:50px; height:50px; position:relative;}
div.speechbutton {position:absolute; top:5px; left:5px; width:40px; height:40px; background:var(--bodycolorlight); background-size:60%; border-radius:50%; cursor:pointer; color:var(--bodywhite);}
div.speechbutton:after{content:'}'; font-family:var(--icon); display:block; position:absolute; top:3px; left:0; right:0; font-size:30px; text-align:center;}
div.speechbutton:hover{background-color:var(--hover);}
div.speechbutton.on{border:4px solid #fcc;}
div.speechstatus{position: absolute; top: 50%; left: 50px; background: var(--darkbg); color: var(--bodywhite); font-size: 0.7em; padding: 9px 20px 0 20px; margin: -16px 0 0 0; height:30px; display:none;}
/*speech tool styles end*/



/*javascript rich text editor styles begin*/
div#exxitertftoolbar {background:var(--bodybgaccent); position:absolute; top:0; left:0; right:0; z-index:50; box-shadow:0 0 15px #000;}
a.exxitertfbutton {display:table-cell; width:40px; height:40px; text-align:center; vertical-align:middle; text-decoration:none; border-right:1px solid  var(--bodybgaccent); font-family:var(--icon); font-weight:normal; font-size:1.2em;}
a.exxitertfbutton:link{background:var(--border); color:var(--bodycolorlight);}
a.exxitertfbutton:visited{background:var(--border); color:var(--bodycolorlight);}
a.exxitertfbutton:hover{background:var(--bodybgaccent); color:var(--hover);}
a.exxitertfbutton:focus{background:var(--bodybgaccent); color:var(--hover);}
a.exxitertfbutton:active{background:#000; color: var(--bodybgaccent);}
a.exxitertfbutton.italic {font-style:italic;}
a.exxitertfbutton.wysihtml5-command-active {background:var(--bodybgaccent); color:var(--hover);}
textarea.exxitertftxa{width:100%; height:100%;
font-size:0.8em; font-family: var(--face);  background:var(--bodybg); width:100%; border:0; border-bottom:1px solid var(--border);box-sizing: border-box;}
div.exxitertfholder{position:absolute; top:40px; left:10px; right:10px; bottom:50px;}

/*javascript rich text editor styles end*/



/*exxite territory control styles begin*/
div.exxiteterrytoryitem{float:left; width:50px; height:50px; position:relative;}
div.exxiteterrytoryitem a {display:block; position:absolute; top:0; left:0; right:0; bottom:0; border:1px solid var(--border);}
div.exxiteterrytoryframe{border:1px solid var(--border);}
/*exxite territory control styles end*/

/*loader anim styles begin*/
div.loaderframefix{position:relative;}
div.loaderframe{position: fixed; top: 50%; left: 50%; z-index: 101; height: 200px; width: 300px; margin-left: -150px; margin-top: -120px;}
/*div.loader{width:200px; height:10px; top:50%; left:50%; margin:-5px -100px; position:absolute; background:var(--a5);}
div.loader:after{content: "";position: absolute;left:0px; top:0px;bottom:0px;right:160px;background:var(--hover);animation: slide 1.5s ease infinite;}
@keyframes slide {0% {right: 160px;left: 0;} 5% {left: 0;} 50% {right: 2px;left: 160px;} 55% {right: 0;} 100% {right: 160px;left: 0;}}*/

/*div.loader div.txt{color: var(--bodywhite); font-size: 0.7em; margin: 10px 0 0 0; text-align: center; background: rgba(0,0,0,0.2); padding: 10px;}*/


/*background:rgba(67,160,254,0.2);*/
div.exxiteloader{position:fixed; top:0; right:0; left:0; bottom:0;  z-index:100000; display:grid;background:var(--semihover); backdrop-filter: grayscale(1);  animation:loaderbg 2s;}
div.exxiteloader div.loader{display:grid; min-width:15vw; background:var(--bodybg); align-self:center; justify-self:center; position:relative; color:var(--a9);
animation-name: loader;
animation-duration:5s;
}
div.exxiteloader div.loader::before {content:''; display:block; position:absolute; height:10px; width:100%; bottom:100%; left:50%; transform:translate(-50%,0); background:var(--bodycolorlight);
animation-name: loaderbefore;
animation-duration:5s;
}
div.exxiteloader div.loader::after{content:''; display:block; position:absolute; height:10px; bottom:100%; left:0; right:100%; background:var(--accent);
animation-name: exxiteloader;
animation-delay:4.5s;
animation-duration: 1s;
animation-direction:alternate;
animation-iteration-count: infinite;
animation-timing-function: linear;
}
div.exxiteloader div.txt{font-size:0.8em; padding:15px; color:inherit; align-self:center; justify-self:center; text-align:center;}

@keyframes loaderbg{
	0% {background:transparent; backdrop-filter:none;}
	80% {background:transparent;backdrop-filter:none;}
	100% {background:var(--semihover); backdrop-filter: grayscale(1);}
}

@keyframes loader{
	0%    {background:rgba(255,255,255,0.0001);  color:rgba(153,153,153,0.0001);}
	80%   {background:rgba(255,255,255,0.0001);  color:rgba(153,153,153,0.0001);}
	90%  {background:rgba(255,255,255,1.0);      color:rgba(153,153,153,0.0001);}
	100%  {background:rgba(255,255,255,1.0);     color:rgba(153,153,153,1.0);}
}

@keyframes loaderbefore{
	0%    {transform:rotate(0);width:10px}
	40%   {transform:rotate(720deg);width:10px}
	70%   {transform:rotate(0deg);width:10px}
	80%   {width:100%}
	100%  {width:100%}
}

@keyframes exxiteloader{
	0%    {left:0;   right:80%;}
	30%   {left:0;   right:50%;}
	70%   {left:50%; right:0;}
	100%  {left:80%; right:0;}
}
/*loader anim styles end*/

/*explorer grouped control styles begin*/
div.grouped{position:relative; float:left; display:none;}
div.grouped div.label{float:left; font-weight:bold; font-size:0.9em; color:var(--a9);}
div.grouped div.icon{float:left; width:24px; height:24px; background:url(file.svg) no-repeat; background-size:contain;}
div.grouped div.menu{float:left; width:32px; height:24px; cursor:pointer; color:var(--link); font-size:1.2em; text-align:center;}
div.grouped div.menu:hover {color:var(--hover);}
/*explorer grouped control styles end*/

/*module design styles begin*/
div.exxitecolor{}
div.exxitecolor div.colorframe{float:left; margin:0 5px 5px 0; cursor:pointer}
div.exxitecolor div.color{border:1px solid var(--border); text-align:center; width:120px; height:40px; padding-top:20px;}
div.exxitecolor div.color p {display:block; color:var(--bodycolor); padding:4px; background:rgba(255,255,255,0.8); margin:auto; width:80px; font-size:0.7em; border-radius:2px; }
/*module design styles end*/

/*loremipsum and color popup styles begin*/
div.loremipsumpopup{width:250px; height:450px; overflow:auto; padding:20px;}
div.colorpopup{width:250px; max-height:450px; overflow:auto; padding:10px;}
div.colorpopup div.item{float:left; width:50px; height:30px; margin:5px 5px 20px; position:relative; box-sizing: border-box;}
div.colorpopup div.item p {display:block; position:absolute; margin-top:30px; text-align:center; width:50px; font-size:0.8em; font-weight:bold; text-align:center; box-sizing: border-box;}
/*loremipsum and color popup styles end*/


/*accordicon styles begin*/
div.exxiteaccordicon{margin-bottom:10px;}

div.exxiteaccordicon div.acc_label{color:var(--link); position:relative;  cursor:pointer; border-bottom:1px solid var(--border); font-size:0.75em; display:block; padding:7px 15px 7px 45px; background:var(--bodybgaccent);}
div.exxiteaccordicon div.acc_label:before{content:'S'; font-family:var(--icon); position:absolute; top:6px; left:10px; font-size:1.3em;}
div.exxiteaccordicon div.acc_label:hover{background:var(--a9); color:var(--bodywhite);}
div.exxiteaccordicon div.acc_label.open{background:var(--bodybgaccent); color:var(--link);}
div.exxiteaccordicon div.acc_label.open:before{content:'R';}
div.exxiteaccordicon div.acc_item{display:none; padding:10px 0;}
div.exxiteaccordicon div.acc_item.open{display:block;}

div.exxiteaccordicon div.acc_openall{font-size:1.2em; position:absolute; width:20px; height:20px; top:4px; right:24px; color:var(--link); font-family:var(--icon); cursor:pointer;}
div.exxiteaccordicon div.acc_closeall{font-size:1.2em; position:absolute; width:20px; height:20px; top:4px; right:4px; color:var(--link); font-family:var(--icon); cursor:pointer;}
div.exxiteaccordicon div.acc_openall:hover{color:var(--hover);}
div.exxiteaccordicon div.acc_closeall:hover{color:var(--hover);}

/*accordicon styles end*/

/*package tool syles begin*/
div.packageitem{background:var(--bodybgaccent); padding:10px 10px 10px 50px;; margin:0 0 1px 0; position:relative;}
div.packageitem:hover{background:var(--border); cursor:pointer;}

div.packageitem.sel {background:var(--a13);}
div.packageitem.sel:hover{background:var(--bodybgaccent);}
div.packageitem.sel:after{content:'Z'; font-family:var(--icon); position:absolute; top:10px; left:10px; font-size:2em; color:var(--hover);}
/*package tool syles end*/

/*Progressbar styles begin*/
div.exxiteprogressbar{display:grid; grid-template-columns:1fr 9fr; grid-gap:10px; margin:10px 0;}
div.exxiteprogressbar div.progressbase{position:relative; height:5px; background:rgba(0,0,0,0.3); align-self:center;}
div.exxiteprogressbar div.progress{position:absolute; top:0; bottom:0; left:0; background:var(--hover);}
div.exxiteprogressbar div.progresslabel{font-weight:bold; color:var(--bodycolorlight); white-space:nowrap;}
div.exxiteprogressbarlabel{font-size:0.7em; color:var(--bodycolorlight); margin:0 0 5px 0;}
div.exxiteprogressbar.small{height:5px;}
/*Progressbar styles end*/

/*itemlist style begin --programbrain.php*/
div.exxiteitembox{background:var(--bodybgaccent); margin-bottom:5px; position:relative; min-height:70px;}
div.exxiteitembox:hover{border-color:#bbb;}
div.exxiteitembox:hover div.txt h4{color:var(--bodycolorlight);}
div.exxiteitembox:hover div.txt p{color:var(--bodycolor);}

div.exxiteitembox div.itemhandle{position:absolute; top:0; bottom:0; left:0; width:30px; background:var(--border); font-family:var(--icon); text-align:center; padding-top:10px; cursor:default; color: var(--bodybgaccent); cursor:move;}
div.exxiteitembox div.itemhandle:hover{color:var(--bodywhite);}

div.exxiteitembox div.img{position:absolute; top:0; left:30px; width:100px; height:70px; background-color:var(--a13);}
div.exxiteitembox div.img.icon{font-family:var(--icon); text-align:center; font-size:4em; color: var(--bodybgaccent);}
div.exxiteitembox div.img.bg{background-size:cover; background-position:center center;}

div.exxiteitembox div.txt{margin:0 240px 0 145px; padding:1px;}
div.exxiteitembox div.txt h4{font-weight:bold; font-size:0.9em; margin:5px 0 5px 0; color:var(--a9);}
div.exxiteitembox div.txt p{font-size:0.7em; color:var(--bodycolorlight);}

div.exxiteitembox div.tools{position:absolute; top:2px; right:2px;}
div.exxiteitembox div.tools a{display:block; text-decoration:none; font-size:0.7em; text-align:center; width:80px; height:70px; float:right;}
div.exxiteitembox div.tools a span{display:block; font-family:var(--icon); font-size:3em; padding:10px 0 5px 0;}
div.exxiteitembox div.tools a:link{}
div.exxiteitembox div.tools a:visited{}
div.exxiteitembox div.tools a:hover{color:var(--hover);}
div.exxiteitembox div.tools a:active{background:var(--bodycolorlight); color:var(--bodywhite);}
/*itemlist style end*/

/*lib icon view styles begin*/
div.exxiteicontentframe{margin:0 -5px 0 -5px;}
div.exxiteicontent{width:290px; height:200px; float:left; position:relative;}
div.exxiteicontent div.selbar{position:absolute; top:5px; left:5px; right:5px; height:15px; background:rgba(0,0,0,0.2); padding:3px; }
div.exxiteicontent div.selbar:hover{background:var(--hover);}
div.exxiteicontent.sel div.selbar{background:var(--hover);}
div.exxiteicontentinner{position:absolute; top:5px; bottom:5px; left:5px; right:5px; background:var(--bodybgaccent); overflow:hidden;}
div.exxiteicontentinner div.txt{background:rgba(0,0,0,0.5); position:absolute; top:145px; left:0; right:0; height:200px; color: var(--bodybgaccent); padding:5px;}
div.exxiteicontentinner div.txt a.command{text-decoration:none; display:block; padding:5px;}
div.exxiteicontentinner div.txt a.command:link{color: var(--bodybgaccent);}
div.exxiteicontentinner div.txt a.command:visited{color: var(--bodybgaccent);}
div.exxiteicontentinner div.txt a.command:hover{color:var(--bodywhite); background:rgba(0,204,255,0.2);}
div.exxiteicontentinner div.txt a.command:focus{color:var(--bodywhite); background:rgba(0,204,255,0.2);}
div.exxiteicontentinner div.txt h3 {font-size:0.9em; font-weight:bold; margin-bottom:5px; white-space:nowrap; text-overflow:ellipsis; display:block; overflow:hidden;}
div.exxiteicontentinner div.txt p {font-size:0.7em; margin-bottom:5px;}
div.exxiteicontentinner:hover div.txt{top:20px; background:rgba(0,0,0,0.8); color:var(--bodywhite);}
div.exxiteicontentinner div.imageicon{position:absolute; top:0; right:0; left:0; bottom:0; background-position:center center; width:auto; height:auto; background-size:cover;}
div.exxiteicontentinner div.iconimginner{position:absolute; top:0; right:0; left:0; bottom:0; background-position:center center; width:auto; height:auto; background-size:30%; background-repeat:no-repeat;}
div.exxiteicontentinner div.txticon{position:absolute; top:0; right:0; left:0; bottom:0; width:auto; height:auto; font-size:0.8em; padding:25px;}
div.exxiteicontentinner div.defaulticon{position:absolute; top:0; right:0; left:0; bottom:0; background-position:center center; width:auto; height:auto; font-size:4em;}
/*lib icon view styles end*/

/*sitelist styles begin*/
div.siteitem{position:relative;}
div.sitelisticon{position:absolute; top:0; right:10px; width:32px; height:32px; background-size:60%; background-position:center center; background-repeat:no-repeat;}
/*sitelist styles end*/


/*browser styles begin*/
div.exxitebrowser{background: var(--bodywhite); height:calc(100vh - 350px); display:grid; grid-template-rows:25px auto;}
div.exxitebrowser div.form{display:grid; grid-template-columns:auto 25px 25px; height:25px; border-bottom:1px solid var(--border);}
div.exxitebrowser div.form a{display:block; position:relative; color:var(--a9);}
div.exxitebrowser div.form a:hover{color:var(--hover);}
div.exxitebrowser div.form a:after{content:'a'; font-family:var(--icon); display:block; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);}
div.exxitebrowser div.form a span{display:none;}
div.exxitebrowser div.form a.reload:after{content:'1';}
div.exxitebrowser div.form a.page:after{content:'|';}
div.exxitebrowser div.form input{border:none; background:transparent; padding:0 4px;}
div.exxitebrowser div.iframe iframe{width:100%; height:100%; border:none;}
/*browser styles end*/

/*tool styles begin*/
div.exxitetoolmenu{position:absolute; top:5px; right:0; width:40px; height:40px; text-align:center; font-family:var(--icon); font-size:1.5em; cursor:pointer;}
div.exxitetoolmenu:hover{color:var(--hover);}
/*tool styles end*/

/*resizable twin panel styles begin*/
div.exxitetwin{position:relative;}
div.exxitetwin div.left{float:left;}
div.exxitetwin div.right{float:right;}
div.exxitetwin div.control{position:absolute; top:0; bottom:0; width:20px; cursor:col-resize;}
div.exxitetwin div.control:before{content:''; display:block; position:absolute; top:0; bottom:0; width:10px; border-right:1px solid var(--border);}
div.exxitetwin div.control:hover:before{border-right:1px solid var(--hover);}
/*resizable twin panel styles end*/

/*toolchest styles begin*/
div.exxitetoolholder{position:relative; padding-top:45px;}
span.toolholderlabel{display:block; position:absolute; top:40%; transform:translateY(-50%); right:40px; font-size:0.8em; padding:4px; }
div.exxitetool {margin-bottom:20px; min-height:100px;}
div.exxitetool div.head{color:var(--bodycolorlight); font-size:0.8em; padding:5px; position:relative; background:var(--bodybgaccent);}
div.exxitetool div.head a{display:block; position:absolute; top:0; right:0; font-family:var(--icon); font-size: 1.2em; line-height:1.5em; text-align:center; color:rgba(0,0,0,0.5); text-decoration:none; width:26px; height:26px; }
div.exxitetool div.head a:hover{color:var(--hover);}
div.exxitetool div.head a:focus{color:var(--hover);}

div.exxitecolortool{margin:5px 0 5px 0; display:grid; grid-template-columns: repeat(auto-fit, minmax(100px, 1fr)); grid-gap:5px;}
div.exxitecolortool div.item{cursor:pointer; color:var(--bodycolor);}
div.exxitecolortool div.item h6{display:block; height:20px; position:relative;}
div.exxitecolortool div.item h6 span{display:block; position:absolute;  top:0; left:20px; right:0; bottom:0; padding:4px 10px; background:var(--bodybg); font-size:0.7em; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
div.exxitecolortool div.item:hover {color:var(--link)}
div.exxitecolortool div.item:hover h6 span{background:var(--bodybgaccent);}
div.exxitecolortool div.bscolitem{margin:0;}

div.exxitefonttool{margin:0 0 5px 0;}
div.exxitefonttool div.item{font-size:1em; color:var(--bodycolor); padding:10px; margin:0 0 5px 0; background:var(--bodybgaccent); cursor:pointer;}

div.exxitefunctool{background:var(--border);margin-top:5px;}
div.exxitefunctool input{margin:0;}
div.exxitefunctool a{display:block; text-decoration:none; font-size:0.8em;overflow:hidden; white-space:nowrap; text-overflow:ellipsis; padding:4px 5px 4px 5px;margin:0 0 1px 0; color:var(--a9); background:var(--bodywhite);}
div.exxitefunctool a strong{font-weight:bold; color:var(--bodycolorlight);}
div.exxitefunctool a.function{border-left:20px solid var(--inputfocus);}
div.exxitefunctool a.function:hover{background:var(--inputfocus);}
div.exxitefunctool a.function:focus{background:var(--inputfocus);}
div.exxitefunctool a.cfunction{border-left:20px solid var(--error);}
div.exxitefunctool a.cfunction:hover{background:var(--error);}
div.exxitefunctool a.cfunction:focus{background:var(--error);}
div.exxitefunctool a.hidden{display:none;}

/*toolchest styles end*/

/*design tools2 styles begin*/
div.exxitefonttool{margin:0 0 5px 0;}
div.exxitefonttool div.item{font-size:1em; color:var(--bodycolor); padding:10px; margin:0 0 5px 0; background:var(--bodybgaccent); cursor:pointer;}
div.exxitedesigntool{margin:0 0 5px 0; display:grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); grid-gap:5px;}
div.exxitedesigntool div.item{font-size:0.7em; color:var(--bodycolor); padding:5px 5px 5px 25px; background-color:var(--bodybgaccent); cursor:pointer; background-size:16px; background-repeat: no-repeat; background-position: 5px center; }
div.exxitedesigntool div.item.style:before{content:'.';}
/*design tools2 styles end*/


/*tinymce styles begin*/
div.exxitetinymceholder {position: absolute;top: -1px;left: 50%;right: auto;bottom: 70px;max-width: 900px;transform: translate(-50%,0);width: 100%;}
div.exxitetinymcespeech {position: absolute; z-index:100; left:0px; bottom:20px;}
/*tinymce styles end*/

/*youtubeholder styles begin*/
div.exxiteyoutube{background:#000; padding:50px; color: var(--bodybgaccent);  text-align:center;}
div.exxiteyoutube h2{font-weight:bold; margin:10px 0 0 0;}
div.exxiteyoutube p{font-size:0.8em; margin:10px 0 0 0;}
/*youtubeholder styles end*/

/*time machine styles begin -- apperance.php XXX*/
div.exxitetimemachine{margin:10px 0 0 0;}
div.exxitetimemachine div.head{background:var(--bodybgaccent); color:var(--bodycolor); font-size:1em; padding:5px; border-bottom:1px solid var(--border);}
div.exxitetimemachine div.head h4{float:left;  font-weight:bold; margin:8px 20px 0 10px;}
div.exxitetimemachine div.body{padding:10px; background: var(--bodybgaccent); font-family:var(--codeface);}
div.exxitetimemachine div.body pre{white-space:pre-wrap;}
div.exxiterest .a1{width:1%; text-align:right;}
div.exxiterest tr.mod{background:var(--focus);}
/*time machine styles end*/

/*exxite percent circle diagram styles begin*/
/*div.exxitecdiag{width: 64px; height: 64px;}
div.exxitecdiag span.prec{position:absolute; top:50%; left:50%; width:50px; height:34px; margin:-11px 0 0 -25px;  text-align:center; font-size: 20px; color:var(--bodycolorlight);}
div.exxitecdiag div.circle{position: relative;top: 2px;left: 2px;text-align: center;width: 60px;height: 60px;border-radius: 100%;background-color: var(--bodybg);}
div.exxitecdiag div.active-border{position: relative; text-align: center; width: 64px; height: 64px; border-radius: 100%; background-color:var(--hover);}*/
/*exxite percent circle diagram styles end*/

/*usericon styles begin*/
div.exxitetaskusericon{width:50px; height:50px; border-radius:50%; color:var(--bodywhite); background-color:transparent; text-align: center; font-size: 1.8em; padding-top: 0.3em; cursor:default; background-repeat:no-repeat; background-position:center center; background-size:cover;}
div.exxitetaskusericon.post{position:absolute; top:10px; left:10px;}
div.exxitetaskusericon.big{width:150px; height:150px; font-size: 5.5em;}
div.exxitetaskusericon.small{width:16px; height:16px; font-size: 0.7em;}
div.exxitetaskusericon.center{margin:auto;}
div.exxitetaskusericon.margin{margin-top:20px; margin-bottom:20px;}
div.exxitetaskusericon.left{float:left; margin-right:5px;}
div.exxitetaskusericon.a{background-color:hsl(calc( ( 360 / 30 ) * 0 ),100%,40%);}
div.exxitetaskusericon.b{background-color:hsl(calc( ( 360 / 30 ) * 1 ),100%,40%);}
div.exxitetaskusericon.c{background-color:hsl(calc( ( 360 / 30 ) * 2 ),100%,40%);}
div.exxitetaskusericon.d{background-color:hsl(calc( ( 360 / 30 ) * 3 ),100%,40%);}
div.exxitetaskusericon.e{background-color:hsl(calc( ( 360 / 30 ) * 5 ),100%,40%);}
div.exxitetaskusericon.f{background-color:hsl(calc( ( 360 / 30 ) * 6 ),100%,40%);}
div.exxitetaskusericon.g{background-color:hsl(calc( ( 360 / 30 ) * 7 ),100%,40%);}
div.exxitetaskusericon.h{background-color:hsl(calc( ( 360 / 30 ) * 8 ),100%,40%);}
div.exxitetaskusericon.i{background-color:hsl(calc( ( 360 / 30 ) * 9 ),100%,40%);}
div.exxitetaskusericon.j{background-color:hsl(calc( ( 360 / 30 ) * 10 ),100%,40%);}
div.exxitetaskusericon.k{background-color:hsl(calc( ( 360 / 30 ) * 11 ),100%,40%);}
div.exxitetaskusericon.l{background-color:hsl(calc( ( 360 / 30 ) * 12 ),100%,40%);}
div.exxitetaskusericon.m{background-color:hsl(calc( ( 360 / 30 ) * 13 ),100%,40%);}
div.exxitetaskusericon.n{background-color:hsl(calc( ( 360 / 30 ) * 14 ),100%,40%);}
div.exxitetaskusericon.o{background-color:hsl(calc( ( 360 / 30 ) * 15 ),100%,40%);}
div.exxitetaskusericon.p{background-color:hsl(calc( ( 360 / 30 ) * 16 ),100%,40%);}
div.exxitetaskusericon.q{background-color:hsl(calc( ( 360 / 30 ) * 17 ),100%,40%);}
div.exxitetaskusericon.r{background-color:hsl(calc( ( 360 / 30 ) * 18 ),100%,40%);}
div.exxitetaskusericon.s{background-color:hsl(calc( ( 360 / 30 ) * 19 ),100%,40%);}
div.exxitetaskusericon.t{background-color:hsl(calc( ( 360 / 30 ) * 20 ),100%,40%);}
div.exxitetaskusericon.u{background-color:hsl(calc( ( 360 / 30 ) * 21 ),100%,40%);}
div.exxitetaskusericon.v{background-color:hsl(calc( ( 360 / 30 ) * 22 ),100%,40%);}
div.exxitetaskusericon.w{background-color:hsl(calc( ( 360 / 30 ) * 23 ),100%,40%);}
div.exxitetaskusericon.z{background-color:hsl(calc( ( 360 / 30 ) * 24 ),100%,40%);}
div.exxitetaskusericon.x{background-color:hsl(calc( ( 360 / 30 ) * 25 ),100%,40%);}
div.exxitetaskusericon.y{background-color:hsl(calc( ( 360 / 30 ) * 26 ),100%,40%);}
div.exxitetaskusericon.z{background-color:hsl(calc( ( 360 / 30 ) * 27 ),100%,40%);}
/*usericon styles end*/

/* stripe styles begin*/
div.exxitestripe{background:var(--bodybgaccent); margin-bottom:5px; height:60px; position:relative;}
div.exxitestripe.actual{background:var(--focus);}
div.exxitestripe.btn{height:100px;}
div.exxitestripe.no-mouse div.ntxt{pointer-events:none;}
div.exxitestripe div.nhandle{float:left; height:60px; width:30px; background:rgba(0,0,0,0.2); cursor:move; position:relative;}
div.exxitestripe div.nhandle:before{content:'w'; font-family:var(--icon); position:absolute; top:2px; left:2px; font-size:16px; color:var(--a13);}
div.exxitestripe div.nhandle:hover:before{color: var(--bodybgaccent);}
div.exxitestripe div.nhandle:focus:before{color: var(--bodybgaccent);}
div.exxitestripe div.nimg{float:left; width:100px; height:60px;}
div.exxitestripe div.nimg.bg{background-size:cover; background-position:center center; background-repeat:no-repeat;}
div.exxitestripe div.nimg.svg{background-size:30%;}
div.exxitestripe div.nimg.icon{background:var(--a13); color: var(--bodybgaccent); font-family:var(--icon); font-size:3.4em; cursor:default; text-align:center;}
div.exxitestripe div.ntxt{height:50px; overflow:hidden; padding:10px; overflow:hidden; left:0; right:0; position:relative;}
div.exxitestripe div.ntxt h5{font-weight:bold; font-size:1em; color:var(--bodycolorlight); margin:0 0 5px 0;}
div.exxitestripe div.ntxt p{font-size:0.8em; color:var(--bodycolorlight);}
div.exxitestripe div.ntxt strong{font-weight:bold;}
div.exxitestripe div.ntxt a.mlink{display:block; position:absolute; top:0; right:0; left:0; bottom:0; transition:background-color 0.5s;}
div.exxitestripe div.ntxt a.mlink:hover{background:var(--semihover);}


div.exxitestripe div.cft{font-size:0.8em; height:60px; overflow:hidden; overflow:hidden; left:0; right:0;}
div.exxitestripe div.cft table{width:100%; height:60px; margin:0;}
div.exxitestripe div.cft td{border-right:1px solid var(--border); padding:10px;}
div.exxitestripe div.cft .a1{font-weight:bold; width:10%;}
div.exxitestripe div.cft .a2{width:10%;}
div.exxitestripe div.cft .a3{width:10%;}
div.exxitestripe div.cft .a4{width:10%;}
div.exxitestripe div.cft .a5{width:30%;}
div.exxitestripe div.cft .a6{width:30%; border-right:none;}


div.exxitestripe a.nbtn{float:right; display:block; height:60px; width:10%; max-width:80px; min-width:60px; border-left:1px solid var(--border); font-size:0.7em; text-align:center; box-sizing:border-box; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; padding:0 4px 0 4px;}
div.exxitestripe a.nbtn:link{color:var(--link);}
div.exxitestripe a.nbtn:visited{color:var(--link);}
div.exxitestripe a.nbtn:hover{color:var(--hover);}
div.exxitestripe a.nbtn:focus{color:var(--hover);}
div.exxitestripe a.nbtn span{display:block; font-family:var(--icon); font-size:2.3em; margin:10px 0 0 0;}
div.exxitestripe div.nlabel{position:absolute; right:0; top:0; color: var(--bodybgaccent); background:var(--darkbg); padding:4px 8px; font-size:0.7em;}
div.exxitestripe div.nlabel a.labellink{display:block; position:absolute; top:0; bottom:0; right:0; left:0;}
div.exxitestripe div.nbadge{position:absolute; right:-5px; top:-5px; color: var(--bodybgaccent); background:var(--darkbg); width:25px; height:25px; text-align:center; border-radius:50%; font-family:var(--icon); padding-top:4px;}
div.exxitestripe div.nbtns{position:absolute; bottom:0; left:0; right:0; padding:10px 10px 5px 10px; border-top:1px solid var(--border);}
div.exxitestripe a.nmenu{float:right; display:block; height:60px; width:30px; border-left:1px solid var(--border); text-align:center; box-sizing:border-box; overflow:hidden; background:rgba(255,255,255,0.5); font-family:var(--icon);padding-top:20px; font-size:1.2em;}

div.exxitestripe.small{background:var(--bodybgaccent); margin-bottom:4px; height:20px; position:relative;}
div.exxitestripe.small:hover{background:var(--focus);}
div.exxitestripe.small.actual{background:var(--focus);}
div.exxitestripe.small div.nhandle{float:left; height:20px; width:30px; background:rgba(0,0,0,0.2); cursor:move; position:relative;}
div.exxitestripe.small div.nimg{display:none;}
div.exxitestripe.small a.nbtn{height:20px; width:10%; max-width:80px; min-width:60px; border-left:1px solid var(--border); font-size:0.7em; text-align:center; box-sizing:border-box; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; padding:4px 4px 0 4px;}
div.exxitestripe.small a.nbtn span{display:none;}
div.exxitestripe.small a.nmenu{float:right; display:block; height:20px; width:30px; border-left:1px solid var(--border); text-align:center; box-sizing:border-box; overflow:hidden; background:rgba(255,255,255,0.5); font-family:var(--icon); padding-top:4px; font-size:0.75em;}
div.exxitestripe.small div.ntxt{height:20px; overflow:hidden; padding:4px; overflow:hidden; left:0; right:0;}
div.exxitestripe.small div.ntxt h5{font-weight:bold; font-size:0.75em; color:var(--bodycolorlight); margin:0 0 5px 0;}
div.exxitestripe.small div.ntxt p{display:none}

div.exxitestripe.small.mid{margin-bottom:0px; border-bottom:1px solid var(--border); height:40px;}
div.exxitestripe.small.mid div.nhandle{height:40px;}
div.exxitestripe.small.mid a.nbtn{height:40px; padding:10px;}
div.exxitestripe.small.mid a.nbtn.span{display:block;}
div.exxitestripe.small div.ntxt{}

/* stripe styles end*/

/*helpgizmo styles begin*/
div.helpgizmoframe{position:relative;}
div.exxitehelpgizmonav{background:var(--bodybgaccent); overflow:auto; position:absolute; top:0; right:0; left:0;}
div.exxitehelpgizmonav a{text-decoration:none; display:none; font-size:0.8em; padding:7px 15px 7px 40px; position:relative; border-bottom:1px solid var(--border); display:none;}
div.exxitehelpgizmonav a.me{display:block;}
div.exxitehelpgizmonav a.me:before{content:'^'; display:block; position:absolute; top:6px; left:10px; bottom:0; font-family:var(--icon); font-size:1.2em;}
div.exxitehelpgizmonav a.me:link{color: var(--bodybgaccent); background-color:var(--bodycolorlight);}
div.exxitehelpgizmonav a.me:visited{color: var(--bodybgaccent); background-color:var(--bodycolorlight);}
div.exxitehelpgizmonav a.me:hover{color:var(--bodywhite); background-color:var(--hover);}
div.exxitehelpgizmonav a.me:active{color:var(--bodywhite); background-color:var(--darkbg);}
div.exxitehelpgizmonav a.ancestor:before{content:'R'; display:block; position:absolute; top:6px; left:10px; bottom:0; font-family:var(--icon); font-size:1.2em;}
div.exxitehelpgizmonav a.ancestor:link{color:var(--link); background-color:var(--border);}
div.exxitehelpgizmonav a.ancestor:visited{color:var(--link); background-color:var(--border);}
div.exxitehelpgizmonav a.ancestor:hover{color:var(--hover); background-color:var(--border);}
div.exxitehelpgizmonav a.ancestor:active{color:var(--hover); background-color:var(--border);}
div.exxitehelpgizmonav a.children{padding-left:60px;}
div.exxitehelpgizmonav.open a{display:block;}
div.exxitehelpgizmonav.open a.me:before{content:'N';}
div.exxitehelpgizmobody{position:relative; overflow:auto; padding-top:30px;}
div.exxitehelpgizmobody a.opennew{width:24px; height:24px; border-radius:50%; display:block; position:absolute; top:50px; right:10px;}
div.exxitehelpgizmobody a.opennew:before{content:'5'; font-family:var(--icon); color:var(--bodywhite); position:absolute; top:0; left:0; right:0; bottom:0; text-align:center; line-height:1.5em;}
div.exxitehelpgizmobody span{display:none;}
div.exxitehelpgizmobody a.opennew:link{background-color:var(--a9);}
div.exxitehelpgizmobody a.opennew:visited{background-color:var(--a9);}
div.exxitehelpgizmobody a.opennew:hover{background-color:var(--hover);}
div.exxitehelpgizmobody a.opennew:active{background-color:var(--darkbg);}

div.rtf {text-align:left;padding:0 10px 10px 10px; max-width:75ch; margin:0 auto 0 auto;}
div.rtf code {color:#469;font-size:1em;font-family:var(--codeface);white-space:pre;}
div.rtf pre {color:#438743;font-size:0.9em;font-family:var(--codeface);display:block;width:100%;overflow:auto;}
div.rtf strong {color:var(--bodycolorlight);font-weight:bold;}
div.rtf h1 {font-size:1.4em;font-style:normal;font-weight:bold;color:#036;margin-bottom:25px;margin-top:25px;}
div.rtf h2 {font-size:1.2em;font-style:normal;font-weight:bold;color:#369;margin-bottom:10px;margin-top:25px;}
div.rtf h3 {font-size:1em;font-style:normal;font-weight:bold;color:#369;margin-bottom:10px;margin-top:25px;}
div.rtf h4 {font-size:0.9em;font-style:normal;font-weight:bold;color:#369;margin-bottom:10px;margin-top:25px;}
div.rtf h6 {font-size:0.8em;font-style:normal;font-weight:bold;color:var(--bodycolorlight);margin-bottom:10px;margin-top:25px;}
div.rtf p {font-size:0.8em;font-style:normal;font-weight:normal;margin-bottom:10px;margin-top:0;line-height:1.8em;}
div.rtf blockquote {margin-bottom:10px;margin-top:0;background:var(--bodybgaccent); padding:20px 20px 20px 100px; position:relative;}
div.rtf blockquote:before{content: open-quote; color:var(--a9); font-size:8em; display:block; position:absolute; top:-7px; left:50px; line-height:0;}
div.rtf hr {text-align:center;border:0px;height:3px;width:20%;color:var(--border);background-color:var(--border);}
div.rtf ul {font-style:normal;font-weight:normal;color:#000;text-indent:0px;list-style-position:outside;list-style-type:disc;padding:0px;margin-top:5px;margin-bottom:15px;margin-left:35px;margin-right:5px;padding:0;line-height:1.8em;}
div.rtf ul li{font-size:0.8em;}
div.rtf ol {font-style:normal;font-weight:normal;color:#000;text-indent:0px;list-style-position:outside;list-style-type:decimal;padding:0px;margin-top:5px;margin-bottom:15px;margin-left:35px;margin-right:5px;padding:0;line-height:1.8em;}
div.rtf ol li{font-size:0.8em;}
div.rtf table {border-collapse:collapse;border:2px solid var(--border);font:normal 0.8em sans-serif;color:#000;background:var(--bodywhite);padding-left:20px;padding-right:20px;width:100%;margin-bottom:20px;}
div.rtf td, div.rtf th {border:1px solid  var(--bodybgaccent);padding:5px;}
div.rtf caption {padding:0 0 5px 0;text-align:left;font-weight:bold;text-transform:uppercase;color:var(--bodycolor);background:transparent;}
div.rtf thead th, tfoot th {border:1px solid  var(--bodybgaccent);text-align:left;font-weight:bold;color:var(--bodycolor);background:var(--bodybgaccent);}
div.rtf tfoot td { border:2px solid var(--bodybgaccent); }div.rtf tbody th {vertical-align:top;text-align:left;}
div.rtf tbody td {vertical-align:top;text-align:left;}
div.rtf tbody th { white-space:nowrap; }div.rtf div.left {float:left;margin:0 10px 10px 0;}

div.rtf div.object img { width:100%; }
div.rtf div.object.w1 { width:100%; }
div.rtf div.object.w2 { width:50%; }
div.rtf div.object.w3 { width:33.3333%; }
div.rtf div.object.w4 { width:25%; }
div.rtf div.object.left {float:left;margin:5px 10px 5px 0;}
div.rtf div.object.right {float:right;margin:5px 0 5px 10px;}

div.rtf span.object { display:block; }div.rtf span.object img { width:100%; }div.rtf span.object.w1 { width:100%; }div.rtf span.object.w2 { width:50%; }div.rtf span.object.w3 { width:33.3333%; }
div.rtf span.object.w4 { width:25%; }div.rtf span.object.left {float:left;margin:5px 10px 5px 0;}
div.rtf span.object.right {float:right;margin:5px 0 5px 10px;}
div.rtf span.object span.label {display:block;background:var(--bodybgaccent);padding:5px;line-height:1.1em;}
div.rtf span.object span.label span.title {margin:0;display:block;font-weight:bold;font-size:0.7em;}
div.rtf span.object span.label span.desc {margin:0;display:block;font-size:0.7em;}

@media screen and (max-width: 1024px) {div.rtf div.object.w2 { width:50%; }div.rtf div.object.w3 { width:50%; }div.rtf div.object.w3 { width:25%; }}
@media screen and (max-width: 800px) {div.rtf div.object.w2 { width:50%; }div.rtf div.object.w3 { width:50%; }div.rtf div.object.w4 { width:50%; }}
@media screen and (max-width: 640px) {div.rtf div.object.w2 { width:100%; }div.rtf div.object.w3 { width:50%; }div.rtf div.object.w4 { width:50%; }div.rtf div.object.w2.left {float:none;margin:5px 0 5px 0;}
div.rtf div.object.w2.right {float:none;margin:5px 0 5px 0;}
}
@media screen and (max-width: 480px) {div.rtf div.object.w2 { width:100%; }div.rtf div.object.w3 { width:100%; }div.rtf div.object.w4 { width:100%; }div.rtf div.object.left {float:none;margin:5px 0 5px 0;}
div.rtf div.object.right {float:none;margin:5px 0 5px 0;}
}
/*helpgizmo styles end*/
/*timestampgizmo styles begin*/
div.exxitetimestampframe{padding:10px 0;}
div.exxitetimestampframe input{margin:0 0 10px 0;}
div.exxitetimestampframe a{display:block; text-decoration:none; font-size:0.7em; padding:4px 10px; float:right; border-radius:2px;}
div.exxitetimestampframe a:link{background:var(--bodybgaccent); color:var(--link);}
div.exxitetimestampframe a:visited{background:var(--bodybgaccent); color:var(--link);}
div.exxitetimestampframe a:hover{background:var(--link); color:var(--bodywhite);}
div.exxitetimestampframe a:active{background:var(--darkbg); color:var(--bodywhite);}
/*timestampgizmo styles end*/

/*autoload ajax frame styles begin*/
div.exxiteautoloadframe{border:1px solid var(--border); padding:20px; position:relative; margin:0 0 10px 0;}
div.exxiteautoloadframe div.load{position:absolute; display:block; background:var(--border); bottom:0; left:0; height:4px; right:0; animation:loadfr 5s linear infinite;}
@keyframes loadfr
{
  0% {right:100%;}
  100% {right:0;}
}
/*autoload ajax frame styles end*/

/*Editor frame styles begin*/
div.exxite-editorframe{position:fixed; top:0; left:0; right:0; bottom:0; display:grid;}
div.exxite-editorframe div.exxite-grid{margin:0;}
/*Editor frame styles end*/


/*grideditor styles begin*/
div.exxite-grid-editor div.toolbar{position:fixed; top:0; right:0; bottom:0; width:20%; padding:12px 12px 12px 24px;}
div.exxite-grid-editor div.toolbar div.exxiteformlabel{width:100%; float:none; text-align:left; padding-bottom:5px;}
div.exxite-grid-editor div.toolbar div.exxiteformcontrol{width:100%; float:none;}
div.exxite-grid-editor div.grid{display:grid; position:fixed; top:12px; left:12px; bottom:12px; right:20%; grid-template-columns:repeat(12,1fr); grid-template-rows:repeat(12,1fr); border-bottom:1px solid var(--hover);border-right:1px solid var(--hover);}
div.exxite-grid-editor div.grid div.guide{border-top:1px solid var(--hover);border-left:1px solid var(--hover);}
/*grideditor styles end*/

/*round target stlye begin*/
div.exxite-float{width:48px; height:48px; background:var(--bodybgaccent); border-radius:50%; cursor:default; position:relative; margin:0 auto 10px auto;}
div.exxite-float span{font-family:var(--icon); font-size:1.6em; color:var(--bodycolor); position:absolute; top:50%; left:50%; transform:translate(-50%, -50%);}

/*experimental file drop style begin*/
div.exxite-drophandler{background:rgba(51,102,153,0.1); min-height:250px; position:relative;}
div.exxite-drophandler:before{content: 'L'; display: block; position: absolute; font-family: var(--icon); font-size: 4em; color: var(--bodywhite); top: 50%; left: 50%; font-weight: normal; transform: translate(-50%,-50%);}
div.exxite-drophandler:after{content:attr(data-label); position:absolute; bottom:5px; left:5px; right:5px; font-size:0.7em; color:var(--infoaccent); text-align:center;}
div.exxite-drophandler.act{background:rgba(51,102,153,0.4);}
div.exxite-drophandler.say{box-shadow: inset 0px 0px 5px 0px rgba(0,0,0,0.32);}


div.dropc{background:rgba(51,102,153,0.1); margin:0 0 10px 0; }
div.dropc div.statusbar{border-top:1px solid var(--border); display:grid; grid-template-columns:5fr 1fr; position:relative;}
div.dropc div.statusbar.ok{background:var(--ok); padding-bottom:5px;}
div.dropc div.statusbar.info{background:var(--info); padding-bottom:5px;}
div.dropc div.statusbar.error{background:var(--error); padding-bottom:5px;}
div.dropc div.statusbar.ok:before{content:'Z'; color:var(--okaccent); display:block; position:absolute; font-family:var(--icon); top:3px; left:4px; bottom:0; width:20px;}
div.dropc div.statusbar.info:before{content:'z';color:var(--infoaccent); display:block; position:absolute; font-family:var(--icon);top:3px; left:4px; bottom:0; width:20px;}
div.dropc div.statusbar.error:before{content:'\00F3';color:var(--erroraccent); display:block; position:absolute; font-family:var(--icon); top:3px; left:4px; bottom:0; width:20px;}
div.dropc div.progressBar {position:relative; height:10px; background:rgba(0,0,0,0.3); margin:10px;}
div.dropc div.progressBar div{position:absolute; top:0; bottom:0; left:0; height:10px; background:var(--accent);}
div.dropc div.progressLabel {font-weight:bold; color:var(--bodycolorlight); padding:5px 10px 0 0; text-align:right;}
div.dropc div.filename{overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:0.7em; color:var(--bodycolorlight); padding:5px 10px 0 25px;}
div.dropc div.filesize{text-align:right; font-size:0.7em; color:var(--bodycolorlight); white-space:nowrap; padding:5px 10px 0 10px;}
div.dropc div.abort{display:none;}
div.dropc div.finalstatus{ font-size:0.7em; color:var(--bodycolorlight); padding:5px 10px 5px 25px;}
div.dropc div.finalstatus a{display:inline-block; padding:5px 10px; margin:5px 0; border-radius:2px;}
div.dropc div.finalstatus a:link{background:var(--a9); color:var(--bodywhite);}
div.dropc div.finalstatus a:visited{background:var(--a9); color:var(--bodywhite);}
div.dropc div.finalstatus a:hover{background:var(--hover); color:var(--bodywhite);}

/*experimental file drop style end*/



/*exxite block buttons style begin -- sys/interfacelib.php -- class ifc_block XXX*/
div.exxite-blocks{display:grid; grid-template-columns: repeat(auto-fit, minmax(100px, 1fr)); grid-gap:5px; padding:5px;}
div.exxite-blocks a{text-decoration:none; display:block; position:relative; aspect-ratio: 1 / 1; background:var(--border);}
div.exxite-blocks a:after{content: attr(data-icon); display:block; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); color:var(--bodywhite); font-family: var(--icon); font-size:2em;}
div.exxite-blocks a span{display:block; position:absolute; bottom:10px; left:5px; right:5px; font-size:0.75em; text-transform:uppercase; text-align:center; color:var(--bodywhite);}
div.exxite-blocks a:hover{background-color:var(--bodycolorlight);}
/*exxite block buttons style end*/




/*exxitefilter styles begin -- sys/interfacelib.php -- class ifc_filter*/
div.exxitefilter{display:inline-block; margin:0 10px 10px 0;}
div.exxitefilter a{text-decoration:none; display:inline-block; margin:0 2px 0 0; font-size: 0.8em;  padding:4px 8px 4px 20px; position:relative;}
div.exxitefilter a.off{border:1px solid rgba(0,0,0,0.0001); color:var(--link);}
div.exxitefilter a.on{border:1px solid var(--bodycolorlight); color:var(--bodycolor);}
div.exxitefilter a:hover{color:var(--hover);}
div.exxitefilter a:active{color:var(--hover);}
div.exxitefilter a:before{content:''; display:block; position:absolute; top:6px; bottom:6px; left:6px; width:10px; background-color:var(--link);}
div.exxitefilter a.error:before{background-color:var(--erroraccent); outline:none;}
div.exxitefilter a.question:before{background-color:var(--questionaccent);}
div.exxitefilter a.info:before{background-color:var(--infoaccent);}
div.exxitefilter a.ok:before{background-color:var(--okaccent);}
/*exxitefilter styles end*/

/*color control styles begin -- editor_color.php -- exxite.js XXX*/
  div.exxitecolorpicker{
    --thbg:  linear-gradient(90deg, rgba(0,0,0,0.2) 0%, rgba(0,0,0,0.2) 46%, rgba(255,255,255,1) 49%, rgba(0,0,0,1) 50%, rgba(0,0,0,0.2) 53%, rgba(0,0,0,0.2) 100%);
    --thbgh: linear-gradient(90deg, rgba(0,0,0,0.4) 0%, rgba(0,0,0,0.4) 46%, rgba(255,255,255,1) 49%, rgba(0,0,0,1) 50%, rgba(0,0,0,0.4) 53%, rgba(0,0,0,0.4) 100%);
    --hue:   linear-gradient(to right, red 0%, #ff0 17%, lime 33%, cyan 50%, blue 66%, #f0f 83%, red 100%);
		--border-shadow:inset 0 1px 1px var(--gray);
  }

  div.exxitecolorpicker{padding:10px; display:grid; grid-template-columns:256px auto; position:relative;}
  div.exxitecolorpicker input{background:var(--bodybg);}

  div.exxitecolorpicker div.color-holder{grid-column-start:1; grid-column-end:3; padding:0 0 10px 0;}

  div.exxitecolorpicker div.fieldmark {width:14px; height:14px; border-radius:8px; border:1px solid var(--bodybgaccent); position:absolute; top:0; left:0; box-shadow:0 0 0 1px #000; transform:translate(-50%,-50%);}

  div.wheel{width:256px; height:256px; position:relative; border-radius:50%; border:1px solid var(--border);}
  div.wheel div.col{position:absolute; top:0px; left:0px; bottom:0px; right:0px; transform: rotate(90deg); background:conic-gradient(red, magenta, blue, aqua, lime, yellow, red); border-radius:50%;}
  div.wheel div.tone{position:absolute; top:0px; left:0px; bottom:0px; right:0px; background:radial-gradient(rgba(255,255,255,1) 0, rgba(255,255,255,0) 59px, rgba(0,0,0,0) 60px, rgba(0,0,0,1) 121px); border-radius:50%;}
  div.wheel-holder{position:relative;}
  div.exxitecolorpicker div.light50{position:absolute; width:20px; height:20px; border-radius:50%; background:var(--border); top:0; left:0; cursor:pointer;}
  div.exxitecolorpicker div.light50:hover{background:var(--hover);}
  div.exxitecolorpicker div.light50 span{display:none;}


  div.exxitecolorpicker div.slider-group{margin-bottom:10px; padding-bottom:10px; border-bottom:1px solid var(--border);}

  div.exxitecolorpicker div.slider {width:100%; position:relative; cursor:default; align-self:center;}

  div.exxitecolorpicker div.exxiterange{padding:0;}
  div.exxitecolorpicker div.exxiterange input{background:var(--border); height:18px;}
  div.exxitecolorpicker div.exxiterange input.hue{background:var(--hue);}
  div.exxitecolorpicker div.exxiterange input.alpha{background: linear-gradient(to left, rgb(55, 83, 138) 0%, rgba(55, 83, 138, 0) 100%);}

  div.exxitecolorpicker div.exxiterange{height:18px;}

  div.exxitecolorpicker div.exxiterange input[type=range] {-webkit-appearance: none; margin:0; width: 100%;}
  div.exxitecolorpicker div.exxiterange input[type=range]:focus {outline: none;}
  div.exxitecolorpicker div.exxiterange input[type=range]::-webkit-slider-runnable-track {width: 100%; height: 18px; cursor: pointer; animate: 0.2s; box-shadow: var(--border-shadow); background: transparent;  border: 0px solid #000;}
  div.exxitecolorpicker div.exxiterange input[type=range]::-webkit-slider-thumb {box-shadow: none;border: 0px solid #000; height: 18px; width: 39px; background:var(--thbg); cursor: pointer; -webkit-appearance: none; margin-top: 0;}

  div.exxitecolorpicker div.exxiterange input[type=range]::-webkit-slider-thumb:hover{background:var(--thbgh);}
  div.exxitecolorpicker div.exxiterange input[type=range]:focus::-webkit-slider-runnable-track {background: transparent;}

  div.exxitecolorpicker div.exxiterange input[type=range]::-moz-range-track {width: 100%;height: 18px;cursor: pointer;animate: 0.2s;box-shadow: var(--border-shadow);background: transparent;border: 0px solid #000; overflow:hidden;}
  div.exxitecolorpicker div.exxiterange input[type=range]::-moz-range-thumb {box-shadow: none;border: 0px solid #000;height: 18px;width: 39px;background:var(--thbg);cursor: pointer; border-radius:0;}
  div.exxitecolorpicker div.exxiterange input[type=range]::-moz-range-thumb:hover {background:var(--thbg);}
	div.exxitecolorpicker div.exxiterange input[type=range]::-moz-range-progress {background: transparent;}


  div.exxitecolorpicker div.colors{height:50px; display:grid; grid-template-columns:1fr 1fr;}
  div.exxitecolorpicker div.colors div.color1{height:50px; background:var(--bodybgaccent); cursor:pointer; display:grid;}
	div.exxitecolorpicker div.colors div.color1 p{display:block; font-size:0.6em; text-transform:uppercase; color:var(--bodycolor); align-self:center; justify-self:center; padding:5px; background:var(--semilight);}
	div.exxitecolorpicker div.colors div.color1:hover{}
  div.exxitecolorpicker div.colors div.color2{height:50px; background:var(--bodybgaccent);}

  div.exxitecolorpicker div.control {display:grid; grid-template-columns:40px 215px auto; padding:5px 0;}
  div.exxitecolorpicker div.control.wide {grid-template-columns:150px auto;}
  div.exxitecolorpicker div.control div.label{width:100%; font-size:0.6em; text-transform:uppercase; color:var(--bodycolor); align-self:center; overflow:hidden; text-overflow:ellipsis; padding:0 0 0 5px; cursor:default;}
  div.exxitecolorpicker div.control div.input{width:100%; align-self:center;}

  div.exxitecolorpicker div.control div.input input{width:100%; border:none; padding:2px 4px 2px 4px; box-sizing:border-box; text-align:right;}
  div.exxitecolorpicker div.control div.input input:focus{outline:none; background-color:var(--semihover);}
/*color control styles end*/