
::-moz-selection { /* Code for Firefox */
	color: var(--selectedTextColor);
	background: var(--selectedBackgroundColor);
  }
  
  ::selection {
	color: var(--selectedTextColor);
	background: var(--selectedBackgroundColor);
  }

  /* html {
	overflow-x: hidden;
	margin-right: calc(-1 * (100vw - 100%));
  } */

body, html{
	width: 100%;
	/*height: 100%;*/
	padding:0px;
	margin:0px;
	
	background-color: var(--bodyBackgroundColor);

	font-family: var(--fontFamyly);
	font-size  : var(--body-font-size);
	/* font-weight: 100; */
	/*line-height: 150%;*/
	color: var(--color);

	border: solid 0px transparent;
	/* letter-spacing: 0.08rem; */	
	/* background-size: cover; */
}

table{	
	font-size  : var(--body-font-size);
}
p, h1, h2, h3, h4, ul, li, table, button, input, label, body{	
	font-family: var(--fontFamyly);
}
hr{
 	background-color:#444;
	height: 1px;
	border: none;
	/*width: 90%;*/
}

img.default{
	border: solid 1px #444; 
	display: block;	
	margin-left: auto;	
	margin-right: auto;	
	width: 60%;
	padding: 7px;
	background-color: #111;
}

label:hover{
	text-decoration: underline;
}
summary{line-height: 23px;}
p.comment{
	color: var(--color);
	padding:0px 8px 0px 8px;
	margin:0px;
	text-indent: 15px;
	text-align: justify;
	white-space:normal;
	/* overflow-y: auto; */
	border: solid 1px transparent;
	background-color: transparent;
	border-radius: 5px;
	line-height:var(--line-height);
	/*border: solid 1px red;*/
	/*font-size:1.4rem;*/
	/*max-height: 297px;*/
	/* width:100%; */
	/*height: 100%;*/
	/* margin: 1px -20px 0px 0px; */
	/* padding:1px 10px 10px 2px; */
}
p.comXment{
	color: var(--color);
	padding:0px 0px 0px 0px;
	margin :0px 0px 0px 0px;
	text-indent: 15px;
	text-align: justify;
	white-space:normal;
	/* overflow-y: auto; */
	border: solid 1px transparent;
	background-color: transparent;
	border-radius: 5px;
	line-height:var(--line-height);
	/* border: solid 0px transparent; */
	/*font-size:1.4rem;*/
	/*max-height: 297px;*/
	/* width:100%; */
	/*height: 100%;*/
	/* margin: 1px -20px 0px 0px; */
	/* padding:1px 10px 10px 2px; */
}

/* p.enumeration{
	padding-top: 0px;
	margin-top: 0px;
	padding-bottom: 0px;
	margin-bottom: 0px;
	padding-left: 38px!important;
	text-indent: -15px!important;
} */

p.important{
	border-color: var(--commentImportant-border-color)!important;                     /* rgba(255,255,0,0.3)!important; */
	background-color:#44443A!important;
	/* line-height:20px; */
	margin-top: 8px!important;
	margin-bottom:8px!important;
	
	padding-top: 8px!important;
	padding-bottom:8px!important;
} 
.br{
	margin-top: 12px!important;
}
/* .h{
	font-size: var(--h1-font-size)!important;
} */

i.note{
	font-size:var(--note-font-size);
	color: var(--color);
	opacity: 0.5;
	/* line-height: 10px!important; */
}
/* #CCC; */
/*
.textImportant{
	border:  solid 1px  var(--textImportant-border-color);

	background-color: var(--green); 
	padding:1px 4px 1px 4px;
	color: var(--yellow);
	border-radius: 3px;
	text-indent: 0px;
}
*/


.textImportant{
	border:  solid 1px  var(--textImportant-border-color); 

	background-color: var(--textImportant-background-color); 
	/*padding:0px 4px 0px 4px;*/
	padding-left: 4px;
	padding-right: 4px;
	color:var(--textImportant-color);
	border-radius: 3px;
	text-indent: 0px;
}


span.colorH{
	color:  var(--colorMark); 
	background-color: transparent; /* #000; #555; */
	border-radius: 3px;
	padding: 1px 3px 1px 3px;
	border: solid 1px transparent; /* #555; */
}

strong.mark{
	font-weight: normal;
	color:  var(--colorMark); 
	background-color: transparent; /* #000; #555; */
	border-radius: 3px;
	padding: 1px 1px 1px 1px;
	border: solid 1px transparent; /* #555; */
}

input:focus {
	border-color: red;
	background-color: red;
}

.ui-dialog > .ui-widget-header {
	background: var(--dialogHeaderBackgroundColor);
	color:var(--color);
	border: solid 1px #333;
}

.ui-dialog .ui-dialog-title{
	padding-left: 5px;
}

.ui-widget {
    font-family: var(--fontFamyly);
    font-size: 1.4rem!important;
}

