@media screen and  (min-width:1px) and (max-width:800px)
{
    
    /*** General *******************/
    * {
	    -webkit-box-sizing: border-box;
	    -moz-box-sizing: border-box;
	    box-sizing: border-box;
    }
    .nav li {
	    list-style: none;
    }
    .nav a{
	    display:block;
	    text-decoration:none;
    }
    .nav i {
	    display:block;
    }
    .nav p, .nav a, .nav h3, .nav h4{
	    font-family:'exodemi_bold', Geneva, sans-serif;
    }
    .nav p, .nav h3, .nav h4, .one li a {
	    font-family:'titilliumregular', Palatino, Georgia, serif;
    }
    .nav a, .nav h3, .nav h4{
	    text-transform:uppercase;
    }
    .nav h3{
	    font-size:20px;
    }
    .nav h4{
	    font-size:18px;
    }
    .nav img{
	    padding:10px;
	
	    box-shadow: 1px 1px 4px rgba(102,102,102,.4);
	    -webkit-box-shadow: 1px 1px 4px rgba(102,102,102,.4);
	    -moz-box-shadow: 1px 1px 4px rgba(102,102,102,.4);
    }
    i.icon-chevron-right {
	    display: none;
	    visibility: hidden;
    }
    .one i.icon-spinner{
	    display:none;
    }

    /*** Start .nav  **************************/
    .nav {
	    width: 100%;
	    margin: 20px auto;
	
	    box-shadow: 1px 1px 4px 2px rgba(102,102,102,.2);
	    -webkit-box-shadow: 1px 1px 4px 2px rgba(102,102,102,.2);
	    -moz-box-shadow: 1px 1px 4px 2px rgba(102,102,102,.2);
    }
    .nav > li {
	    float:none;
	    overflow: hidden;
	    border-bottom:1px solid rgba(102,102,102,.5);
	    display: none;
    }
    .nav li a{
	    width:100%;
	    padding: 10px 20px;
    }
    .nav li label i.icon-chevron-down{
	    float:right;
	    font-size:14px;
    }
    .nav .logo{margin:20px;margin-left:20px;}
    /*** End .nav  *****************************/

    /*** Start .one ****************************/
    .one{
	    display: block;
	    padding: 0 10px;
	    overflow: hidden;
    }
    .one li{
	    border-bottom:1px solid rgba(51,51,51,.2);
    }
    .one li a{
	    width:100%;
	    height:100%;
	    padding:10px 20px;
	
	    font-size:14px;
    }
    /*** End .one ******************************/

    /*** Start #sub-menu ***********************/
    .one #sub-menu{
	    display: block;
	    padding: 0 10px;
	    overflow: hidden;
    }
    .one #sub-menu ul li{
	    border-bottom:1px solid rgba(153,153,153,.2);
    }
    .one #sub-menu li:last-child{
	    border-bottom:none;
    }
    /*** End #sub-menu ***********************/

    /*** Start #cover1 & #icon ****************/
    #icon{
	    display:none;
	    visibility:hidden;
    }
    #cover1{
	    padding:10px 40px;
	    font-size:15px;
	
	    transition:all .3s;
	    -webkit-transition:all .3s;
	    -moz-transition:all .3s;
	    -o-transition:all .3s;
	    -ms-transition:all .3s;
    }
    #cover1 a i{
	    float:right;
	    margin-right:15px;
    }
    /*** End #cover1 & #icon ***************/

    /*** Start Home *******************/
    #home {
	    overflow:hidden;
    }
    #home li {
	    height: 250px;
	    padding: 10px;
    }
    #home li img{
	    float:left;
	    margin:5px 12px 10px 5px;
    }
    #home li p{
	    padding: 5px 8px 8px 8px;
	
	    font-size:14px;
	    text-align:justify;
    }
    #home li p#p-first{
	    border-bottom:1px solid #FFFFFF;
	    margin-bottom:10px;
    }
    /*** End Home *******************/

    /*** Start links ***************/
    #links {
	    overflow:hidden;	
    }
    #links > li {
	    height: 255px;
	    padding: 10px;
    }
    #links li i {
	    font-size: 12px;
    }
    #links .link-block{
	    width: 29%;
	    float: left;
	    padding: 0 5px 30px 5px;
	    margin: 10px 0 0px 15px;
    }
    #links .link-block h4 {
	    margin:5px 0 10px 4px;
	    padding:1px 0 8px 7px;
	    border-bottom: 1px solid rgba(51,51,51,.2);
    }
    #links .link-block h4 i {
	    margin-right:10px;
	    font-size: 20px;
    }
    #links .link-block li{
	    height:22px;
	    border:none;
    }
    #links .link-block li a {
	    height:20px;
	    padding: 0 0 0 6px;
	
	    font-size: 12px;
	    text-transform:capitalize;
	
	    border:none;

	    transition: padding-left .3s;
	    -webkit-transition: padding-left .3s;
	    -moz-transition: padding-left .3s;
	    -o-transition: padding-left .3s;
	    -ms-transition: padding-left .3s;
    }
    #links .link-block li:hover a {
	    padding-left: 14px;
    }
    /*** End links *******************/

    /*** Start About *******************/
    #about {
	    overflow:hidden;
    }
    #about li {
	    padding: 10px;
    }
    #about li i{
	    padding:0 7px;
    }
    #about li p{
	    padding: 5px;
	
	    line-height: 23px;
	    font-size: 14px;
	    text-align:justify;
    }
    #about img {
	    float: right;
	    margin: 20px 5px 5px 20px;
    }
    #about h6{
	    margin:25px 20px 10px 20px;
	    padding:10px;
	
	    font-family: Cambria, Palatino, "Palatino Linotype", "Palatino LT STD", Georgia, serif;
	    font-size:13px;
	    font-style:italic;
	    line-height: 20px;
    }
    #about h6 i{
	    padding:0 20px;
	    font-size:11px;
    }
    /*** End About ********************/

    /*** Start Contact ****************/
    #contact li {
	    height: 290px;
	    width:340px;
	    float:left;
	    overflow:hidden;
	    padding: 10px;
	    margin-left:117px;
    }
    #contact li input{
	    height:27px;
    }
    #contact li textarea{
	    height:80px;
    }
    #contact li input,
    #contact li textarea{
	    width:85%;
	    margin-left:20px;
	    border:none;
	
	    border-radius:2px;
	    -webkit-border-radius:2px;
	    -moz-border-radius:2px;
    }
    #contact li p{
	    padding:3px 0;
	
	    font-size:13px;
	    line-height: 23px;
    }
    #contact li input#send{
	    width:70px;
	    height:27px;
	    margin-top:10px;
	    margin-left:20px;
    }
    /*** End Contact *******************/

    /*** Start #search *******************/
    #search {
	    display: block;
	    overflow:hidden;	
    }
    #search i {
	    margin:9px 5px 5px 190px;
	    font-size:24px;
    }
    #search input {
	    width:170px;
	    float:right;
	    padding: 5px;
	    margin: 5px 200px 5px 5px;
	
	    border:5px solid;
	
	    border-radius: 2px;
	    -webkit-border-radius: 2px;
	    -moz-border-radius: 2px;	
    }
    /*** End #search *******************/

    /* Start #social *******************/
    #social{
	    height:40px;
	    margin-left:237px;
	    border:none;
    }
    #social a{
	    float:left;
	    width:33px;
	    height:28px;
	    padding:6px 0;
	    border:none;
    }
    #social a i{
	    font-size:28px;
    }
    /* End #social ********************/

    /*** Special Background & Color ***********/

    .nav li:hover #cover1{
	    background-color:rgba(86,45,143,.8);	
    }
    .one#sub-menu2 li{
	    background-color:rgba(86,45,143,.1);       /*light Gray Color*/
    }
    .one#sub-menu li{
	    background-color:rgba(86,45,143,.4);       /*light Gray Color*/
    }

}
@media screen and (min-width:801px)
{ 
.nav li {
	list-style: none;
}
.nav a{
	display:block;
	text-decoration:none;
}
.nav i {
	display:block;
}
.nav p, .nav a, .nav h3, .nav h4{
	font-family:'exodemi_bold', Geneva, sans-serif;
}
.nav p, .nav h3, .nav h4, .one li a {
	font-family:'titilliumregular', Palatino, Georgia, serif;
}
.nav a, .nav h3, .nav h4{
	text-transform:uppercase;
}
.nav h3{
	font-size:20px;
}
.nav h4{
	font-size:18px;
}
.nav img{
	padding:10px;
	
	box-shadow: 1px 1px 4px rgba(102,102,102,.4);
	-webkit-box-shadow: 1px 1px 4px rgba(102,102,102,.4);
	-moz-box-shadow: 1px 1px 4px rgba(102,102,102,.4);
}
/* For Phone & Tablet */
.nav i.icon-chevron-down {
	display: none;
	visibility: hidden;
}
/*** End General ********************/

/*** Start .nav Class ***************/
.nav {
	display: block;
	position: relative;
	
	width:100%;
	height:60px;
	padding: 0px;
	margin:0px;
	z-index:10;
	
	border-radius:3px;
	-webkit-border-radius:3px;
	-moz-border-radius:3px;
	position: relative;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 24px;
    background: #fff;
    border-top: 1px solid #e2e2e2;
    border-bottom: 1px solid #e2e2e2;
}
.nav li {
	position: relative;
	display: block;
	height: 60px;
	width:100px;
	float: left;
	margin-right:1px;
}
.nav li a{
	height: 40px;
	width: 100%;
	float: left;
	padding: 20px 0px 0px 0px;
	overflow: hidden;
	
	text-align: center;
	font-weight: normal;
	font-size: 15px;
	letter-spacing: 0.1em;
}
/*** End .nav Class ***************/

/*** Start .one Class *************/
.nav .one {
	display: block;
	position:absolute;
	
	top: 100%;
	left: 0;
	padding-top:10px;
	padding-bottom:10px;
}
.one > li{
	width:180px;
	height:40px;
	float: none;
	border-bottom:1px solid rgba(86,45,143,.2);
	box-sizing: unset;
}
.nav .one > li a{
	width: 150px;
    height: 20px;
    float: none;
    padding: 10px 10px 10px 20px;
    text-align: left;
    text-transform: capitalize;
    font-size: 16px;
    font-family: "Microsoft YaHei",΢ÈíÑźÚ,ËÎÌå;
    box-sizing: unset;
}
.nav .one > li a:hover
{
    background:rgba(70, 6, 81, 0.24);
}
.one h3{
	padding:3px 5px 10px 8px;
}
.one li i.icon-chevron-right{
	float:right;
	margin:5px 17px 0 0;
}
/*** End .one Class *****************/

/*** Start .one #sub-menu ***********/
.nav .one #sub-menu{
	left: 100%;
	top: 0%;
}
/*** End .one #sub-menu *************/

