/* ******************************************************* */
	/* Blue Layout                                             */
	/* ******************************************************* */

	/* General Text Style including text under logo */
	/* background color affects bottom of page 0C0C39*/

	html { width: 100%; max-width: 100%; height: 100% } 

	/* font-size:12px; */  /* gold	color:#FFCC66; #FF9900 #FFB450 */ 
	body { 	background-image: url('https://UserX.org/images/backfader3_2016d.png'); background-color: #172E5F !important; background-repeat: repeat-x; overflow-x: hidden;
			width: 100%; height: 100%; float: left; margin:0; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-size: 16px; color: #FFCC66; background-attachment: scroll }

	/* paragraph justification */
	p { text-align:justify; text-shadow: 0.08em 0.08em black}

	img { -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px }

	/* 3D box title */
	h1 { font-size: 160%; font-weight: normal; color: #FF9900; text-shadow:0.08em 0.08em black }

	/* 2D box title and 3D box subtitle */
	h2 { font-size: 120%; font-weight: normal; color: #FF9900; text-shadow: 0.08em 0.08em black }

	/* All links */
	a { color: #FF9900; text-decoration: none; text-shadow: 0.08em 0.08em black; }
	a:hover { text-decoration: none }
	/* Read more buttons */
	a.button { background-image: url('https://UserX.org/images/button.png'); display:block; font-size:75%; margin-top:10px; margin-bottom:10px; height:30px; line-height:28px; text-align:center; text-transform:lowercase; width:92px }
	a.button2 { background-image: url('https://UserX.org/images/button.png'); display:block; font-size:75%; margin-top:10px; margin-bottom:10px; height:30px; line-height:28px; text-align:center; width:92px }
	a:hover.button { background-position:-91px 0; display:block; }

	a.nav { display:block; width:50px; height:78px; font-size:100%; line-height:50px; text-align:center; padding: 10% 1% 10% 1%; 
			text-shadow:  0.08em  0.08em 0.08em rgba(0, 0, 0, 1.0), 
						 -0.08em  0.08em 0.08em rgba(0, 0, 0, 1.0), 
						 -0.08em -0.08em 0.08em rgba(0, 0, 0, 1.0), 
						  0.08em -0.08em 0.08em rgba(0, 0, 0, 1.0),
						 -0.09em -0.09em 0.5em rgba(128, 128, 192, 1.0), 
						  0.09em  0.09em 0.5em rgba(128, 128, 192, 1.0) }
						  
	a.nav { animation : glow 2s ease-in-out infinite alternate !important;
			-moz-animation: glow 2s ease-in-out infinite alternate !important; /* Firefox */
			-webkit-animation: glow 2s ease-in-out infinite alternate !important; /* Safari and Chrome */
			-o-animation: glow 2s ease-in-out infinite alternate !important; /* Opera */			}


	@-moz-keyframes glow {
		from { text-shadow:  0.08em  0.08em 0.08em rgba(0, 0, 0, 1.0), 
							-0.08em  0.08em 0.08em rgba(0, 0, 0, 1.0), 
							-0.08em -0.08em 0.08em rgba(0, 0, 0, 1.0), 
							 0.08em -0.08em 0.08em rgba(0, 0, 0, 1.0), 
							-0.09em -0.09em 0.5em rgba(192, 192, 255, 1.0), 
							 0.09em  0.09em 0.5em rgba(192, 192, 255, 1.0),						 
							 0 0 0.7em #336699, 0 0 0.9em #336699, 0 0 1.1em #336699, 0 0 1.3em #336699 }

		to { text-shadow:  0.08em  0.08em 0.08em rgba(0, 0, 0, 1.0), 
						  -0.08em  0.08em 0.08em rgba(0, 0, 0, 1.0), 
						  -0.08em -0.08em 0.08em rgba(0, 0, 0, 1.0), 
						   0.08em -0.08em 0.08em rgba(0, 0, 0, 1.0), 
						  -0.09em -0.09em 0.5em rgba(192, 192, 255, 1.0), 
						   0.09em  0.09em 0.5em rgba(192, 192, 255, 1.0),					   
						   0 0 0.7em #003366, 0 0 0.9em #003366, 0 0 1.1em #003366, 0 0 1.13em #003366 }
	}

	@-webkit-keyframes glow {
		from { text-shadow:  0.08em  0.08em 0.08em rgba(0, 0, 0, 1.0), 
							-0.08em  0.08em 0.08em rgba(0, 0, 0, 1.0), 
							-0.08em -0.08em 0.08em rgba(0, 0, 0, 1.0), 
							 0.08em -0.08em 0.08em rgba(0, 0, 0, 1.0), 
							-0.09em -0.09em 0.5em rgba(128, 128, 192, 1.0), 
							 0.09em  0.09em 0.5em rgba(128, 128, 192, 1.0),						 
							 0 0 0.7em #336699, 0 0 0.9em #336699, 0 0 1.1em #336699, 0 0 1.3em #336699 }

		to { text-shadow:  0.08em  0.08em 0.08em rgba(0, 0, 0, 1.0), 
						  -0.08em  0.08em 0.08em rgba(0, 0, 0, 1.0), 
						  -0.08em -0.08em 0.08em rgba(0, 0, 0, 1.0), 
						   0.08em -0.08em 0.08em rgba(0, 0, 0, 1.0), 
						  -0.09em -0.09em 0.5em rgba(128, 128, 192, 1.0), 
						   0.09em  0.09em 0.5em rgba(128, 128, 192, 1.0),					   
						   0 0 0.7em #003366, 0 0 0.9em #003366, 0 0 1.1em #003366, 0 0 1.13em #003366 }
	}

	@keyframes glow {
		from { text-shadow:  0.08em  0.08em 0.08em rgba(0, 0, 0, 1.0), 
							-0.08em  0.08em 0.08em rgba(0, 0, 0, 1.0), 
							-0.08em -0.08em 0.08em rgba(0, 0, 0, 1.0), 
							 0.08em -0.08em 0.08em rgba(0, 0, 0, 1.0), 
							-0.09em -0.09em 0.5em rgba(192, 192, 255, 1.0), 
							 0.09em  0.09em 0.5em rgba(192, 192, 255, 1.0),						 
							 0 0 0.7em #336699, 0 0 0.9em #336699, 0 0 1.1em #336699, 0 0 1.3em #336699 }

		to { text-shadow:  0.08em  0.08em 0.08em rgba(0, 0, 0, 1.0), 
						  -0.08em  0.08em 0.08em rgba(0, 0, 0, 1.0), 
						  -0.08em -0.08em 0.08em rgba(0, 0, 0, 1.0), 
						   0.08em -0.08em 0.08em rgba(0, 0, 0, 1.0), 
						  -0.09em -0.09em 0.5em rgba(192, 192, 255, 1.0), 
						   0.09em  0.09em 0.5em rgba(192, 192, 255, 1.0),					   
						   0 0 0.7em #003366, 0 0 0.9em #003366, 0 0 1.1em #003366, 0 0 1.13em #003366 }
	}

	/* menu button highlight color: #FFCC66 */
	a:hover.nav { color: #FFBB55 !important; }
	a:hover.nav3 { color: #CC0080 !important; }
	a:hover.nav2 { color: #FFB450; background-image:url('https://UserX.org/images/semitr.png'); background-repeat:repeat-x; text-decoration:none }
	td:hover.nav3 { color: #E61906 !important; }
	a.nav4 {font-size:150%}
	a.nav5 { -webkit-tap-highlight-color : transparent; }
	/* Header Style Top Menu Bar*/
	#header { margin: 40px 10px 10px 5px; width: 100%; height: 10%; visibility: hidden }

	#header div#logo { background-image:url('https://UserX.org/images3/logo-bckg3x.png'); background-repeat:no-repeat; background-size: 100% 100%; background-repeat:no-repeat; float:left; margin : 0; height:78px; width:150px }
	/* background-image:url("../images3/logo-bckg-g.jpg") */
	/* background-image:url('../images/logo-bckg3.png') */
	#header div#logo img { width: 80%; height:70%; margin: 10% 10% 10% 10% }

	/* header logo framepadding background-color:#093063;*/

	#header div#logo2 { background-repeat:no-repeat; float:left; height:89px; padding:0px 36px 0px 46px; width:248px; }

	/* header navigation style. Top links location.*/
	#header div#navigation { margin: 0px 0px 0px 5px;  }

	/* links and highlights top menu bar unordered list*/
	#navigation ul  { margin: 0px; padding: 0px; list-style: none }

	/* list */
	#navigation li { float: left;}
	#navigation li a {  float: left; padding: 20% 0 0 0 }

	/* small text bottom of top menu */
	.smallsub { font-size: 10px; color: #FF0000; text-decoration: none; line-height: 20px }

	.smallsub a:hover { color: black; }

	#content { width:100% }

	.contentbox3D { position: relative; width: 340px; margin: 0 0 0 0; padding: 1% 4% 0 0; float: left; visibility: hidden }
	.contentbox3D h1,h2 { margin: 4% 4% 0% 4%; float:left }
	.contentbox3D img { margin: 2% 2% 0% 0%; float:left; max-width:94%;height:auto; }
	.contentbox3D p { margin: 4% 4% 1% 4% }
	.contentbox3D video { margin: 4% 4% 0% 4%; max-width:94%;height:auto }
	.contentbox3D a { margin: 4% 4% 0% 4%; float:right }
	.contentbox3D div.cb-top { width:100%; height:10px; background-image:url('https://UserX.org/images/box-top2x.png'); background-size: 100% 100%; background-repeat: no-repeat; float:left }
	.contentbox3D div.cb-middle { width:100%; height: auto; background-image:url('https://UserX.org/images/box-repeat2xx.png'); background-size: 100% 100%; background-repeat:repeat-y; padding:0; float:left }
	.contentbox3D div.cb-bottom { width:100%; height:46px; background-image:url('https://UserX.org/images/box-bott2x.png'); background-size: 100% 100%; background-repeat: no-repeat; float:left }

	/*

	bootstrap accordian fix to delete right float
	.contentbox3D a { margin: 4% 4% 0% 4%; float:right }
	*/

	.contentbox2D { position: relative; width: 280px; margin: 0 0 0 0; padding: 1% 4% 1% 0; float: left; visibility: hidden }
	.contentbox2D p,h1,h2 { margin: 4% 4% 1% 4%; float:left }
	.contentbox2D video { margin: 4% 4% 0% 4%; max-width:94%;height:auto }
	.contentbox2D img { margin: 4% 4% 0% 4%; max-width:96%;height:auto; }
	.contentbox2D a { margin: 4% 4% 0% 4%; float:right }
	.contentbox2D div.cb-top { width:100%; height:10px; background-image:url('https://UserX.org/images/box-top.png'); background-size: 100% 100%; float: left }
	.contentbox2D div.cb-middle { width: 90%; height: auto; padding: 0% 5% 0% 5%; background-image: url('https://UserX.org/images/box-repeat.png'); background-size: 100% 100%; background-repeat: repeat-y; float: left }
	.contentbox2D div.cb-bottom { width: 100%; height: 10px; background-image: url('https://UserX.org/images/box-bott.png'); background-size: 100% 100%; float: left; }
	.contentbox2D p { padding:5px; background-color:#303F66; }


	/* footer style that aren't links */
	#footer { width: 100%; position: relative; padding-top: 5%; padding-bottom: 10%; margin-bottom: 40px; color: #FF0000 }

	#footer div#navigation2 { float: left; height: 20px; width: 100% }

	#navigation2 ul { margin: 0; padding: 0px; font-size: 80%; list-style: none; float: left; width: 100% }

	#navigation2 li { margin: 0px 5px 0px 5px; padding: 0px; list-style:none; float: left }

	#footer div#generalia2 { float: right; margin-left: 20px; margin-right: 20px }

	#footer div#generalia1 { float: right; margin-left: 20px; margin-right: 20px }

	#footer div#copyright { float:right; margin: 60px 77px 20px 0px }

	.floatright { float: right; }
	.floatleft { float: left; }
	.verticalspace { margin-top: 60px }
	.alt_margin { margin:4% !important; }
	.alt_margin2 { margin:0% 2% 2% 4% !important; font-size:110% !important }
	.alt_margin3 { margin:2% 2% 2% 1% !important; float:none !important; font-size:110% !important; color: #FF9900 !important; display:inline !important; }
	.alt_margin4 { margin:3% 2% 1% 4% !important; float:left !important; position:relative }

	/* slightly enhanced, universal clearfix hack */
	.ClearFix:after {
		 visibility: hidden;
		 display: block;
		 font-size: 0;
		 content: " ";
		 clear: both;
		 height: 0;
		 }
	.ClearFix { display: inline-block; }
	/* start commented backslash hack \*/
	* html .ClearFix { height: 1%; }
	.ClearFix { display: block; }
	/* close commented backslash hack */

	*:focus{outline: none}