h1{
	color : var(--green); /*#008461 var(--green)  ; */
	/*font-family: 'Times New Roman', Times, serif;*/
	/*font-family:fantasy;*/
	opacity: 0.75;
	font-weight: normal;
	font-size: var(--h1-font-size);	
	/*font-family: var(--h1FontFamily);*/
	/*color:blue*/
}
h2{
	font-size: var(--h2-font-size);	
	margin-bottom: 0px;
	font-weight: normal;	
}




a.backToHome{
    position:fixed; 
    left:10px; 
    top:40px;
    text-decoration: none;
    /*font-family: Verdana, Geneva, Tahoma, sans-serif;*/
    border: solid 1px transparent;
    opacity: 0.5;
    padding-left: -145px;
}

a.backToHome:hover{
    opacity: 1;
}

a.backToHome img {
    content: var(--backToHome);	
    src: var(--backToHome);		
}


span.GDPR{
	/* background-image: url('/Images/GDPR.96x96.png'); */		
	background-image: url('/Images/GDPR.96x96.DarkMode.png');	
}

span.nocookies{
	background-image: url('/Images/CookiesFree.96x96.png');		
}
span.buymeabeer{
	background-image: url('/Images/Beer.96x96.png');		
}
span.home{
	background-image: url('/Images/Home.Green.96x96.png');
} 
span.cube3x3{
	background-image: url('/Images/cube.96x96.png');		
}

span.promise{
	/*background-image: url('/Images/Promise.96x96.png');	*/
	background-image: url('/Images/Promise.96x96.DarkMode.png');		
}
span.linkedin{
	background-image: url('/Images/Linkedin.62x62.png');		
}
span.github{
	background-image: url('/Images/github.91x91.png');		
}
span.cento{
	/*background-image: url('/Images/100.92x92.png');*/		
	background-image: url('/Images/100.92x92.DarkMode.png');	
}
span.pin{
	background-image: url('/Images/pin.71x71.png');		
}
span.clip{
	background-image: url('/Images/Clip.96x96.DarkMode.png');	
	/*background-image: url('/Images/Clip.96x96.png');*/		
}


span.slide {
	position: fixed;
	left: -120px;
	/* font-size: 1.4rem; */
	z-index: 999;
	width: 140px;
	opacity: 1;
	padding-left: 5px;
	padding-right: 20px;
	padding-top: 0px;
	transition: all 0.5s ease;
	background-repeat: no-repeat;
	background-position: calc(100% - 6px) center;
	background-size: 27px 27px;
	border-top-right-radius: 10px;
	border-bottom-right-radius: 10px;
	-webkit-user-select: none; /* Safari */
	-ms-user-select: none; /* IE 10 and IE 11 */
	user-select: none; /* Standard syntax */

	color: var(--menuColor);
	background-color: var(--menuBackgroundColor);
	border: var(--menuBorder); 	
}

span.slide a{
	/*color: var(--menuColor);*/
	background-color: var(--menuBackgroundColor);
	border: transparent;
}

span.slide span {
	/* color: red !important; *//* var(--main-bg-color); */
	font-weight:normal;
}
span.slide:hover, span.load {
	/*color: #777;*/
	left: 0px;
	transition: all 0.5s ease;
	opacity: 1;
	/*background-color: #E2E2E2;*/
	/*background-image: url('/Images/cookiesFree.96x96.png');*/

/*
	-webkit-box-shadow: 3px 2px 5px 2px rgba(0,0,0,0.37);
	-moz-box-shadow: 3px 2px 5px 2px rgba(0,0,0,0.37);
	box-shadow: 3px 2px 5px 2px rgba(0,0,0,0.37);
	*/
}


.blinkLink span {
	color:var(--green);
	font-weight: bold;
}

.blinkLink {
	-webkit-animation: blink 1.25s linear 9;
	-moz-animation: blink 1.25s linear 9;
	-ms-animation: blink 1.25s linear 9;
	-o-animation: blink 1.25s linear 9;
	animation: blink 1.25s linear 9;
	text-decoration: none;
	border: dotted 1px transparent;
	border-bottom: dotted 1px var(--green);
}

.blinkLink:hover {
	text-decoration: none;
}


#divMenuBar{
	margin: 0px 0px 0px 0px;
	padding: 2px 12px 2px 12px;
	text-align: center;

	background-color: var(--menuBackgroundColor);
	border-bottom: var(--menuBorder);
}

.shadow{
	-webkit-box-shadow: 0px 0px 10px 2px rgba(0,0,0,0.5);
	-moz-box-shadow: 0px 0px 10px 2px rgba(0,0,0,0.5);
	box-shadow: 0px 0px 10px 2px rgba(0,0,0,0.5);
}

span.dialogY{
	background-image: url(/Images/BubbleYellow2.170x120.Opacity05.png);
}