/*** Start #cover1 & #icon **********/
#cover1,
#icon{
	position:absolute;
	top:0;
	left:0;
	
	transform-origin:50% 50%;
	-webkit-transform-origin:50% 50%;
	-moz-transform-origin:50% 50%;
	-o-transform-origin:50% 50%;
	-ms-transform-origin:50% 50%;
	
	transition:all .3s;
	-webkit-transition:all .3s;
	-moz-transition:all .3s;
	-o-transition:all .3s;
	-ms-transition:all .3s;
}
#cover1{
	width:100%;
	height:100%;
	z-index:50;
}
#icon{
	height:35px;
	width:130px;
	z-index:1;

	border-radius:3px 3px 0 0;
	-webkit-border-radius:3px 3px 0 0;
	-moz-border-radius:3px 3px 0 0;
}
#icon i{
	font-size:28px;
	padding:3px 47px;
}

/*** For Change Animation Effects ***/
.nav li:hover #icon {
	-webkit-animation:pulse .4s 1;           /* Change Animation Names*/
	animation:pulse .4s 1;          
}
/*** End #cover1 & #icon ***********/

/*** Start Home *******************/
#home {
	left:0px;
	overflow:hidden;
}
#home li {
	width: 300px;
	height: 320px;
	padding: 10px;
}
#home li img{
	float:left;
	margin:5px 12px 10px 5px;
}
#home li p{
	padding: 5px 8px 8px 8px;
	
	font-size:14px;
	text-align:justify;
}
#home li p#p-first{
	border-bottom:1px solid rgba(51,51,51,.2);
	margin-bottom:10px;
}
/*** End Home *******************/

