/* utility class */
/* utility class */
/* utility class */
/* utility class */

/* layout class */
.max90w {max-width: 90px;}
.max600 {max-width: 600px;}
.max920 {max-width: 920px;}
.max1020 {max-width: 1020px;}
.max1120 {max-width: 1120px;}
.max1200 {max-width: 1200px;}
.maxwidth-20em {max-width: 20em;}
.max-100 {	max-width: 100px; max-height: 100px;}
.max-150 {	max-width: 150px; max-height: 150px;}
.img-block-140 {max-width: 140px;}
.img-block-190 {max-width: 190px;}
.width-100 {width: 100%;}
.pad-5 {padding: 5px;}
.pad-10 {padding: 10px;}
.pad-20 {padding: 20px;}
.pad-5-15 {padding: 5px 15px;}
.pad-10-20-6 {padding: 10px 20px 6px;}
.pad-20-tb {padding: 20px 0;}
.pad-20-lr {padding: 0 20px;}
.pad-20-r {padding-right: 20px;}
.pad-1em0 {padding: 1em 0;} /*for vertical aligning with google map*/
.sidemargin10 {margin-left: 10px; margin-right: 10px;}
.sidemargin10-m {margin-left: 10px; margin-right: 10px;}
.margin-auto {margin-left: auto; margin-right: auto;}
.margin-0 {margin:0;}
.margin-20-auto {margin: 20px auto;}
.margin-lr-2 {margin-left: 2px; margin-right: 2px;}
.margin-20-top {margin-top: 20px}
.margin-20-top-b {margin-top: 20px; margin-bottom: 20px;}
.margin-20-left {margin-left: 20px}
.margin-20-right {margin-right: 20px}
.margin-bottom-0 {margin-bottom: 0}
.height-2-5em {height: 2.5em; line-height: 1.5em;}
.padding-bottom {padding-bottom: 1em;}


.position-absolute {position: absolute;}
.position-relative {position: relative;}
.position-fixed {position: fixed;}
.top-10 {top: 10px} .bottom-10 {bottom: 10px} .left-10 {left: 10px} .right-10 {right: 10px} 


.flex-container {display: flex; flex-wrap: wrap;}
.flex-dispel {display: flex; flex-wrap: wrap; justify-content: space-between;align-items: center;}
.flex-item {flex: 1 1 auto;}
.flex-item-3 {flex: 3;}
.flex-item-7 {flex: 7;}

/* float & block class */
.float-right {float: right;} html[dir="rtl"] .float-right {float: left;}
.float-left {float: left;} html[dir="rtl"] .float-left {float: right;}
.float-none {float: none;}
.clearb {clear: both}

.block {display: block;}
.inline-block,#p-page ul.inline-list li,#p-page ol.inline-list li,.subsite .inline-list li,.sethome ul.inline-list li {display: inline-block;}
ul.inline-list {padding: 0;}
.inline-block-180 {display: inline-block; min-width: 180px;}
.inline-block-120 {display: inline-block; min-width: 120px;}
.inline-block-300-66 {display: inline-block; min-width: 300px; width: 66.7%;}
.inline-block--30 {display: inline-block; width: 30%;}
.ib-container > * {display: inline-block;}

/* font & text class */
.text-pad {padding: 0.5em;}
.lineheight {line-height: 1.5em;}

