/* html reset */
html, body, ul, li, ol, dl, dd, dt, p, h1, h2, h3, h4, h5, h6, form, fieldset, legend, img { margin: 0; padding: 0; }
fieldset, img { border: none; display: block; }
ul, li, ol, dl, dt, dd { list-style: none; }
input, textarea { outline-style: none; font-size: 12px; font-family: Arial,Microsoft YaHei; }
textarea { resize: none; }
a { text-decoration: none; cursor: pointer; }
body { color: #333333; font-size: 14px; font-family: Arial,Microsoft YaHei; background: #f3f3f3; }

/*
熙和网络色值说明
|-- 主色（使用较为安全的蓝色作为主色调，其中 Light Primary 常用于 hover，Dark Primary 常用于 active）
	|-- Middle Blue           #2d8cf0
	|-- Light Blue            #5cadff
	|-- Dark Blue             #2b85e4
|-- 辅助色（常用于信息提示，比如成功、警告和失败）
	|-- Blue                  #2db7f5               Info
	|-- Green                 #19be6b               Success
	|-- Orange                #ff9900               Warning
	|-- Red                   #ed4014               Error
|-- 中性色（Black And White | 常用于文本、背景、边框、阴影等，可以体现出页面的层次结构）
	|-- BW1                   #17233d               标题 Title
	|-- BW2                   #515a6e               正文 Content
	|-- BW3                   #808695               辅助/图标 Sub Color
	|-- BW4                   #c5c8ce               失效 Disabled
	|-- BW5                   #dcdee2               边框 Border
	|-- BW6                   #f4f5f7               背景 Background
	|-- BW7                   #ffffff               背景 Background
*/

/* background color */
.bgMB { background-color: #2d8cf0 !important; }            /* Middle Blue */
.bgLB { background-color: #5cadff !important; }            /* Light Blue */
.bgDB { background-color: #2b85e4 !important; }            /* Dark Blue */

.bgB { background-color: #2d8cf0 !important; }             /* Blue */
.bgG { background-color: #19be6b !important; }             /* Green */
.bgO { background-color: #ff9900 !important; }             /* Orange*/
.bgR { background-color: #ed4014 !important; }             /* Red */

.bgBW1 { background-color: #17233d !important; }
.bgBW2 { background-color: #515a6e !important; }
.bgBW3 { background-color: #808695 !important; }
.bgBW4 { background-color: #c5c8ce !important; }
.bgBW5 { background-color: #dcdee2 !important; }
.bgBW6 { background-color: #f4f5f7 !important; }
.bgBW7 { background-color: #ffffff !important; }

/* color */
.clMB { color: #2d8cf0 !important; }                       /* Middle Blue */
.clLB { color: #5cadff !important; }                       /* Light Blue */
.clDB { color: #2b85e4 !important; }                       /* Dark Blue */

.clB { color: #2d8cf0 !important; }                        /* Blue */
.clG { color: #19be6b !important; }                        /* Green */
.clO { color: #ff9900 !important; }                        /* Orange*/
.clR { color: #ed4014 !important; }                        /* Red */

.clBW1 { color: #17233d !important; }
.clBW2 { color: #515a6e !important; }
.clBW3 { color: #808695 !important; }
.clBW4 { color: #c5c8ce !important; }
.clBW5 { color: #dcdee2 !important; }
.clBW6 { color: #f4f5f7 !important; }
.clBW7 { color: #ffffff !important; }

/* layout-布局 */
.xhRow { display: flex; flex-wrap: wrap; }
.xhCol1 { width: 8.333333%; }
.xhCol2 { width: 16.666667%; }
.xhCol3 { width: 25%; }
.xhCol4 { width: 33.333333%; }
.xhCol5 { width: 41.666667%; }
.xhCol6 { width: 50%; }
.xhCol7 { width: 58.333333%; }
.xhCol8 { width: 66.666667%; }
.xhCol9 { width: 75%; }
.xhCol10 { width: 83.333333%; }
.xhCol11 { width: 91.666667%; }
.xhCol12 { width: 100%; }

/* text align */
.tac { text-align: center; }
.tar { text-align: right; }
.tal { text-align: left; }

.hd { width: 0px; height: 0px; overflow: hidden; }

.fl { float: left; }
.fr { float: right; }
.clearfix:after { content: "."; display: block; height: 0; visibility: hidden; clear: both; }
.clearfix { zoom: 1; }
.clear { clear: both; height: 0; margin: 0; padding: 0; font-size: 0; overflow: hidden; }