@charset "utf-8";
/**初始化**/
body,h1,h2,h3,p,ul,li,img,figure,figcaption {   /*去边框*/
	margin: 0px;
	padding: 0px;
}
body{  /*字体样式*/
	background-color: #000;
	letter-spacing: 1.2px;
	font-family: "Helvetica Neue", Helvetica, Arial,"微软雅黑","Microsoft Yahei","Microsoft Yahei UI", SimHei, "\5B8B\4F53", simsun, sans-serif;
}
ul,ol{  /*去列表样式*/
	list-style: none outside none;
}
a{ /*去下划线*/
	text-decoration: none;
}
img { /*图片流体布局*/
	display: block;
	max-width: 100%;
}
div,li{  /*border，padding不扩充宽高*/
	box-sizing:border-box;
}
.clearfix::after{  /*清理浮动div*/
	content: "hackmm.com";
	display: block;
	height: 0;
	visibility: hidden;
	clear: both;
}

/**导航**/
#nav {
	background-color: #000;
	width: 100%;
	height: 90px;
	box-shadow: 0px 1px 4px rgb(229,229,229);
	position: fixed;
	top: 0;
	z-index: 9999;
}
/**导航栏宽度**/
#nav .nav-container{
	max-width: 90%;
	margin: 0 auto;
}
/**logo宽高，位置**/
#nav  .nav-logo{
	width: 254px;
	height: 90px;
	/**margin-top: 5px;**/
	background-image: url("../logo/logo.png") ;
	background-repeat: no-repeat;
	text-indent: -9999px;
	float: left;
}
#nav .nav-site-description{
	border-left: 2px solid #7e7d7d;
	height: 45px;
	line-height: 45px;
	margin:30px 0 0 20px;
	padding-left: 20px; 
	font-size: 24px;
	letter-spacing: 1.2px;
	color: #dedede;
	font-weight: bold;
	text-shadow: 1px 1px 0.5px #0C0C0C;
	float: left;
}
#nav .nav-links{
	float: right;
	font-size: 22px;
}
#nav .nav-links li{
	float: left;
}
/**导航按钮宽高**/
#nav .nav-links a{
	display: inline-block;
	height: 90px;
	width: 200px;
}
#nav .nav-links .link-word{
	display: block; 
	text-align: center;
	line-height: 90px;
	color: #e7e7e7;
	text-shadow:1px 1px 1px gray ;
	letter-spacing: 2px;
}
/**导航，动态效果，蒙版+下划线**/
/**当鼠标移动到导航标时，触发**/
/**当鼠标点击后，在跳转的页面导航标签上添加active类，这样这个导航标签就会被选中**/
#nav .nav-links li:hover,
#nav .nav-links .active{
	border-bottom: 1.2px solid rgb(4,181,150);
	background-color: #222;
}
/**导航，当鼠标移上去后，字体放大**/
#nav .nav-links .link-word:hover{
	color: rgb(4,181,150);
	font-size: 23px;
}
#nav .link-img{
	display: inline-block;
	vertical-align: middle; 
	margin-right: 5px;
}


/**媒体查询，响应式布局**/
/*当页面大于1200px时，PC大屏*/
@media (min-width: 1200px) {

}
/*在992和1199像素之间，PC小屏*/
@media (min-width: 992px) and (max-width: 1199px) {
	#nav  .nav-logo{
		margin-left: 1px;
	}
 	#nav .word-hidden{
 		display: none;
 	}
 	#nav .nav-links a {
		width: 82px;
	}
}
/*在768和991像素之间，PAD端*/
@media (min-width: 768px) and (max-width: 991px) {
	#nav  .nav-logo{
		margin-left: 1px;
	}
	#nav .nav-links a {
		width: 75px;
	}
	#nav .desc-hidden,
	#nav .word-hidden{
 		display: none;
 	}
}
/*在480和767像素之间，高分辨率手机端*/
@media (min-width: 480px) and (max-width: 767px) {
	#nav  .nav-logo{
		margin-left: 1px;
	}
	#nav .nav-links a {
		width: 75px;
	}
	#nav .desc-hidden,
	#nav .word-hidden,
	#nav .li-hidden{
 		display: none;
 	}
}
/*小于480像素的屏幕，低分辨率手机端*/
@media (max-width: 479px) {
	#nav  .nav-logo{
		margin-left: 1px;
	}
	#nav .nav-links a {
		width: 65px;
	}
	#nav .desc-hidden,
	#nav .word-hidden,
	#nav .li-hidden{
 		display: none;
 	}
}

/**页尾**/
#footer { 
	width: 100%;
	height: 45px;
	line-height: 45px;
	text-align: center;
	font-size: 15px;
	color: #999;
	background-color:#000;
	border-top: 1px solid #666;
	margin-top: 10px;
}
#footer .footer-container{
	max-width: 1263px;
	margin: 0 auto;
}
#footer img{
	display: inline-block;
	vertical-align: middle;
}


