
	
	.shadow{
		
		-webkit-box-shadow: 17px 23px 18px -1px rgba(0,0,0,0.85);
		-moz-box-shadow: 17px 23px 18px -1px rgba(0,0,0,0.85);
		box-shadow: 17px 23px 18px -1px rgba(0,0,0,0.85);
	
		/* gold */	
		/*		
		-webkit-box-shadow: 17px 23px 18px -1px rgba(255, 215, 0,0.45);
		-moz-box-shadow: 17px 23px 18px -1px rgba(255, 215, 0,0.45);
		box-shadow: 17px 23px 18px -1px rgba(255, 215, 0,0.45);
		*/
	}

	div.opaque{
		transition: opacity 0.75s;
		opacity: 0.65;
	}
	div.opaque:hover{
		opacity: 1;
	}


	div.content{
		/*min-width:350px;*/
		/* margin:auto; */
		border: solid 0px red;
		/*text-align:center;*/
		margin : 5px 0px 0px 0px;
		padding: 0px 0px 0px 0px;
		/* margin-bottom: 0px; */
		width: 100%;
		/* background-color: red; */
	}	

	div.region, div.privacy{
		min-width: 300px!important;
		max-width: 660px!important;
	}



	div.region{
		margin-left: auto;
		margin-right: auto;
	}


	
	.secXtXion{
		margin-bottom: 25px!important;
		padding-bottom: 5px!important;

		border-radius:7px;
	}


	.secXtXion{
		margin-top: var(--margin-top);
	}

	ul.ulList{
		list-style-position: outside;
		padding: 0px 0px 0px 0px;
		border: solid 0px red;
	}
	ul.ulList li{
		text-align: justify;
		margin-bottom: 10px;
	}
	button.move{	
		font-size: 1.3rem;
	}
	@media screen and (min-width: 1px) and (max-width: 550px) {		
		div.paddingDialog{
			margin: 0px 3px 0px 4px!important;
		}
		#rdoStandardH, #tblMovesH, #lblStandardH, #tdFunction{
			display: none;
		}
	}	
	@media screen and (min-width: 551px) and (max-width: 9999px) {
		
		div.paddingDialog{
			margin: 0px 15px 0px 15px!important;
		}
		
		#rdoStandardV, #tblMovesV, #lblStandardV{
			display: none;
		}
	}


	@media screen and (min-width: 1px) and (max-width: 580px) {


		button.next, button.dot, button.run, button.runAll, button.pause, button.move{
			width: 45px!important;
		}
		button.BackArrow, button.NextArrow{
			width: 35px!important; 
		}
		button.next, button.dot, button.run, button.runAll, button.pause, button.BackArrow, button.NextArrow, #btnScramble, button.move{
			height: 40px!important;
		}

	}

	@media screen and (min-width: 1px) and (max-width: 1100px) {


		.secXtXion{
			/* margin-top: 1px; */
		}
		.cubeHeader td:nth-child(n+5){
			display: none!important;
			border: solid 0px red;
		}
		div.region{
			width: calc(100% - 10px)!important;
			padding: 0px 2px 0px 2px!important;
			/* border: none!important; */
			/* background-color: transparent!important; */
		}
		.secXtXion{
			background-color: transparent!important;
			border: solid 0px transparent!important;
			/* margin-top: var(--margin-top);
			margin-bottom: 25px!important;
			padding-bottom: 5px!important;
	
			border-radius:7px; */
		}
		ul.ulList{
			/* line-height: 23px;*/
			/* list-style-position: outside;  */
			margin: 0px 0px 0px 25px;
			/* padding: 0px 0px 0px 0px; */
			/* border: solid 0px red; */
		}
		.shaXdow{
			/* -webkit-box-shadow: 17px 23px 18px -1px red;
			-moz-box-shadow: 17px 23px 18px -1px red;
			box-shadow: 17px 23px 18px -1px red;		 */
		}
		#divFullFeatures{
			/* margin-left: 215px!important; */
			width: calc(100% - 470px)!important;
			padding: 0!important;
		}	

		#spnSpace, #spnError, #spnHelp{
			display: none;
		}
	}

	@media screen and (min-width: 1101px) and (max-width: 9999px) {
		
		button.move{
			width:25px;
			height:25px;	
		}
		div.region, div.privacy{	
			width: calc( 100% - 50px );
			padding: 0px 15px 0px 15px;		
		}
		.secXtXion{
			background-color: var(--section-background-color);
			border: solid 1px #444;
			margin-top: var(--margin-top);
		}
		ul.ulList{
			margin: 0px 0px 0px 50px;
		}

		.shaXdow{
			-webkit-box-shadow: 17px 23px 18px -1px rgba(0,0,0,0.85);
			-moz-box-shadow: 17px 23px 18px -1px rgba(0,0,0,0.85);
			box-shadow: 17px 23px 18px -1px rgba(0,0,0,0.85);		
		}

		#brLineBreak{
				display: none;
		}
		#divFullFeatures{
			display: none;
		}
	}

	/* =========================================================== */

	div.pageEnd{
		margin-bottom: 100px;
	}

	h1.feature{
		margin-bottom: 12px;
	}


	span.commentId{
		/*font-family:verdana; */
		font-size:1rem;
		/* font-weight: bold; */
	}

	div.commentId{
		/*font-family:verdana; */
		font-size:1rem;
		/*height: 900px;*/		
		/*height: 440px;*/
		/*overflow-y: auto;*/
		background-color: #444;
	}


	label:hover{
		cursor: pointer;
	}
	
	#tblActions {
		width: 200px;
	}
	#tblActions td{
		border:solid 0px red;
		padding: 2px 0px 2px 0px;
		text-align: center;
	}
	#tblActions td{
		border:solid 0px red;
		padding: 2px 0px 2px 0px;
		text-align: center;
	}


	
	/* xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx */

	.hover{	
		opacity: 0.7;
		/*border:solid 1px #ccc;*/
	}
	.hover:hover{	
		opacity: 1;
		/*border:solid 1px #777;*/
	}

	/* xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx */
	
	#divLoading {
		padding: 0px 2px 2px 2px;
		background-color: transparent;
		width: 100%;
		margin:auto;
		border: solid 0px #3c3c3c;
	} 
	@keyframes placeHolderShimmer {
		/* 0% {
		  background-position: -calc(100%) 0
		}
		100% {
		  background-position: calc(100%) 0
		} */
		0% {
			/* background-position: -50px 0; */
			background-position: -75% 0px, 0px 0px;
		  }
		  100% {
			/* background-position: 50px 0; */
			background-position: 175% 0px, 0px 0px;
		  }
	  }
	  
	  .animated-background {
		animation-name: placeHolderShimmer;
		animation-duration: 1.0s;
		animation-fill-mode: forwards;
		animation-iteration-count: infinite;
		animation-timing-function: linear;
	  
		/*background: linear-gradient(to right, #FFF000 25%, transparent 25%);*/
		background: linear-gradient(to right, transparent, rgba(255,255,0,0), rgba(255,255,0,1), rgba(255,255,0,0), transparent);
		/* background:red; */
		background-size: calc(50%) 10px, 0 0;
		background-repeat: no-repeat;
		height: 1px;
		position: relative;
	  }

/* #divMode {
	border: solid 1px #ccc;
	margin: 0px;
	padding: 2px;
	border-bottom: none;
}	 */

/* #divMode > div{
	border: solid 1px #aaa;
	text-align: left;
	background-color: #ccc;
	padding: 1px 2px 1px 2px;
	font-size: 1.1rem;
}	 */

/* #divMode button{
	font-size: 1rem;
	margin:0px;
	padding: 1px 2px 1px 2px;
} */


/* #txtScramble{
	width: 29em;
} */


/* .section{
	background-color: var(--section-background-color);
	border: solid 1px #444;
	margin-top: var(--margin-top);
	margin-bottom: 25px!important;
	padding-bottom: 5px!important;
	border-radius:7px;

	-webkit-box-shadow: 17px 23px 18px -1px rgba(0,0,0,0.85);
	-moz-box-shadow: 17px 23px 18px -1px rgba(0,0,0,0.85);
	box-shadow: 17px 23px 18px -1px rgba(0,0,0,0.85);
} */



