*, html	{ font-family:arial,helvetica; box-sizing:border-box; line-height:120%; -webkit-text-size-adjust: 100%; }
body	{ font-family:arial,helvetica; box-sizing:border-box; line-height:120%; margin:0px; overflow-Y:scroll; background:#FFF; }
#back	{ position:fixed; z-index:-1; left:0px; top:0px; width:100%; height:100%; background:url(/pics/back3.jpg) no-repeat center center fixed;
	  -webkit-background-size:cover; -moz-background-size:cover; -o-background-size:cover; background-size:cover; opacity:.3; }

.center		{ position:relative; width:100%; left:50%; height:auto; margin-left:-50%; }

ol > li		{ line-height:150%; }
a		{ color:blue; }

#nav		{ position:fixed; z-index:2; height:60px; width:100%; top:0px; background:#000; text-align:center; cursor:pointer; }
#adm		{ position:fixed; z-index:2; height:60px; width:100%; top:0px; background:#110033; text-align:center; cursor:pointer; }
#nav table	{ width:100%; height:100%; max-width:1200px; border-left:1px solid #999; }
#nav table td	{ border-right:1px solid #999; }
.nav, .nav a	{ font-size:calc(8px + 1vw); color:white; cursor:pointer; text-decoration:none; }
.nav:hover	{ background:#0033CC; }
.navon		{ background:#19449C; }

#bar		{ position:fixed; z-index:2; top:60px; width:100%; height:4px; background:#0033CC; border-top:1px solid #3366FF; border-bottom:1px solid #0011AA; }

#main		{ width:100%; max-width:1200px; margin:auto auto; padding:80px 35px 5px 35px; }
#notice		{ position:absolute; line-height:73px; height:73px; z-index:10; width:100%; top:0px; left:0px; font-weight:bold; text-align:center; color:white; }

#bottom		{ position:absolute; background:#404041; width:100%; height:100%; color:white; }
#copy		{ width:100%; font-size:.7rem; color:white; text-align:center; padding:20px 10px 20px 10px; }

h1		{ font-size:1.8rem; font-weight:normal; margin-top:10px; }
h2		{ font-size:1.6rem; font-weight:normal; margin-top:10px; }
h3		{ font-size:1.4rem; font-weight:normal; margin-top:10px; }
h1 a, .reload	{ font-size:2rem; font-weight:normal; color:black; text-decoration:none; cursor:pointer; }

input[type='text'], input[type='file'], input[type='number'], input[type='range'], input[type='password'], input[type='email'], input[type='tel'], textarea {
		  width:100%; font-size:.9rem; width:100%; padding:7px; border:1px solid #CCC; border-radius:10px; background:white; color:black; background:white; }
select		{ width:100%; font-size:.9rem; width:100%; padding:7px 7px 7px 5px; border:1px solid #CCC; border-radius:10px; background:white; color:black; background:white; }
#submit,.submit,.update { font-size:1.1rem; font-weight:bold; color:#FFF; padding:10px; border:1px solid #0011AA; border-radius:10px; 
		width:49%; background-color:#3366CC; background:-webkit-linear-gradient(#3366FF,#0033CC); text-align:center; color:#FFFFFF; cursor:pointer; }
#delete,.delete{ font-size:1.1rem; font-weight:bold; color:#FFF; padding:10px; border:1px solid #990000; border-radius:10px;
		width:100%; background-color:#EE0000; background:-webkit-linear-gradient(#FF0000,#CC0000); text-align:center; color:#FFFFFF; cursor:pointer; }
#reset		{ font-size:1.1rem; font-weight:bold; color:#FFF; padding:10px; border:1px solid #333; border-radius:10px;
		width:100%; background-color:#EE0000; background:-webkit-linear-gradient(#999,#666); text-align:center; color:#FFFFFF; cursor:pointer; }
@media (max-width: 600px) { #submit, #delete, #reset { width:100%; } }

/* Image Columns */
.galls	{ -moz-column-count:4; -webkit-column-count:4; column-count:4; -moz-column-gap:10px; -webkit-column-gap:10px; column-gap:10px; }
.gall	{ display:inline-block; margin:0 0 10px 0; width:100%; border:1px solid #999999; cursor:pointer; }
@media (max-width:1000px) { .galls { -moz-column-count:3; -webkit-column-count:3; column-count:3; } }
@media (max-width: 750px) { .galls { -moz-column-count:2; -webkit-column-count:2; column-count:2; } }
@media (max-width: 400px) { .galls { -moz-column-count:1; -webkit-column-count:1; column-count:1; } }

.btn	{ display:inline-block; height:26px; background:#19449C; color:white; border-radius:12px; margin:0 5px 5px 0; padding:2px 10px 10px 10px; }
.on	{ background:#222222; }
.btn a	{ font-size:.75rem; color:white; text-decoration:none; }

.cats	{ -moz-column-count:4; -webkit-column-count:4; column-count:4; -moz-column-gap:10px; -webkit-column-gap:10px; column-gap:10px; }
.cat	{ display:inline-block; margin:0 0 10px 0; width:100%; border:1px solid #999999; cursor:pointer; }
.cat img { width:100%; height:auto;  border:1px solid #666; }
@media (max-width: 900px) { .cats { -moz-column-count:3; -webkit-column-count:3; column-count:3; } }
@media (max-width: 700px) { .cats { -moz-column-count:2; -webkit-column-count:2; column-count:2; } }
@media (max-width: 400px) { .cats { -moz-column-count:1; -webkit-column-count:1; column-count:1; } }

.pros	{ -moz-column-count:6; -webkit-column-count:6; column-count:6; -moz-column-gap:10px; -webkit-column-gap:10px; column-gap:10px; }
.pro	{ margin:0 0 10px 0; width:100%; border:1px solid #999999; }
.pro img { width:100%; height:auto;  border:1px solid #666; }
.MainImg { width:100%; height:auto; margin:10px 0 10px 0; border:1px solid #666; }
.HiRes	{ cursor:pointer; }
#hires	   { position:fixed; display:none; z-index:3; left:0; top:0; width:100%; height:100%; background:black; color:white; padding:5px; text-align:center; }
#hires img { height:100%; width:auto; max-width:100%; max-height:100%; object-fit:contain; }

@media (max-width: 900px) { .pros { -moz-column-count:5; -webkit-column-count:5; column-count:5; } }
@media (max-width: 800px) { .pros { -moz-column-count:4; -webkit-column-count:4; column-count:4; } }
@media (max-width: 700px) { .pros { -moz-column-count:3; -webkit-column-count:3; column-count:3; } }
@media (max-width: 600px) { .pros { -moz-column-count:2; -webkit-column-count:2; column-count:2; } }
@media (max-width: 400px) { .pros { -moz-column-count:1; -webkit-column-count:1; column-count:1; } }

#pro1 { float:left; width:50%; padding:20px 20px 20px  0px; border-right:2px solid black;  }
#pro2 { float:left; width:50%; padding:20px  0px 20px 20px; }
#pro1 b, #pro2 b { font-size:1.5rem; font-weight:bold; }
#tele { display:inline-block; font-size:2.0rem; font-weight:bold; background:#19449C; color:white; margin:10px 0 15px 0; padding:20px 40px 20px 40px; border-radius:20px; white-space:nowrap; }
#tele a { color:white; text-decoration:none; }
@media (max-width: 800px) { #pro1, #pro2  { float:none; width:100%; padding:0px 0 20px 0; border:0; } }

/* Contact Form */
#pro2 input, #pro2 select, #pro2 textarea { border:1px solid black; border-radius:5px; }
.cont100 { width:100%; padding:0 5px 10px 0px; }
.cont50  { float:left; width:50%; padding:0 5px 10px 0px; }
.cont33  { float:left; width:33%; padding:0 5px 10px 0px; }
@media (max-width: 600px) { .cont50, .cont33 { float:none; width:100%; padding:0 5px 10px 0px; } } 

/* Page Manager */
.tree		{ width:100%; min-width:100px; padding:10px 10px 5px 5px; border:1px solid #CCC; border-radius:10px; white-space:nowrap; overflow:auto; }
.tree ul	{ font-size:12px; margin:0px 0px 0px -15px; list-style:none; }
.tree ul li	{ position:relative; cursor:pointer; }
.tree ul li:before { position:absolute; left:-15px; top:0px;	 content:''; display:block; border-left:1px solid #999; border-bottom:1px solid #999; width:10px; height:9px; }
.tree ul li:after  { position:absolute; left:-15px; bottom:-7px; content:''; display:block; border-left:1px solid #999; height:100%; }
.tree ul li.root   { margin:0px 0px 0px -15px; }
.tree ul li.root:before	{ display:none; }
.tree ul li.root:after	{ display:none; }
.tree ul li:last-child:after { display:none; }
.treeY { text-decoration:none; color:#000000; border:1px solid #FFF; height:20px; padding:2px; margin:0px 0px 0px 0px; }
.treeN { text-decoration:none; color:#666666; border:1px solid #FFF; height:20px; padding:2px; margin:0px 0px 0px 0px; }
.treeY:hover { border:1px solid #CCC; background-Color:#FFFFCC; }
.treeN:hover { border:1px solid #CCC; background-Color:#FFFFCC; }
	

/* Grid Stuff */
#gtbl	{ margin:0; }
#title	{ padding:0 0 0 0; }
.addrec	{ font-size:1.5rem; color:blue; text-decoration:none; }	

#clear	{ position:absolute; top:120px; width:calc(90% - 8px); min-width:206px; max-width:1200px; margin:auto auto;
	  visibility:hidden; font-size:.9rem; color:blue; text-align:right; text-decoration:none; cursor:pointer; background:red; }

#pages	{ font-size:1rem;  white-space:nowrap; }

#pgtbl	{ font-size:1rem; white-space:nowrap;
	.records	{ height:10px; padding-right:7px; }
	.cell_on	{ height:10px; padding:2px 3px 2px 3px; color:white; background:#0033FF; border:1px solid #CCC; border-radius:5px; text-align:center; cursor:pointer; }
	.cell_of	{ height:10px; padding:2px 3px 2px 3px; color:black; background:#FFFFFF; border:1px solid #CCC; border-radius:5px; text-align:center; cursor:pointer; }
	#l2, #l1, #n1, #of, #pgs, #n2, #g1, #g2 { display:table-cell; height:10px; padding:2px; text-align:center; vertical-align:middle; }
	#l2	{ border:1px solid #CCC; min-width:20px; border-radius:5px 0 0 5px; border-right:0; }
	#l1	{ border:1px solid #CCC; min-width:20px; }
	#n1	{ border:1px solid #CCC; border-left:0; border-right:0; padding:0; text-align:right; }
	#of	{ border:1px solid #CCC; min-width:15px; border-left:0; border-right:0; }
	#n2	{ border:1px solid #CCC; border-left:0; padding:0; padding-right:4px; }
	#pgs	{ border:1px solid #CCC; border-left:0; text-align:left; padding-right:5px; }
	#g1	{ border:1px solid #CCC; min-width:20px; border-left:0; }
	#g2	{ border:1px solid #CCC; min-width:20px; border-radius:0 5px 5px 0; border-left:0; }
	.dark	{ color:#000; }
	.dark:hover { background:#CCFFCC; cursor:pointer; }
	.lite	{ color:#999; }
}