:target:before {

content:"";

display:block;

height:90px; /* fixed header height*/

margin:-90px 0 0; /* negative fixed header height */

}

html {

 

}

html, body {

      margin: 0;

      padding: 0;

      width: 100%;

	  overflow-y: scroll; /* has to be scroll, not auto */

	  -webkit-overflow-scrolling: touch;

	  width: auto!important; 

	  overflow-x: hidden!important;

}



body {

      font-family: "Microsoft YaHei",sans-serif;

      font-weight: lighter;

}

p {

	font-size: 16px;

		

}

#pop_up 

{

	font-size: 60px;

	color: #0F0;

}





a {

      text-decoration: none;

      color: #fff;

      font-size: 16px;

}



.animation_delay

{

	animation-delay: 1s;

}



.content {

      width: 94%;

      margin: 4em auto;

      font-size: 20px;

      line-height: 30px;

      text-align: justify;

}



.logo {

      line-height: 60px;

      position: fixed;

      float: left;

      margin: 16px 46px;

      color: #fff;

      font-weight: bold;

      font-size: 20px;

      letter-spacing: 2px;

}



nav {

      position: fixed;

      width: 100%;

      line-height: 60px;

}



nav ul {

      line-height: 60px;

      list-style: none;

      background: rgba(0, 0, 0, 0);

      overflow: hidden;

      color: #fff;

      padding: 0;

      text-align: right;

      margin: 0;

      padding-right: 40px;

      transition: 1s;

	  font-weight: bold;

	  

}



nav.black ul {

      background: #2e75b5;

	   font-weight: bold;

}



nav ul li {

      display: inline-block;

      padding: 16px 40px;;

}



nav ul li a {

      text-decoration: none;

      color: #fff;

      font-size: 16px;

}

nav ul:hover li:hover a:hover {

      text-decoration: none;

      color: #0CF;

      font-size: 16px;

}



.menu-icon {

      line-height: 60px;

      width: 100%;

      background: #2e75b5;

      text-align: right;

      box-sizing: border-box;

      padding: 15px 24px;

      cursor: pointer;

      color: #fff;

      display: none;

}



hr {

  height: 2px;

	width: 70px;

	text-align: center;

	position: relative;

	background:#010101;

	margin: 0;

	margin-bottom: 40px;

	border: 0;

}





.container {

  padding-top: 15px;

  padding-bottom: 15px;

  padding-right: 15px;

  padding-left: 15px;

  margin-right: auto;

  margin-left: auto;

}

.container h2{

	color:#4863A0;

 

}

.container h3{

	color:#4863A0;

 

}

.container a{

	color:#4863A0;

 

}

.about{

	

	 padding-top: 60px;

  padding-bottom: 60px;

	

	

}



.float_right

{

	width:96%;

	padding-left:2%;

	padding-right:2%;

	

	

}



.float_left h2,

.float_right h2

{

	text-align:center;



	

	

	

}

.float_left

{

	float:left;

	width:96%;

	padding-left:2%;

	padding-right:2%;

	

	

	

}

.float_left img

{

	float:left;

	width:100%;

	

}



/* Row3 */



.row-1

{

	text-align: center;

}

.row-3 h3

{

	text-align: center;

}

.a-right

{

	padding-right:5%;

	text-align: right;

}

.row-3-type2

{

	float:left;

	width:100%;

}

.row-3

{

	

	

	float:left;

	width:100%;

	

}

.row-2

{

	float:left;

	width:100%;

}

.hide-in-tablet

{

	display:none;

}

/* Form */

.form-control

{

	width:100%;

}

.form-group

{

	width:60%;

	padding-left:20%;

	padding-right:20%;

	

	position:relative;

}

.text-danger {

	width:60%;

	color: #cc0033;

	text-align: left;

}

ul{

	list-style: none;

	padding: 0;

	webkit-padding: 0;

	moz-padding: 0;

}

/* Form */

.button {

  background-color: #2e75b5;

  border: none;

  color: white;

  padding: 15px 32px;

  text-align: center;

  text-decoration: none;

  font-size: 16px;

 

  cursor: pointer;

}

.button:hover {

  background-color: #0CF;

 

}

#footer-bottom img

{

	height: 50px;

  	width: 50px;

}

#footer-bottom a

{

	 border: none;

}

/* index_top Section */

#index_top {

	 

  	

  	



}
.top_pc
{
	display:none;
	padding:0px;
	margin:0px;
	
}
.top_phone
{
	
	display:block;
}

#index_top .section-title {

	width: 100%;

	

    background: url(img/background/giphy_06.jpg) no-repeat 50% 50%;

    background-size: cover;

}

#index_top .section-title h2 {

	

	

	padding-top:90px;

	padding-right:5%;
	padding-left:10%;

	color: #4863A0;

	text-align: center;

	width:80%;

	float:left;

}

#index_top .section-title li {

	

	color: #fff;

	padding-right:5%;

	padding-left:23%;	

	text-align: left;

	padding-bottom:15px;

	width:80%;

	float:left;

	

}

/* index_top Section */



@media (min-width:601px)

{







	/* Row3 */

	.row-3

	{

		padding-right:0%;

		padding-left:0%;

		width:49%;

	}

	

	.row-2

	{

		width:50%;

	}

	

}

@media (min-width: 768px) {

 .container {

    width: 750px;

  }

  /* index_top Section */


.top_pc
{
	
	display:block;
}
.top_phone
{
	display:none;
	padding:0px;
	margin:0px;
}
#index_top .section-title h2 {

	

	

	padding-top:90px;

	padding-right:5%;

	color: #4863A0;

	text-align: left;

	width:35%;

	float:right;

}