a.dialog, span.dialog{
	background-image: url(/Images/BubbleGreen.170x120.Opacity05.png);
	opacity: 0.75;
}
span.Link96x96{
	background-image: url(/Images/Link.96x96.Opacity05.png);
}

a.dialog, span.dialog, span.dialogY, span.Link96x96{
	background-repeat: no-repeat;
	background-position: right;
	background-size: 15px 10px;
	padding-right: 20px;
	border-top: solid 1px transparent;
	border-left: solid 1px transparent;
	border-right: solid 1px transparent;
}

a.dialo:hoverg, span.dialog:hover{
	background-image: url(/Images/BubbleGreen.170x120.png);
}
span.dialogY:hover{
	background-image: url(/Images/BubbleYellow2.170x120.png);
}

span.Link96x96:hover{
	background-image: url(/Images/Link.96x96.png);
	text-decoration: none;
}

a.dialog:hover, span.dialog:hover, span.dialogY:hover{
	opacity: 1;
}
span.link{
	/*color:blue;*/
	color:var(--colorLink);
	background-image: url(/images/Link.light.16x11.png);
	background-repeat: no-repeat;
	background-position: right;
	padding-right: 20px;
	border: solid 1px transparent;
}
span.link:hover{
	color:var(--colorLink);
	background-image: url(/images/Link.16x11.png);
	border-bottom: solid 1px #888;
}
span.eMail{
	/*color:blue;*/
	/*color:#0012C7;*/
	background-image: url(/images/email.17x11.gray.png);
	background-repeat: no-repeat;
	background-position: right;
	padding-right: 20px;
	border: solid 1px transparent;
}

span.eMail:hover{
	color:var(--colorLink);
	background-image: url(/images/Email.17x11.png);
	border-bottom: solid 1px #888;
}

 #divMenuBar .menuItem, #divMenuBar .menuSubItem {	
	margin: 0px;
	font-size: var(--menu-font-size);
	text-decoration: none;
	/* padding:1px 5px 2px 25px; */
	padding-right:5px;
	padding-left:25px;
	border: solid 1px transparent;
	border-radius: 3px;
	color: var(--color);
	text-decoration: none;
	
	/*font-family: var(--menuFontFamily);*/	
 }
 /* .menuXXX {
	font-size: 1.5rem;
	padding: 0px 0px 0px 0px;
	background-position: center;
} */



 #divMenuBar .menuItem:hover, #divMenuBar .menuSubItem:hover {
	background-color: var(--menuHoverBackgroundColor);
	color: var(--menuHoverColor);
	/*border: solid 1px #111;*/
}


.textGreen{
    color:var(--green);
    /* display: inline-block;width: 100px; */
    border: solid 1px transparent;	
	border-bottom: dotted 1px var(--colorLink);
}
.textGreen:hover{
    /*color:var(--green);*/
    /* display: inline-block;width: 100px; */
    /* border-bottom: solid 1px var(--green); */
}
  

  
  #divMenuBar  .dropdown {
	position: relative;
	border:solid 1px transparent;
  }
  
  #divMenuBar .dropdown-content {
	display: none;
	position: absolute;
	margin-left: 0px;
	z-index: 10;
	padding: 2px;

	background-color: var(--menuBackgroundColor);
	color: var(--menuColor);
	border: solid 1px #444;
  }
  
  #divMenuBar .dropdown-content span {
	padding: 5px 8px 5px 25px;
	text-decoration: none;
	display: block;
	text-align: left;
	border: solid 1px transparent;

	color: var(--menuColor);
	border: solid 1px transparent;	
  }

  #divMenuBar .dropdown-content a:hover {
	background-color: var(--menuHoverColor);
  }
  
  
  #divMenuBar .dropdown:hover .dropdown-content {
	display:flow-root;
  }




.noselect {
	-webkit-touch-callout: none; /* iOS Safari */
	  -webkit-user-select: none; /* Safari */
	   -khtml-user-select: none; /* Konqueror HTML */
		 -moz-user-select: none; /* Old versions of Firefox */
		  -ms-user-select: none; /* Internet Explorer/Edge */
			  user-select: none; /* Non-prefixed version, currently
									supported by Chrome, Edge, Opera and Firefox */
  }



  
span.Solution{
	border: solid 0px red; 
	display: inline-block;
	width: 80px;text-align: center;
	/* font-size: 1.4rem; */
	/*color: fuchsia;*/
}

label{
	border: solid 0px red; 
	/* font-size: 1.4rem; */
	/*color: fuchsia;*/
}


span.hline{
    opacity: 0.3;
    /* display: inline-block;width: 42px; */
    border: solid 0px green;
	font-family: 'Courier New', Courier, monospace;
    text-align: right;
}
textarea:focus, input:focus{
    outline: none;
}


h1.jolly{
	padding-left:66px;
	background-image: url(/images/jolly.png); 
	background-repeat: no-repeat;
	background-size: auto 30px;
	background-position: 6px 3px 
}