/*** Start links ***************/
#links {
	left:-270px;
	overflow:hidden;	
}
#links > li {
	width: 650px;
	height: 215px;
	padding: 2px 0px 16px 10px;
}
#links li i {
	font-size: 12px;
}
#links .link-block{
	width: 28%;
	float: left;
	padding: 0 5px 30px 5px;
	margin: 10px 0 7px 15px;
}
#links .link-block h4 {
	margin:5px 0 10px 4px;
	padding:1px 0 8px 7px;
	border-bottom: 1px solid rgba(51,51,51,.2);
}
#links .link-block h4 i {
	margin-right:10px;
	font-size: 20px;
}
#links .link-block li{
	height:22px;
}
#links .link-block li a {
	height:20px;
	padding: 0 0 0 6px;
	
	font-size: 12px;
	text-transform:capitalize;
	
	border:none;

	transition: padding-left .3s;
	-webkit-transition: padding-left .3s;
	-moz-transition: padding-left .3s;
	-o-transition: padding-left .3s;
	-ms-transition: padding-left .3s;
}
#links .link-block li:hover a {
	padding-left: 14px;
}
/*** End links *******************/

/*** Start About *******************/
#about {
	left:-220px;
	overflow:hidden;
}
#about li {
	width: 550px;
	height: 320px;
	padding: 10px;
}
#about li i{
	padding:0 7px;
}
#about li p{
	padding: 5px;
	
	line-height: 23px;
	font-size: 14px;
	text-align:justify;
}
#about img {
	width:120px;
	height:140px;
	float: right;
	margin: 30px 5px 5px 20px;
}
#about h6{
	margin:15px 20px 10px 20px;
	padding:10px;
	
	font-family: Cambria, Palatino, "Palatino Linotype", "Palatino LT STD", Georgia, serif;
	font-size:13px;
	font-style:italic;
	line-height: 20px;
}
#about h6 i{
	font-size:11px;
}
/*** End About ********************/