.text-center {text-align: center;}
.text-left {text-align: left;} html[dir="rtl"] .text-left {text-align: right;}
.text-right {text-align: right;} html[dir="rtl"] .text-right {text-align: left;}
.text-upper {text-transform: uppercase;}
.text-lower {text-transform: lowercase;}
.table-center {display: table;margin: 0 auto;}
.vertical-top {vertical-align: top;}
.vertical-middle {vertical-align: middle;}
.vertical-bottom {vertical-align: bottom;}
.font-130 {font-size: 130%;}
.font-110 {font-size: 110%;}
.font-85 {font-size: 85%;}
.font-75 {font-size: 75%;}
.font36 {font-size: 36px;}
.font24 {font-size: 24px;}
.font12 {font-size: 12px;}
.font11 {font-size: 11px;}
.font10 {font-size: 10px;}
.font9 {font-size: 10px;}
.font15rem {font-size: 1.5rem;}
.font125rem {font-size: 1.25rem;}
.font2rem {font-size: 2rem;}
.font25rem {font-size: 2.5rem;}
.font3rem {font-size: 3rem;}
.font-weight400,a.font-weight400 {font-weight: 400}
.texthide {
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
.text-plain, .text-plain:hover, .text-plain:focus, .text-plain:active, .text-plain:visited {color: inherit; text-decoration: inherit;}
.color-success {color: #5cb85c;}
.color-danger {color: #c9302c;}
.red {color: red;} .green {color: green;} .orange {color: orange;} .ghostwhite {color: ghostwhite;}
/*.red:hover {color: red;} .green:hover {color: green;} .orange:hover {color: orange;} .ghostwhite:hover {color: ghostwhite;}*/

.link-1,.link-1:hover,.link-1:focus,.link-1:visited {color: inherit;text-decoration: none;}
.title-1 {font-size: 2em; font-weight: 700; text-transform: capitalize;}
.title-2 {color: ghostwhite; text-shadow: 1px 2px 1px black;}
.title-3 {
	display: block;
	background: rgba(230, 226, 221, 0.45);
	text-align: center;
	color: white;
/*	font-size: 36px;*/
	line-height: 1.5em;
	text-shadow: 1px 1px 1px black;
	font-variant: small-caps;
}
.t-sub {font-size: 50%;margin-left: 1em;}

/* icon image class */
.icon-1 {margin-right: 0.8em; display:inline-block;}
.i-128 {width: 128px;	height: 128px; vertical-align: middle}
.i-64 {width: 64px;	height: 64px; vertical-align: middle}
.i-48 {width: 48px;	height: 48px; vertical-align: middle}
.i-40 {width: 40px;	height: 40px; vertical-align: middle}
.i-32 {width: 32px;	height: 32px; vertical-align: middle}
.i-30 {width: 30px;	height: 30px; vertical-align: middle}
.i-24 {width: 24px;	height: 24px; vertical-align: middle}
.i-20 {width: 20px;	height: 20px; vertical-align: middle}
.i-16 {width: 16px;	height: 16px; vertical-align: middle}
.i-200em {width: 2em;	height: 2em; vertical-align: middle}
.i-250em {width: 2.5em;	height: 2.5em; vertical-align: middle}
.i-300em {width: 3em;	height: 3em; vertical-align: middle}
.i-350em {width: 3.5em;	height: 3.5em; vertical-align: middle}
.i-400em {width: 4em;	height: 4em; vertical-align: middle}
.img-radious-15 img {-webkit-border-radius: 15px;	-moz-border-radius: 15px; border-radius: 15px;}


/* background class */
.bg-tumblr-subtle {
	background-image: url('/images/bg/white_wall2.png');
	background-image: url('/images/bg/noisy_grid.png');
	background-image: url('/images/bg/gplaypattern.png');
}
.bg-gradient-white-black {
	background: #FFF;
	background: -webkit-linear-gradient(#FFF, #FFF 20%, #EEE 80%, #DDD);
	background: -moz-linear-gradient(#FFF, #FFF 20%, #EEE 80%, #DDD);
	background: -ms-linear-gradient(#FFF, #FFF 20%, #EEE 80%, #DDD);
	background: -o-linear-gradient(#FFF, #FFF 20%, #EEE 80%, #DDD);
	background: linear-gradient(#FFF, #FFF 20%, #EEE 80%, #DDD);
}
.bg-white {background-color: white;}
.bg-blue-1 {background-color: rgb(106, 145, 206);}
.bg-lavender {background-color: lavender;}
.bg-tp85 {background-color: lavender;}
.bg-1 {background-image: url('/images/bg/wall/cityroad.png');}
.bg-2 {background: url("/images/bg/news_bg1.png");}
.bg-a1 {background-image: url('/images/bg/bg-space.gif');	background-color: #000;	background-repeat: repeat-y;}
.bg-bw1 {background: url("/images/bg/bg-bw-square.gif");}

.bgb-stp-blue { /*dots-small|dots-medium|*/
background: #98c0e3 url("//download.jqueryui.com/themeroller/images/ui-bg_highlight-soft_75_98c0e3_1x100.png") 50% 50% repeat-x; /*highlight-hard|inset-soft|inset-hard*/
background: #98c0e3 url("//download.jqueryui.com/themeroller/images/ui-bg_glass_75_98c0e3_1x400.png") 50% 50% repeat-x;
background: #98c0e3 url("//download.jqueryui.com/themeroller/images/ui-bg_gloss-wave_75_98c0e3_500x100.png") 50% 50% repeat-x;
background: #98c0e3 url("//download.jqueryui.com/themeroller/images/ui-bg_glow-ball_75_98c0e3_600x600.png") 50% 50% repeat-x; /*spotlight*/
background: #98c0e3 url("//download.jqueryui.com/themeroller/images/ui-bg_dots-small_75_98c0e3_2x2.png") 50% 50% repeat;
background: #98c0e3 url("//download.jqueryui.com/themeroller/images/ui-bg_dots-medium_75_98c0e3_4x4.png") 50% 50% repeat;
background: #98c0e3 url("//download.jqueryui.com/themeroller/images/ui-bg_white-lines_75_98c0e3_40x100.png") 50% 50% repeat;
background: #98c0e3 url("//download.jqueryui.com/themeroller/images/ui-bg_diagonals-thick_75_98c0e3_40x40.png") 50% 50% repeat; /* */diagonals-medium | diagonals-small
background: #98c0e3 url("//download.jqueryui.com/themeroller/images/ui-bg_fine-grain_75_98c0e3_60x60.png") 50% 50% repeat;
background: #98c0e3 url("//download.jqueryui.com/themeroller/images/ui-bg_layered-circles_75_98c0e3_13x13.png") 50% 50% repeat;
background: #98c0e3 url("//download.jqueryui.com/themeroller/images/ui-bg_hexagon_75_98c0e3_12x10.png") 50% 50% repeat;
background: #98c0e3 url("//download.jqueryui.com/themeroller/images/ui-bg_diamond-ripple_75_98c0e3_22x22.png") 50% 50% repeat;
background: #98c0e3 url("//download.jqueryui.com/themeroller/images/ui-bg_diagonal-maze_75_98c0e3_10x10.png") 50% 50% repeat;
background: #98c0e3 url("//download.jqueryui.com/themeroller/images/ui-bg_carbon-fiber_75_98c0e3_8x9.png") 50% 50% repeat;
background: #98c0e3 url("//download.jqueryui.com/themeroller/images/ui-bg_loop_75_98c0e3_21x21.png") 50% 50% repeat;
background: #98c0e3 url("//download.jqueryui.com/themeroller/images/ui-bg_diamond_75_98c0e3_10x8.png") 50% 50% repeat;
}

/* border & shadow class */
.border-top-dash {border-top: 1px dashed orange;}
.border-5-white {border: 5px solid white;}
.border-circle {border-radius: 50%;}
.border-radious-2 {-webkit-border-radius: 2px;	-moz-border-radius: 2px; border-radius: 2px;}
.border-radious-4 {-webkit-border-radius: 4px;	-moz-border-radius: 4px; border-radius: 4px;}
.border-radious-8 {-webkit-border-radius: 8px;	-moz-border-radius: 8px; border-radius: 8px;}
.border-radious-15 {-webkit-border-radius: 15px;	-moz-border-radius: 15px; border-radius: 15px;}
.box-shadow-little {-webkit-box-shadow: 0 0 3px rgba(0,0,0, 0.2);	-moz-box-shadow: 0 0 3px rgba(0,0,0, 0.2); box-shadow: 0 0 3px rgba(0,0,0, 0.2);}

.boxshadow-2-bottoms {
	position: relative;
	padding: 15px;
/*	border: 1px solid #ddd;*/
}
.boxshadow-2-bottoms:before, .boxshadow-2-bottoms:after {
	content: " ";
	position: absolute;
	bottom: 16px;
	width: 50%;
	height: 20px;
	background: rgba(0,0,0,0.1);
	-webkit-border-radius: 50%;	-moz-border-radius: 50%;	border-radius: 50%;
	-webkit-box-shadow: 0 0 3px rgba(0,0,0, 0.4), 0 20px 10px rgba(0,0,0, 0.7);	-moz-box-shadow: 0 0 3px rgba(0,0,0, 0.4), 0 20px 10px rgba(0,0,0, 0.7);	box-shadow: 0 0 3px rgba(0,0,0, 0.4), 0 20px 10px rgba(0,0,0, 0.7);
	z-index: -10;
}
.boxshadow-2-bottoms:before {
	left: 0;
	-webkit-transform: rotate(-4deg); -moz-transform: rotate(-4deg); -ms-transform: rotate(-4deg); -o-transform: rotate(-4deg); transform: rotate(-4deg);
}
.boxshadow-2-bottoms:after {
	right: 0;
	-webkit-transform: rotate(4deg); -moz-transform: rotate(4deg); -ms-transform: rotate(4deg); -o-transform: rotate(4deg);	transform: rotate(4deg);
}

/*.border5-0, .img-border5-0 img, .map-border5-0 .geolocation-map {border: 5px solid rgb(237, 237, 242);}*/
/*.border5-1, .img-border5-1 img, .map-border5-1 .geolocation-map {border: 5px solid rgb(237, 237, 242); -webkit-border-radius: 15px;	-moz-border-radius: 15px; border-radius: 15px;}*/
div.sep-top {border-top: 1px solid rgba(128, 128, 128, 0.15);margin-top: 10px;padding-top: 10px;}


/*** style component class ***/
.article-page {
	border: 3px solid ghostwhite;
	padding: 30px;
	box-shadow: 2px 2px 10px;
}
.count-circle {
	position: absolute;
	border-radius: 50%;
	font-size: 9px;
}
.title-shadow-white {
	text-shadow: 0 2px 2px #000;
	color: ghostwhite;
	font-family: sans-serif;
}

/**************************************/
/*.p-info-table information table list*/
.p-info-table tr {
	border: 1px dotted transparent;
	border-bottom: 1px dotted darkgoldenrod;
}
.p-info-table tr:hover {
	background-color: rgba(255, 235, 205, 0.25);
	border: 1px dotted darkgoldenrod;
}
.p-info-table td {
	padding: 10px 5px;
	vertical-align: top;
}
.p-info-table td.p-cell-1 {
	width: 190px;
}
.p-info-table td span {
	min-height: 1.2em; 
	line-height: 1.5em;
}
.p-info-table .p-info-t {
	font-weight: 700;
}
.p-info-a {
/*	margin-left: 15px;*/
}
/* panel-1 */
.panel-1 {
	margin: 30px auto;
	max-width: 780px;
	background: rgba(248, 248, 248, 0.86);
	padding: 30px 30px 20px 30px;
	color: #2D2D2D;
	box-shadow: 2px 2px 8px black;
}
.panel-1 h2 {
	padding: 16px 40px;
	margin: -30px -30px 0 -30px;
	color: #FFF;
	background: rgba(0, 0, 0, 0.72);
	text-shadow: 1px 1px 1px #000;
	font-size: large;
}
.panel-1.green h2 {background: rgba(11, 148, 21, 1);}
.panel-1.orange h2 {background: rgba(240, 92, 8, 1);}
.panel-1.purple h2 {background: rgba(142, 58, 191, 1);}
.panel-1.red h2 {background: rgba(236, 22, 22, 1);}
.panel-1.blue h2 {background: rgba(31, 131, 220, 1);}
.panel-1.grey h2 {background: rgba(112, 112, 112, 1);}
.panel-1.grey .p-tab-active h2 {background: rgba(31, 131, 220, 1);}
.panel-1 h2 + div {padding-top: 15px} 
.panel-1.title-only {padding-bottom: 0;} 
.panel-1.sidebar h2{padding: 12px 24px; font-size:16px} 
.panel-1 .panel-footer {
	background-color: rgba(245, 245, 245, 0);
	border-top: 1px solid #EAEAEA;
	border-bottom-right-radius: 0;
	border-bottom-left-radius: 0;
}
.panel-1 img,.panel-1 .geolocation-map {border: 5px solid rgba(231, 233, 237, 0.7);}
.panel-1 input[type='submit'] {padding: 2px 10px;margin: 5px 10px 5px 0;}
.panel-1 form input[type='text'],.panel-1 form input[type='password'] {border: 1px solid gray;padding: 1px 3px;}
.panel-1 input[disabled='disabled'] {color: rgba(0, 0, 0, 0.36);}
.panel-1 .btn,.panel-1-att .btn {border-radius: 0px;}
.panel-1-att .btn-success {background-color: rgba(92, 184, 92, 0.6);} .panel-1 .btn-success:hover {background-color: rgba(92, 184, 92, 0.9);}
/*.panel-1 td {padding: 5px 10px;width: 100%;}*/
.panel-1 a.button {padding: 5px 10px; margin: 0 10px;} .panel-1 a.button:hover {text-decoration: none;}
.panel-1 label {display: inherit;}
.panel-1 select {padding: 3px 8px;font-size: 90%;}

/* panel-2 */
.panel-2 {max-width: 600px;border: 1px solid ghostwhite;padding: 1em 1.5em;background-color: rgba(248, 248, 255, 0.5);}
.panel-2.max1120 {max-width: 1120px;}
/* panel-3 */
.panel-3 {
	margin-top: 30px;
	max-width: 500px;
	background: rgba(0, 0, 0, 0.3);
	padding: 20px;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	box-shadow: 0px 1px 2px rgba(248, 248, 255, 0.6);
}
.panel-3 h2 {
	font-size: 24px;
	padding: 15px 30px;
	display: block;
	margin: -20px -20px 10px -20px;
	color: #FFF;
	background: rgba(115, 162, 42, 0.8);
	text-shadow: 1px 1px 1px #949494;
	border-radius: 3px 3px 0px 0px;
	-webkit-border-radius: 3px 3px 0px 0px;
	-moz-border-radius: 3px 3px 0px 0px;
	border-bottom: 1px solid #89AF4C;
}
.panel-3 h2>span {
    display: block;
    font-size: 13px;
    color: #FFF;
}
/* panel center icon*/
.panel-center-icon ul {text-align: center;}
.panel-center-icon ul li {text-align: center;display: inline-block;}

/* face-1 */
.face-1 {
	max-width: 200px;	border: 1px solid grey;	box-shadow: 1px 1px 3px;
	background: url("/images/bg/F2F1ED.png");
	background: url("/images/bg/news_bg1.png");
}
.face-1 h4 {background: rgba(0, 0, 0, 0.75);color: ghostwhite;display: block;padding: 15px;margin: 0;}
.face-1 h4 a {color: ghostwhite;font-size: 90%;}
.face-1 img {margin: 30px 0 20px;max-width: 130px;border-radius: 50%;border: 1px solid rgba(0,0,0,0);}
.face-1 img:hover {border: 1px solid rgba(0,0,0,0.2);}
.face-1 h6 {	display: block;	padding: 0 10px 20px;	font-weight: 400;}
.face-1 h5 {	display: block;	padding: 10px;	font-weight: 400;	background: rgba(184, 175, 156, 0.16);	font-size: 85%;}

/* shadow-1 */
.shadow-1 {
	position: absolute; /* make sure set parent position  */
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 10;
	opacity: 0.4;
	background: rgba(0, 255, 33, 0.5);
	border: 10px solid rgba(7, 108, 5, 0.7);
}

/* radio--1 */
.radio--1 {clear: both;position: relative;display: inline-block; margin: 5px 10px 0 0;}
.radio--1 ~ h3 {font-size: medium;border-top: 1px dashed rgba(128, 128, 128, 0.18);padding-top: 10px;}
.radio--1 input[type="radio"] {margin-left: -999px;position: absolute;}
.radio--1 .radio-label {
	border: 1px solid #d1d3d4;
	border-radius: 4px;
	min-width: 200px;
	padding-right: 1em;
	cursor: pointer;
	line-height: 2.5em;
	position: relative;
	text-indent: 3.25em;
	font-size: smaller;
}
.radio--1 .radio-label:before {
	position: absolute;
	display: block;
	top: 0;
	bottom: 0;
	left: 0;
	content: '';
	width: 2.5em;
	background: #D1D3D4;
	border-radius: 3px 0 0 3px;
}
.radio--1 input[type="radio"]:hover:not(:checked) ~ .radio-label:before {
	content:'\2714';
	text-indent: .9em;
	color: #C2C2C2;
}
.radio--1 input[type="radio"]:hover:not(:checked) ~ .radio-label {
	color: #888;
}
.radio--1 input[type="radio"]:checked ~ .radio-label:before {
	content:'\2714';
	text-indent: .9em;
	color: #9CE2AE;
	background-color: #4DCB6D;
}
.radio--1 input[type="radio"]:checked ~ .radio-label {
	color: #777;
}
.radio--1 input[type="radio"]:focus ~ .radio-label:before {
	box-shadow: 0 0 0 3px #999;
}

/* proposal-1 */
.proposal-1 label,.proposal-1 .grippie {display: none}
.proposal-1 label.showit {display: initial}
.proposal-1 #rules-form-wrapper:first-child {margin-top: initial;}
.proposal-1 input[type=submit] {margin-right: 1em;}
.not-logged-in .proposal-1 input[type=submit] {display: none}

/* btn-1 */
.btn-1 {-webkit-appearance: button; padding: 3px 6px;} .btn-1:hover {text-decoration: none;}
.btn-y-1 {background: rgba(228, 179, 26, 0.9);color: ghostwhite;border-radius: 1px;} 
.btn-y-1:hover {background: rgba(228, 179, 26, 0.75);color: white;}

/* showcase-1 */
.showcase-1 {margin: 5px; width: 200px;height: 120px;position: relative;}
.showcase-1 .input[type="radio"] {margin-left: -999px;position: absolute;}
.showcase-1 .border-top {height:10px; background-color: rgba(128, 128, 128, 0.5)}
.showcase-1 .radio-label {display:block; position:absolute; top:10px; left:0; right:0; bottom:0; color: ghostwhite; cursor: pointer;}
.showcase-1 .radio-label div{display:none; background: rgba(173, 173, 173, 0.5); margin: 40px auto;text-align: center; max-width: 120px ;padding: 3px;border: 2px solid ghostwhite;border-radius: 20%;}
.showcase-1 .radio-checked {display:none; background: rgba(173, 173, 173, 0.5);text-align: center;position: absolute;top: 10px;left: 0;bottom: 0;right: 0;}
.showcase-1 .radio-checked:before {content:'\2714'; font-size:2em; color: rgb(2, 250, 2);margin: 25px auto;display: inline-block;padding: 5px;border: 2px dotted yellow;border-radius: 50%;width: 60px;height: 60px;}
.showcase-1 input[type="radio"]:checked ~ .radio-checked  {display:block;}
.showcase-1 input[type="radio"]:checked ~ .border-top  {background-color: rgba(43, 214, 78, 0.5);}
.showcase-1:hover input[type="radio"]:not(:checked) ~ .radio-label div{display:block;}

/* paragraph-1 */
.paragraph-1,div.paragraph-1 p > * {display: inline-block}
.paragraph-1,div.paragraph-1 p > *:not(:last-child) {padding-right: 2em}

/* value control show */
[look] ._hide, [look=""] ._show{display:none}
[look=""] ._hide {display:inline-block}

/* hr */
hr.s1 {border-top: 1px dotted grey;}

.accordian-1 >:nth-child(odd) {background: rgba(255, 255, 255, 0.9);outline: none;}
.accordian-1 >:nth-child(even) {background: rgba(203, 203, 203, 0.6);}
.accordian-2 >:nth-child(odd) {background: none; outline: none; border: none;margin: 0; text-align: center; color: rgba(248, 248, 255, 0.7);}
.accordian-2 >:nth-child(even) {background: rgba(0, 0, 0, 0.2);; border: none;}

/* labels */
.label1 {
	color: white;
	border: white 1px solid;
	padding: 2px 5px 0px;
	background-color: #D79900;
	border-radius: 2px;
	box-shadow: gray 0px 1px 2px;
}
.label2 {
	font-size: 0.8em;
	color: #2CB19B;
	text-overflow: ellipsis;
	max-width: 260px;
	white-space: nowrap;
	overflow: hidden;
	vertical-align: middle;
}

.eps {text-overflow: ellipsis;overflow: hidden;white-space: nowrap;}

/* none class */
.empty-none:empty {display:none !important ;}


/***************************************/

/* misc class */
/* display control according to user info */
.list-style-none {list-style: none}
.not-logged-in .non-login-hidden, [r="0"] .non-login-hidden,.logged-in .login-hidden {display: none}
[sh="0"],[sh="false"] {display:none;}
.hover-show {opacity:0; transition:opacity 0.1s linear;} 
.hover-show-p:hover .hover-show {opacity:1; transition:opacity 0.5s linear;}
.hide-it,.active-element {display: none;}
.doc-ready-show {display: none;}

.nowraptxt {white-space: nowrap;text-overflow: ellipsis;overflow: hidden;}
.nowrap {white-space: nowrap;}


/* box */
.box0 {margin-top: 1.5em; padding-bottom: 1.5em;}
.box0 h2 {/*border-left: 6px solid #9E9E9E;padding-left: 20px;*/margin-top: 0;font-size: 24px;color: indianred;}
.box1 {border: 2px white solid;outline: 1px silver solid;}
.box2 {border-top: 1px silver solid;border-bottom: 1px silver solid;}
.box3 {padding-bottom: 1.5em;margin-bottom: 2em;border-bottom: 1px silver solid;}
.box3:last-child {padding-bottom: 1.5em;margin-bottom: 2em;border-bottom: none;}
/*.box2 .title-box .pane-title {text-align: center;margin: -15px -15px 0 -15px;background-color: green;padding: 8px;color: white;border-bottom: silver;}*/
.box4 {border-top: 5px solid silver;; border-bottom: 5px solid silver; padding: 2px 0.5em;background-color: white;}
.box4>div {border-bottom: 1px solid silver;line-height: 2.5em;}
.box4>div:last-child {border-bottom: none;}

/* highlight */
.highlight1 {color: black;text-shadow: silver 1px 1px 1px;margin-bottom: 10px;}
.highlight2 {background-color: gold;border: 2px solid rgba(255, 165, 0, 0.25);color: black;}
.yes {color: green;}
.no {color: red;}
.hover-highlight-outline:hover {outline: 2px solid #FFC107;outline-offset: 3px;cursor: pointer;}
.active-highlight-outline.active {outline: 2px solid indianred;outline-offset: 3px;cursor: pointer;}

/* arrow */
.arrow {width: 0;border-left: 3px solid transparent;border-right: 3px solid transparent;border-top: 4px solid white;margin: auto;display: block;}

/* tab button */
.tab-buttonset {list-style: none; color: gray;}
.tab-buttonset>* {display: inline-block; padding: 3px 8px 1px;background-color: rgb(221, 221, 221);
background-image: -webkit-linear-gradient(top,rgb(221, 221, 221),white);
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
text-overflow: ellipsis;
border: 1px solid transparent;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
color: gray;
text-shadow: white 0px 1px;
outline: 1px #591e12 solid;
}
.tab-buttonset>*.p-tab-active{background-color: gold;background-image: -webkit-linear-gradient(top,gold,#FFE244);color:black;}
.tab-buttonset>*:first-child {border-radius: 2px 0 0 2px;}
.tab-buttonset>*:last-child {border-radius: 0 2px 2px 0;}

/* pointer-events */
.noevent {pointer-events: none;}
.autoevent {pointer-events: auto;}
.p-tab-active {pointer-events: none;}

/* style radio input as tabs */
.radio-tab .form-item, .radio-tab ul {display: block; margin: 0; padding: 0;}
.radio-tab ul {border-top: 2px solid orange;border-bottom: 1px solid orange;line-height: 3em;width: 100%;}
.radio-tab ul > li {margin: 0 !important;padding: 0 !important;width: 50%;box-sizing: border-box;display: inline-block;}
.radio-tab ul > li:not(:first-child) {border-left: 1px solid orange;}
.radio-tab input {display:none !important;}
.radio-tab label:not(.option) {display: none;}
.radio-tab li input + label.option {display: block;line-height: 3em;padding: 0 3em;cursor: pointer;background-repeat: no-repeat; background-position: 5px;}
.radio-tab input:checked + label {background: antiquewhite;}

/* return to top button */
.return2top {position: fixed;right: 1em;bottom: 1em;z-index: 10000;display: none;}
.return2top > a {display: block; line-height: 24px;text-align: center; height: 2em;width: 2em;border: 2px solid rgba(192, 192, 192, 0.4);border-radius: 4px;rgba(255, 255, 255, 0.5);font: normal normal normal 14px/1 FontAwesome;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;color: rgba(192, 192, 192, 0.4);-webkit-transition: 1s;-moz-transition: 1s;transition: 1s}
.return2top > a:hover {text-decoration: none;}
.return2top > a > div {line-height: 24px;}
.return2top > a > div:before {content: "\f077";}

.playVideo, .pauseVideo {cursor: pointer;}
.playVideo .play {border-top: 10px solid transparent;border-bottom: 10px solid transparent;border-left: 18px solid white;}
.pauseVideo .pause {border-left: 3px solid white;border-right: 3px solid white;width: 10px;height: 20px;}
.playVideo .pause, .pauseVideo .play {display: none;}


.phone-show {
	display: none;
}

/* Tools: onoff checkbox */
.onoff-checkbox > label.option {margin: 5px 0; display: inline-block;}
.onoff-checkbox > input {display: none;}
.onoff-switcher {position: relative; min-width: 90px; -webkit-user-select:none; -moz-user-select:none; -ms-user-select: none;display: inline-block; overflow: hidden; cursor: pointer; border: 2px solid #999999; border-radius: 20px;vertical-align: middle;margin-right: 1em;}
.onoffswitch-inner {display: block; width: 200%; margin-left: -100%;transition: margin 0.3s ease-in 0s;}
.onoffswitch-inner:before, .onoffswitch-inner:after {display: block; float: left; width: 50%; height: 30px; padding: 0; line-height: 30px;font-size: 14px; color: white; box-sizing: border-box;}
.onoffswitch-inner:before {content: attr(data-on);padding-left: 10px;background-color: green; color: white;}
.onoffswitch-inner:after {content: attr(data-off);padding-right: 10px;background-color: #EEEEEE; color: #999999;text-align: right;}
.onoffswitch-switch {display: block; width: 18px; margin: 6px;background: #FFFFFF;position: absolute; top: 0; bottom: 0;right: 56px;border: 2px solid #999999; border-radius: 20px;transition: all 0.3s ease-in 0s; }
.onoff-checkbox > input:checked + label .onoffswitch-inner {margin-left: 0;}
.onoff-checkbox > input:checked + label .onoffswitch-switch {right: 0px; }
.onoff-checkbox > input[on="1"] + label .onoffswitch-inner:after, .onoff-checkbox > input[on="0"] + label .onoffswitch-inner:before {background-color: orange; color: white;}

div#preload {margin: auto;position: fixed;width: 100%;height: 100%;background-color: #fff;z-index: 9999999;display: flex;
align-items: center;justify-content: center;}
.cssload-loader-style-1{position: absolute;left: 0;right: 0;margin: auto;width: 65px;height: 65px;border-radius: 50%;}
.cssload-loader-style-1 .cssload-inner {position: absolute;width: 100%; height: 100%; box-sizing: border-box; border-radius: 50%;}
.cssload-loader-style-1 .cssload-inner.cssload-one {left: 0;top: 0;animation: cssload-rotate-one 1.15s linear infinite;-o-animation: cssload-rotate-one 1.15s linear infinite;-ms-animation: cssload-rotate-one 1.15s linear infinite;-webkit-animation: cssload-rotate-one 1.15s linear infinite;-moz-animation: cssload-rotate-one 1.15s linear infinite;border-bottom: 3px solid #000;border-bottom-color: #ffb606;}
.cssload-loader-style-1 .cssload-inner.cssload-two {right: 0;top: 0;animation: cssload-rotate-two 1.15s linear infinite;-o-animation: cssload-rotate-two 1.15s linear infinite;-ms-animation: cssload-rotate-two 1.15s linear infinite;-webkit-animation: cssload-rotate-two 1.15s linear infinite;-moz-animation: cssload-rotate-two 1.15s linear infinite;border-right: 3px solid #000;border-right-color: #8BC34A;}
.cssload-loader-style-1 .cssload-inner.cssload-three {right: 0;bottom: 0;animation: cssload-rotate-three 1.15s linear infinite;-o-animation: cssload-rotate-three 1.15s linear infinite;-ms-animation: cssload-rotate-three 1.15s linear infinite;-webkit-animation: cssload-rotate-three 1.15s linear infinite;-moz-animation: cssload-rotate-three 1.15s linear infinite;border-top: 3px solid #000;border-top-color: #2196F3;}


/* keyframes */
@keyframes cssload-rotate-one {
    from {transform: rotateX(35deg) rotateY(-45deg) rotateZ(0);}
    to {transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg);}
}
@keyframes cssload-rotate-two {
    from {transform: rotateX(50deg) rotateY(10deg) rotateZ(0);}
    to {transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg);}
}
@keyframes cssload-rotate-three {
    from {transform: rotateX(35deg) rotateY(55deg) rotateZ(0);}
    to {transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg);}
}

@media (max-width: 934px) {
	.flex-sidebar .icon-1 {display: none;}
}
@media (max-width: 800px) {
	.flex-sidebar .icon-1 {display: inline-block;}
	.flex-sidebar .icon-1 ~ * {display: none;}
	.flex-sidebar > div {width: 72px;}
	.box0 {border: none; margin: 20px 20px;}
	.box0 h2 {border: none;background-color: grey;padding-left: 30px;color: white;font-size: 24px;font-weight: 100;min-height: 40px;line-height: 40px;}
	.box0 h2 + * {margin: 15px 30px;}
}
@media (max-width: 776px) {
	.flex-sidebar {display: flex;flex-wrap: wrap; justify-content: space-between;}
	.flex-sidebar .icon-1 ~ * {display: inline-block;}
	.flex-sidebar > div {width: inherit;}
	.flex-sidebar .panel-1 {margin: 0 auto;}
	.flex-sidebar .panel-1.sidebar h2 {padding: 8px 20px; font-size: 14px;}
}
@media (max-width: 576px) {
	.flex-sidebar .icon-1 ~ * {display: none;}
	.flex-sidebar > div {width: 72px;}
}
@media (max-width: 790px) {
	.phone-hidden {display: none;}
	.phone-show {display: inherit;}
	.sidemargin10-m {margin-left: 1px; margin-right: 1px;}
	.height-2-5em {height: auto;}
}

@media (max-width: 550px) {
	.inline-block-300-66, .inline-block--30 {display: block; width: 100%;}
	.panel-3 {box-shadow:none}
}



/***************************************/
/* admin use */
/* json pretty print */
pre.jsonprint { background-color: ghostwhite; border: 1px solid silver; padding: 10px 20px; margin: 20px;}
.jsonprint .json-key {color: brown;} .jsonprint .json-value {color: navy;} .jsonprint .json-string {color: olive;}



/* fix rtl css */
/* jQuery mobile rtl css fix */
html[dir="rtl"] .ui-collapsible-heading a{text-align:right}
html[dir="rtl"] .ui-checkbox .ui-btn,html[dir="rtl"] .ui-radio .ui-btn{text-align:right}
html[dir="rtl"] .ui-li,html[dir="rtl"] .ui-li.ui-field-contain{text-align:right}
html[dir="rtl"] .ui-block-a,html[dir="rtl"] .ui-block-b,html[dir="rtl"] .ui-block-c,html[dir="rtl"] .ui-block-d,html[dir="rtl"] .ui-block-e{float:right}
html[dir="rtl"] .ui-grid-solo .ui-block-a {float:right}
html[dir="rtl"] .ui-navbar-collapsed ul {float:right}
html[dir="rtl"] .ui-navbar-collapsed .ui-navbar-toggle{float:right}
html[dir="rtl"] .ui-controlgroup-horizontal .ui-checkbox,html[dir="rtl"] .ui-controlgroup-horizontal .ui-radio {float:right}
html[dir="rtl"] .ui-li-thumb,html[dir="rtl"] .ui-listview .ui-li-icon,html[dir="rtl"] .ui-li-content {float:right}
html[dir="rtl"] .ui-li-thumb,html[dir="rtl"] .ui-listview .ui-li-icon {right: 1px; left:auto; max-height: 80px; max-width: 80px; position: absolute;  top: 0;}
html[dir="rtl"] .ui-li-aside {float:left;text-align:left}
html[dir="rtl"] .ui-btn-icon-left .ui-icon { right: 10px;left:auto}
html[dir="rtl"] .ui-btn-icon-right .ui-icon { left: 10px;right:auto;}
html[dir="rtl"] .ui-li-has-count .ui-btn-text{padding-left:15px;padding-right:auto}
html[dir="rtl"] .ui-collapsible-heading .ui-btn-icon-top .ui-btn-inner,html[dir="rtl"] .ui-collapsible-heading .ui-btn-icon-bottom .ui-btn-inner{padding-left:40px;text-align:center;padding-right:auto}
html[dir="rtl"] .ui-collapsible-heading .ui-btn-icon-right .ui-btn-inner{padding-left:40px;padding-right:12px}
html[dir="rtl"] .ui-checkbox .ui-btn-icon-left .ui-btn-inner,html[dir="rtl"] .ui-radio .ui-btn-icon-left .ui-btn-inner{padding-right:45px;padding-left:auto}
html[dir="rtl"] .ui-checkbox .ui-mini.ui-btn-icon-left .ui-btn-inner,html[dir="rtl"] .ui-radio .ui-mini.ui-btn-icon-left .ui-btn-inner{padding-right:36px;padding-left:auto}
html[dir="rtl"] .ui-li-has-thumb .ui-btn-inner a.ui-link-inherit,html[dir="rtl"] .ui-li-static.ui-li-has-thumb{min-height:60px;padding-right:100px;padding-left:auto}
html[dir="rtl"] .ui-li-has-icon .ui-btn-inner a.ui-link-inherit,html[dir="rtl"] .ui-li-static.ui-li-has-icon{min-height:20px;padding-right:40px;padding-left:auto}
html[dir="rtl"] .ui-li-has-thumb .ui-btn-inner a.ui-link-inherit,html[dir="rtl"] .ui-li-static.ui-li-has-thumb {padding-left:0px}
html[dir="rtl"] .ui-header .ui-btn-left,html[dir="rtl"] .ui-footer .ui-btn-left { right: 5px;left:auto }
html[dir="rtl"] .ui-header .ui-btn-right,html[dir="rtl"] .ui-footer .ui-btn-right { left: 5px; right:auto}
html[dir="rtl"] .ui-btn-icon-left .ui-btn-inner { padding-right: 40px; padding-left: auto }
html[dir="rtl"] .ui-btn-icon-right .ui-btn-inner { padding-left: 40px; padding-right: auto }
html[dir="rtl"] .ui-header .ui-btn-icon-left .ui-btn-inner,html[dir="rtl"] .ui-footer .ui-btn-icon-left .ui-btn-inner,html[dir="rtl"] .ui-mini .ui-btn-icon-left .ui-btn-inner { padding-right: 30px; padding-left:auto }
html[dir="rtl"] .ui-header .ui-btn-icon-right .ui-btn-inner,html[dir="rtl"] .ui-footer .ui-btn-icon-right .ui-btn-inner,html[dir="rtl"] .ui-mini .ui-btn-icon-right .ui-btn-inner { padding-left: 30px; padding-right:auto }
html[dir="rtl"] .ui-header .ui-btn-icon-left .ui-icon,html[dir="rtl"] .ui-footer .ui-btn-icon-left .ui-icon,html[dir="rtl"] .ui-mini.ui-btn-icon-left .ui-icon,html[dir="rtl"] .ui-mini .ui-btn-icon-left .ui-icon { right: 5px; left:auto }
html[dir="rtl"] .ui-header .ui-btn-icon-right .ui-icon,html[dir="rtl"] .ui-footer .ui-btn-icon-right .ui-icon,html[dir="rtl"] .ui-mini.ui-btn-icon-right .ui-icon,html[dir="rtl"] .ui-mini .ui-btn-icon-right .ui-icon { left: 5px; right: auto }