html,body,h1,h2,h3{padding: 0;margin: 0}
a{text-decoration:none;}
a:hover{color: red;}
html{background-color: #FDFCF8}
body{width: 80%;margin: 0 auto;}
header{overflow: hidden;padding-bottom: 20px;padding-top: 10px;}
header ul{padding:0;margin:0;}
header ul li{padding:0;margin:0;}
header .logo{line-height: 80px;font-size: 40px;font-weight: 800;padding-left: 20px;}
header .logo a{display:  block;}
header .logo span{color: black;}
header .logo .one{color: #BD2D30}
header ul li{display: block;float: left;background-color: #E8E7E3}
header ul li a{color: #848482;display: block;float: left;padding: 10px 30px;font-size: 18px;}
header ul li a:hover{background-color: #3F3F3F;color: #9F9F9C;}

section{overflow: hidden;background: #FCFDF8;}

section>div{float: left;}
section .left_nav{width: 20%;border:1px solid #E8E7E3;padding-bottom: 10px;}
section .left_nav ul{padding:0;margin:0;}
section .left_nav ul li{padding:0;margin:0;}
section .left_nav ul{padding-top: 10px;}
section .left_nav ul h3{font-size: 14px;padding-left: 5px;padding-bottom: 5px;}
/*section .left_nav ul li{padding: 3px 0;}*/
section .left_nav ul li a{line-height: 24px;font-size: 12px;padding-left: 10px;display: block;color: black;}
section .left_nav ul li .currentLink{background-color:#BD2D30;color: white;}
section .left_nav ul li a:hover{background-color: #AAAAAA;color: white;}
section .left_nav h2{font-size: 16px;line-height: 38px;background-color: #E8E7E3;text-align: center;color: #777777;font-weight: 600;}

section .section{width: 60%;padding: 10px 20px;}
section .section .block{overflow: hidden;}
section .section .block h1{color: #3F3F3F;}
section .section .block span{padding: 0px 20px;font-size: 14px;color: #AAAAAA;border:2px solid #AAAAAA;}
section .section .block span:hover{border:2px solid #BD2D30;color: #BD2D30;}
section .section .block .pro{margin-right: 20px;}
section .section>div{border-bottom: 1px solid #AAAAAA;padding: 20px 0;}
section .section div{line-height: 36px;}
/*section .section div div{border:none;padding:0;line-height:24px;}*/
/*section .bs div div{border:auto;}*/


section .section div .w3-example{padding: 8px 20px;margin: 24px -20px;box-shadow:none;background-color:#E7E9EB;border-radius:5px;}
section .section div .w3-code{font-size:15px;border-left:4px solid #04AA6D;margin-top:16px;margin-bottom:16px;padding:8px 12px;}
section .section div .w3-black{color:#fff;background-color:#000;}
section .section div .w3-padding{padding:8px 12px;}
section .section div .w3-codespan{color:crimson;background-color:#f1f1f1;padding-left:4px;padding-right:4px;font-size:110%}

section .section div pre{padding: 20px;border:1px solid #DDDDDD;background-color: #fffefc;white-space: pre-wrap;word-wrap: break-word;line-height:24px;font-weight:600;}
section .section div .notranslate pre{color:#fff;background-color:#000;border:none;padding:0;margin:0;white-space: pre-wrap;word-wrap: break-word; }

section .section table{}
section .section table thead tr:first-child{background-color: #3F3F3F;color: white;margin: 0;}
section .section table tr:nth-child(2n){background-color: #F3F3F3;}
section .section table tr td{margin: 0;border:1px solid #AAAAAA;padding: 0;border-collapse: separate;border-spacing:0;}
section .section table tr td a{text-indent: 6px;display:block; }

section .section ul li{margin:auto;}
section .bs ul li{margin:0;}
section .bs h2{line-height:80px;}

section .section img{display:block;max-width:800px;}
table.browsersupport td {
	padding: 0;
	height: 86px;
	width:86px;
	vertical-align: middle;
	background:#fdfcf8 no-repeat center;
	border:1px solid #ddd;
	color: black;
}
table.browsersupport td
	{
		text-align:center;
	}
section table .bsIE {
	background-image: url('/ui2017/compatible_ie.png');
}

section table .bsFirefox {
	background-image: url('/ui2017/compatible_firefox.png');
}

section table .bsChrome {
	background-image: url('/ui2017/compatible_chrome.png');
}

section table .bsSafari {
	background-image: url('/ui2017/compatible_safari.png');
}

section table .bsOpera {
	background-image: url('/ui2017/compatible_opera.png');
}

section table .bsNoIE {
	background-image: url('/ui2017/incompatible_ie.png');
}

section table .bsNoFirefox {
	background-image: url('/ui2017/incompatible_firefox.png');
}

section table .bsNoChrome {
	background-image: url('/ui2017/incompatible_chrome.png');
}

section table .bsNoSafari {
	background-image: url('/ui2017/incompatible_safari.png');
}

section table .bsNoOpera {
	background-image: url('/ui2017/incompatible_opera.png');
}

section .right{width: 20%;}

footer{background-color: #E8E7E3;font-size: 12px;line-height: 50px}
footer div{text-align: center;padding: 0 20px;}

.news .section .block{overflow:hidden}
.news .section .block .img{display:block;float: left;width:200px;height:100px;padding-right:10px;}
.news .section .block .img img{width:100%;height:100px;}
.news .section .block h2{padding-top:10px;}
.news .section .block .samlltext{border-bottom: none;padding:0;line-height:24px;}

div.css-100 {
width: 100%;
line-height: 80px;
text-align: center;
color: white;
border: 10px solid;
box-sizing: border-box;
font-size:120%;
font-weight:bold;
font-family:Consolas, 'Courier New', Courier, monospace;
}
div.css-50 {
float: left;
width: 50%;
line-height: 80px;
text-align: center;
color: white;
border: 10px solid #fdfcf8;
box-sizing: border-box;
font-size:120%;
font-weight:bold;
font-family:Consolas, 'Courier New', Courier, monospace;
}

#hslresulttext{margin:0;}
#hslresult{margin:0;padding:0;}


code{color:red;}
/*.newstext img{width:100%}*/

@media screen and (min-width: 320px) and (max-width: 1156px){
body{width:99%;}  
section .left_nav{width: 100%;}  
section .section{width: 90%;}   

section .left_nav ul{display:none}
/*#nav_hover:hover+#nav2, #nav2:hover{display: block;} 鼠标指向元素后，改变display属性的值*/
section .left_nav{display:none;}
nav{display:none;}
.pro{display:none;}
.next{display:none;}
}
@media screen and (min-width: 320px) and (max-width: 739px){
/*section .section .block span{display:block;}*/
.news .section .block .img{display:block;float: none;width:100%;height:auto;}
.news .section .block h2{padding-top:0px;}
.newstext img{width:100%}
.left_nav{display:none;}
}