#index_top .section-title li {

	

	color: #fff;

	padding-right:5%;

	padding-left:0%;	

	text-align: left;

	padding-bottom:15px;

	width:35%;

	float:right;

	

}

}

@media (min-width: 992px) {

  .container {

    width: 970px;

  }

}

@media (min-width: 1200px) {

  .container {

    width: 1170px;

  }

  	.hide-in-tablet

{

	display:block;

}

  .float_right

{

	width:48%;

	float:right;

	padding-left:2%;

	padding-right:0%;

	text-align:left;

	

	

}



.float_left

{

	width:48%;

	float:left;

	padding-left:0%;

	padding-right:2%;

	text-align:left;

	

}

	

/* Row3 */

	.row-3-type2

	{

		padding-right:0%;

		padding-left:0%;

		width:33.33333%

	}

	.row-3

	{

		padding-right:0%;

		padding-left:0%;

		width:33.33333%;

	}

	

	.row-2

	{

		width:50%;

	}

}







.section-title {

	width : 100%;

}

.section-title .overlay {

	padding: 80px 0;

	background: rgba(0, 0, 0, 0.7);

}

.footer-title {

	width : 100%;

}

.footer-title .overlay {

	padding: 10px 0;

	background: rgba(0, 0, 0, 0.7);

}



/* our_service Section */

#our_service {



}

#our_service .section-title {

	background: #444 url(img/background/giphy_08.gif) center center no-repeat;

	background-size: cover;

}

#our_service .section-title h2 {

	color: #fff;

	text-align: center;

	padding:30px;

}

#our_service .section-title p {

	color: #C4E4EC;

	text-align: center;

	padding-left:10%;

	padding-right:10%;

	padding-bottom:15px;

}

#our_service_deatail a

{

	color: #4863A0;

}

#our_service_deatail a:hover

{

	color: #099;

}



/* our_product Section */

#our_product {



}

#our_product .section-title {

	background: #444 url(img/background/giphy_08.gif) center center no-repeat;

	background-size: cover;

}

#our_product .section-title h2 {

	color: #fff;

	text-align: center;

	padding:30px;

}

#our_product .section-title p {

	color: #C4E4EC;

	padding-left:10%;

	padding-right:10%;

	text-align: center;

	padding-bottom:15px;

}





/* our_profolio Section */

#our_profolio {



}

#our_profolio .section-title {

	background: #444 url(img/background/giphy_08.gif) center center no-repeat;

	background-size: cover;

}

#our_profolio .section-title h2 {

	color: #fff;

	text-align: center;

	padding:30px;

}

#our_profolio .section-title p {

	color: #C4E4EC;

	padding-left:10%;

	padding-right:10%;

	text-align: center;

	padding-bottom:15px;

}



/* contact_us Section */

#contact_us {



}

#contact_us .section-title {

	background: #444 url(img/background/giphy_08.gif) center center no-repeat;

	background-size: cover;

}

#contact_us .section-title h2 {

	color: #fff;

	text-align: center;

	padding:30px;

}

#contact_us .section-title p {

	color: #C4E4EC;

	padding-left:10%;

	padding-right:10%;

	text-align: center;

	padding-bottom:15px;

}







/* contact_us Section */

#footer {



}

#footer .footer-title {

	background: #444 url(img/background/giphy_08.gif) center center no-repeat;

	background-size: cover;

}

#footer .footer-title h2 {

	color: #fff;

	text-align: center;

	padding:30px;

}

#footer .footer-title p {

	color: #C4E4EC;

	padding-left:10%;

	padding-right:10%;

	text-align: center;

	padding-bottom:15px;

	

}



#footer-bottom

{

	background-color:#2e75b5;

	color: #fff;

	padding-left:10%;

	padding-right:10%;

	text-align: center;

	padding:2px;

}















@media(max-width: 1030px) {





      .logo {

            position: fixed;

            top: 0;

            margin-top: 16px;

      }



      nav ul {

            max-height: 0px;

            background: #2e75b5;

      }



      nav.black ul {

            background: #2e75b5;

      }



      .showing {

            max-height: 34em;

      }



      nav ul li {

            box-sizing: border-box;

            width: 100%;

            padding: 24px;

            text-align: center;

      }



      .menu-icon {

            display: block;

      }



}







/*expand */

.w3-modal

{

	z-index:3;

	display:none;

	padding-top:100px;

	position:fixed;

	left:0;

	top:0;

	width:100%;

	height:100%;

	overflow:auto;

	background-color:rgb(0,0,0);

	background-color:rgba(0,0,0,0.4)

}

.w3-modal-content

{

	margin:auto;

	background-color:#fff;

	position:relative;

	padding:0;

	outline:0;

	width:600px

}





@media (max-width:600px)

{

	.w3-modal-content

	{

		margin:0 10px;

		width:auto!important

	}

	.w3-modal

	{

		padding-top:30px

	}



}

@media (max-width:768px)

{

	.w3-modal-content

	{

		width:500px

	}

	.w3-modal

	{

		padding-top:50px

	}

}

@media (min-width:993px)

{

	.w3-modal-content

	{

		width:900px

	}

	

}









.w3-display-topright

{

	position:absolute;

	right:0;

	top:0

}







.w3-animate-zoom 

{

	animation:animatezoom 0.6s

}

@keyframes animatezoom

{

	from

	{

		transform:scale(0)

	} 

	to

	{

		transform:scale(1)

	}

}









.w3-padding-64

{

	padding-top:64px!important;

	padding-bottom:64px!important

}



.w3-button:hover

{

	color:#000!important;

	background-color:#ccc!important

}

.w3-transparent,.w3-hover-none:hover

{

	background-color:transparent!important

}



/* Colors */



.w3-black,.w3-hover-black:hover

{

	color:#fff!important;

	background-color:#000!important

}



/*end of expand*/