/*** Start Contact ****************/
#contact {
	left:-90px;
	width: 300px;
}
#contact li {
	width:270px;
	height: 270px;
	padding: 10px;
	float:right;
	overflow:hidden;
}
#contact li input{
	height:27px;
}
#contact li textarea{
	height:80px;
}
#contact li input,
#contact li textarea{
	width:85%;
	margin-left:20px;
	border:none;
	
	border-radius:2px;
	-webkit-border-radius:2px;
	-moz-border-radius:2px;
}
#contact li p{
	font-size:13px;
	padding:3px 0;
	line-height: 23px;
}
#contact li input#send{
	width:70px;
	height:27px;
	margin-top:10px;
	margin-left:20px;
}
/*** End Contact *******************/

/* Start #Search  ****************/
#search {
	float: right;
	display: block;
	width:270px;
	
	transition: all .3s;
	-webkit-transition: all .3s;
	-moz-transition: all .3s;
	-o-transition: all .3s;
	-ms-transition: all .3s;
}
#search a{
	width:30px;
	margin:13px 0 0 3px;
	padding:0;
}
#search a i {
	padding-top:0px;
	float:right;
	font-size:27px;
}
#search input {
	width:175px;
	padding: 8px;
	margin: 9px 5px 0px 25px;
	float:left;
	
	border:5px solid;
	
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	
	-webkit-box-shadow: 1px 1px 2px #fff, 1px 1px 2px rgba(158,111,86,0.3) inset;
	-moz-box-shadow: 1px 1px 2px #fff, 1px 1px 2px rgba(158,111,86,0.3) inset;
	box-shadow: 1px 1px 2px #fff, 1px 1px 2px rgba(158,111,86,0.3) inset;	
}
/* End #Search **********************/

/* Start #social ********************/
#social{
	position:absolute;
	top:-30px;
	left:980px;
	width:133px;
	height:30px;
	padding:0 7px;
		
	border-radius:3px 3px 0 0;
	-webkit-border-radius:3px 3px 0 0;
	-moz-border-radius:3px 3px 0 0;
}
#social a{
	width:33px;
	height:28px;
	float:left;
	padding:6px 0;
}
#social a i{
	font-size:28px;
}
/* End #social ********************/

/*** Special Background & Color ***********/
.nav li:hover #cover1 a
{
    background:none;
}
#social{
	background-color: #ffffff;	
}
}