@charset "utf-8";
 body{
     
     color: #57595d;
     font-family:Geneva, Verdana, sans-serif;
     line-height: 1.42857143;
     /*background: -ms-linear-gradient(left, RGB(252, 230, 247) 0%, RGB(252, 247, 251) 100%) no-repeat;
     background: -webkit-linear-gradient(left, RGB(252, 230, 247), RGB(252, 247, 251)) no-repeat;
     background: -moz-linear-gradient(left, RGB(252, 230, 247), RGB(252, 247, 251)) no-repeat;
     background: linear-gradient(left, RGB(252, 230, 247), RGB(252, 247, 251)) no-repeat;
     filter:alpha(opacity=100 finishopacity=0 style=1 startx=0,starty=5,finishx=90,finishy=60);*/
     
     background-size: 100% 100%;  
     -moz-background-size: 100% 100%;  
     -webkit-background-size: 100% 100%; 
     /*background-color:#cccccc; */
     background-color:#8FBC8F;

     /*background-color:#D8F2AF;*/
     

   }
   header{
     font-family:'Lucida Grande', 'Trebuchet MS', 'Helvetica Neue', Arial, Sans-serif;  
     /*background:url("../images/background.gif") no-repeat center top;*/
     height:80px;
  
     width:70%;
    min-width: 1200px !important;
    /* min-width:1200px;*/
     text-align: center;
     
     /*background-color:#A7D16A;*/
   }
   #dmlnc{
     /*padding-left:50px;*/
	 padding-top:10px;
   }
   .title
    {
     cursor: pointer;
   	 display:block;
   	 width:190px;
   	 height:30px;
   	 /*background:url("../images/home/title.png");*/
	}
	.title:hover
    {
     cursor: pointer;
   	 display:block;
   	 width:190px;
   	 height:30px;
   	 /*background:url("../images/home/title1.png");*/
	}
   .codrops-demos {    
	display: block;
	line-height: 30px;
	min-width:1000px;
    width:70%;
    margin-top: 0px;
   position:relative;
   margin:0 auto;
    text-align: center;
   }
   .codrops-demos .left{
    border-radius:5px;
    display: inline-block;
	background:#003266;
    background:#217CA7;
    background:#217CA7;
	padding: 1px 20px;
    margin:0 2px;
	line-height: 30px;	
	font-size: 16px;
	color: #afcdeb;
     
	font-weight: 700;
	-webkit-transition: all 0.3s ease-out;
	-webkit-box-shadow: 3px 3px 4px #888;
	border: 1px solid rgba(0,0,0,0.15);
	display: inline-block;
   }
   .codrops-demos .left a{
      color: #afcdeb;
      
      text-decoration:none;
   }
   .codrops-demos .left:hover {	
	
    background:#8FBC8F;
	color:#003266;
   
	
   }
   .codrops-demos .left:active {
	background: #afcdeb;

	color:#003266;
   }

   #right{
    margin-right:20px;
	float:right;
	padding: 20px 0 0 0;
	display: inline-block;
    min-width: 200px !important;
    width:20%;
   }

   .codrops-demos .right{
    border-radius:5px;
    display: inline-block;
	margin: 0px 4px;
	padding: 0px 23px;
	line-height: 30px;
	background:#003266;
    background:#217CA7;
  /*  background:#2E8B57;*/
	font-size: 16px;
	color: #afcdeb;
    
	font-weight: 700;
	-webkit-transition: all 0.3s ease-out;
	-webkit-box-shadow: 3px 3px 4px #888;
	border: 1px solid rgba(0,0,0,0.15);
   }
   .codrops-demos .right a{
    color: #afcdeb;
     
    text-decoration:none;
   }
   .codrops-demos .right:hover {
	background: #afcdeb;
    background:#8FBC8F;
	color:#003266;
   }

   .codrops-demos .right:active {
	background: #afcdeb;
	color:#003266;
   }
   .wrapper-demo {
    margin: 60px 0 0 0;
    *zoom: 1;
    font-weight: 400;
}

.wrapper-demo:after {
    clear: both;
    content: "";
    display: table;
}
.wrapper-dropdown-3 {
    /* Size and position */
    position: relative;
    width: 67px;
    margin: 0 auto;
    /* Styles */
    border: 1px solid rgba(0,0,0,0.15);
    cursor: pointer;
    outline: none;
    /* Font settings */
    font-weight: bold;
    color: #3f3f3f;
    z-index:1002;

}



.wrapper-dropdown-3 .dropdown {
  /* Size & position */
    position: absolute;
    left: 0;
    right: 0;
    margin:0;
	 padding:0; 
    /* Styles */
    top: 140%;
    border-radius: inherit;
    border: 1px solid rgba(0,0,0,0.17);
    box-shadow: 0 0 5px rgba(0,0,0,0.1);
    font-weight: bold;
    -webkit-transition: all 0.5s ease-in;
    -moz-transition: all 0.5s ease-in;
    -ms-transition: all 0.5s ease-in;
    -o-transition: all 0.5s ease-in;
    transition: all 0.5s ease-in;
    list-style: none;
    background:#003266;

    /* Hiding */
    opacity: 0;
    pointer-events: none;
    font-size:12px;
    width:128px;
}
.wrapper-dropdown-3 .dropdown:after {
    content: "";
    width: 0;
    height: 0;
    position: absolute;
    bottom: 100%;
    left: 15px;
    border-width: 0 6px 6px 6px;
    border-style: solid;
    border-color: #003266 transparent;    
}


.wrapper-dropdown-3 .dropdown:before {
    content: "";
    width: 0;
    height: 0;
    position: absolute;
    bottom: 100%;
    left: 13px;
    border-width: 0 8px 8px 8px;
    border-style: solid;
    border-color: rgba(0,0,0,0.1) transparent;    
}

.wrapper-dropdown-3 .dropdown li{
    display: block;
	/*text-align:center;*/
	padding-left:10px;
    text-decoration: none;
	top:120%;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}
.wrapper-dropdown-3 .top{
    border-bottom: 1px solid rgba(0,0,0,0.17);
}
.wrapper-dropdown-3 .mid{
    border-bottom: 1px solid rgba(0,0,0,0.17);
}

.wrapper-dropdown-3 .dropdown li i {
    float: right;
    color: inherit;
}


/* Hover state */

.wrapper-dropdown-3 .dropdown .top:hover{
	color:#003266;
    background: #afcdeb;
    -webkit-border-radius: 5px 5px 0px 0px;
    -moz-border-radius: 5px 5px 0px 0px;
    border-radius: 5px 5px 0px 0px;
}
.wrapper-dropdown-3 .dropdown .mid:hover{
	color:#003266;
    background: #afcdeb;
}
.wrapper-dropdown-3 .dropdown .bot:hover{
	color:#003266;
    background: #afcdeb;
    -webkit-border-radius: 0px 0px 5px 5px;
    -moz-border-radius: 0px 0px 5px 5px;
    border-radius: 0px 0px 5px 5px;
}

/* Active state */

.wrapper-dropdown-3.active .dropdown {
    opacity: 1;
    pointer-events: auto;
}
.wrapper-dropdown-3.active:after {
    border-width: 0 6px 6px 6px;
}
.wrapper-dropdown-3:after {
    content: "";
    width: 0;
    height: 0;
    position: absolute;
    right: 16px;
    top: 50%;
    margin-top: -3px;
    border-width: 6px 6px 0 6px;
    border-style: solid;
    border-color: #afcdeb transparent;
}
/* 小尖号变色 */
.wrapper-dropdown-3:hover:after {
    content: "";
    width: 0;
    height: 0;
    position: absolute;
    right: 16px;
    top: 50%;
    margin-top: -3px;
    border-width: 6px 6px 0 6px;
    border-style: solid;
    border-color: #003266 transparent;
}
.wrapper-dropdown-3.active:hover::after {
    border-width: 0 6px 6px 6px;
    border-color: #003266 transparent;
}
/* No CSS3 support */

.no-opacity       .wrapper-dropdown-3 .dropdown,
.no-pointerevents .wrapper-dropdown-3 .dropdown {
    display: none;
    opacity: 1; /* If opacity support but no pointer-events support */
    pointer-events: auto; /* If pointer-events support but no pointer-events support */
}

.no-opacity       .wrapper-dropdown-3.active .dropdown,
.no-pointerevents .wrapper-dropdown-3.active .dropdown {
    display: block;
}

.wrapper-dropdown-4 {
    /* Size and position */
    position: relative;
    width: 54px;
    margin: 0 auto;
    /* Styles */
    border: 1px solid rgba(0,0,0,0.15);
    cursor: pointer;
    outline: none;
    /* Font settings */
    font-weight: bold;
    color: #3f3f3f;
    z-index:1002;

}



.wrapper-dropdown-4 .dropdown {
  /* Size & position */
    position: absolute;
    left: 0;
    right: 0;
    margin:0;
	 padding:0; 
    /* Styles */
    top: 140%;
    border-radius: inherit;
    border: 1px solid rgba(0,0,0,0.17);
    box-shadow: 0 0 5px rgba(0,0,0,0.1);
    font-weight: bold;
    -webkit-transition: all 0.5s ease-in;
    -moz-transition: all 0.5s ease-in;
    -ms-transition: all 0.5s ease-in;
    -o-transition: all 0.5s ease-in;
    transition: all 0.5s ease-in;
    list-style: none;
    background:#003266;
    /* Hiding */
    opacity: 0;
    pointer-events: none;
}

.wrapper-dropdown-4 .dropdown:after {
    content: "";
    width: 0;
    height: 0;
    position: absolute;
    bottom: 100%;
    right: 15px;
    border-width: 0 6px 6px 6px;
    border-style: solid;
    border-color: #003266 transparent;    
}


.wrapper-dropdown-4 .dropdown:before {
    content: "";
    width: 0;
    height: 0;
    position: absolute;
    bottom: 100%;
    right: 13px;
    border-width: 0 8px 8px 8px;
    border-style: solid;
    border-color: rgba(0,0,0,0.1) transparent;    
}

.wrapper-dropdown-4 .dropdown li{
    display: block;
	text-align:center;
    text-decoration: none;
	top:120%;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}
.wrapper-dropdown-4 .top{
    border-bottom: 1px solid rgba(0,0,0,0.17);
}
.wrapper-dropdown-4 .mid{
    border-bottom: 1px solid rgba(0,0,0,0.17);
}

.wrapper-dropdown-4 .dropdown li i {
    float: right;
    color: inherit;
}


/* Hover state */

.wrapper-dropdown-4 .dropdown .top:hover{
	color:#003266;
    background: #afcdeb;
    -webkit-border-radius: 5px 5px 0px 0px;
    -moz-border-radius: 5px 5px 0px 0px;
    border-radius: 5px 5px 0px 0px;
}
.wrapper-dropdown-4 .dropdown .mid:hover{
	color:#003266;
    background: #afcdeb;
}
.wrapper-dropdown-4 .dropdown .bot:hover{
	color:#003266;
    background: #afcdeb;
    -webkit-border-radius: 0px 0px 5px 5px;
    -moz-border-radius: 0px 0px 5px 5px;
    border-radius: 0px 0px 5px 5px;
}

/* Active state */

.wrapper-dropdown-4.active .dropdown {
    opacity: 1;
    pointer-events: auto;
}
.wrapper-dropdown-4.active:after {
    border-width: 0 6px 6px 6px;
}
.wrapper-dropdown-4:after {
    content: "";
    width: 0;
    height: 0;
    position: absolute;
    right: 16px;
    top: 50%;
    margin-top: -3px;
    border-width: 6px 6px 0 6px;
    border-style: solid;
    border-color: #afcdeb transparent;
}
/* 小尖号变色 */
.wrapper-dropdown-4:hover:after {
    content: "";
    width: 0;
    height: 0;
    position: absolute;
    right: 16px;
    top: 50%;
    margin-top: -3px;
    border-width: 6px 6px 0 6px;
    border-style: solid;
    border-color: #003266 transparent;
}
.wrapper-dropdown-4.active:hover::after {
    border-width: 0 6px 6px 6px;
    border-color: #003266 transparent;
}
/* No CSS3 support */

.no-opacity       .wrapper-dropdown-4 .dropdown,
.no-pointerevents .wrapper-dropdown-4 .dropdown {
    display: none;
    opacity: 1; /* If opacity support but no pointer-events support */
    pointer-events: auto; /* If pointer-events support but no pointer-events support */
}

.no-opacity       .wrapper-dropdown-4.active .dropdown,
.no-pointerevents .wrapper-dropdown-4.active .dropdown {
    display: block;
}

/* dropdown1 */
.wrapper-dropdown-3 .dropdown1 {
  /* Size & position */
    position: absolute;
    left: 0;
    right: 0;
    margin:0;
	 padding:0; 
    /* Styles */
    top: 140%;
    border-radius: inherit;
    border: 1px solid rgba(0,0,0,0.17);
    box-shadow: 0 0 5px rgba(0,0,0,0.1);
    font-weight: bold;
    -webkit-transition: all 0.5s ease-in;
    -moz-transition: all 0.5s ease-in;
    -ms-transition: all 0.5s ease-in;
    -o-transition: all 0.5s ease-in;
    transition: all 0.5s ease-in;
    list-style: none;
    background:#003266;
    /* Hiding */
    opacity: 0;
    pointer-events: none;
    font-size:12px;
    width:294px;
}

.wrapper-dropdown-3 .dropdown1:after {
    content: "";
    width: 0;
    height: 0;
    position: absolute;
    bottom: 100%;
    left: 15px;
    border-width: 0 6px 6px 6px;
    border-style: solid;
    border-color: #003266 transparent;    
}


.wrapper-dropdown-3 .dropdown1:before {
    content: "";
    width: 0;
    height: 0;
    position: absolute;
    bottom: 100%;
    left: 13px;
    border-width: 0 8px 8px 8px;
    border-style: solid;
    border-color: rgba(0,0,0,0.1) transparent;    
}

.wrapper-dropdown-3 .dropdown1 li{
    display: block;
	/*text-align:center;*/
	padding-left:10px;
    text-decoration: none;
	top:120%;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}
.wrapper-dropdown-3 .top{
    border-bottom: 1px solid rgba(0,0,0,0.17);
}
.wrapper-dropdown-3 .mid{
    border-bottom: 1px solid rgba(0,0,0,0.17);
}

.wrapper-dropdown-3 .dropdown1 li i {
    float: right;
    color: inherit;
}


/* Hover state */

.wrapper-dropdown-3 .dropdown1 .top:hover{
	color:#003266;
    background: #afcdeb;
    -webkit-border-radius: 5px 5px 0px 0px;
    -moz-border-radius: 5px 5px 0px 0px;
    border-radius: 5px 5px 0px 0px;
}
.wrapper-dropdown-3 .dropdown1 .mid:hover{
	color:#003266;
    background: #afcdeb;
}
.wrapper-dropdown-3 .dropdown1 .bot:hover{
	color:#003266;
    background: #afcdeb;
    -webkit-border-radius: 0px 0px 5px 5px;
    -moz-border-radius: 0px 0px 5px 5px;
    border-radius: 0px 0px 5px 5px;
}

/* Active state */

.wrapper-dropdown-3.active .dropdown1 {
    opacity: 1;
    pointer-events: auto;
}
.wrapper-dropdown-3.active:after {
    border-width: 0 6px 6px 6px;
}
.wrapper-dropdown-3:after {
    content: "";
    width: 0;
    height: 0;
    position: absolute;
    right: 16px;
    top: 50%;
    margin-top: -3px;
    border-width: 6px 6px 0 6px;
    border-style: solid;
    border-color: #afcdeb transparent;
}
/* 小尖号变色 */
.wrapper-dropdown-3:hover:after {
    content: "";
    width: 0;
    height: 0;
    position: absolute;
    right: 16px;
    top: 50%;
    margin-top: -3px;
    border-width: 6px 6px 0 6px;
    border-style: solid;
    border-color: #003266 transparent;
}
.wrapper-dropdown-3.active:hover::after {
    border-width: 0 6px 6px 6px;
    border-color: #003266 transparent;
}
/* No CSS3 support */

.no-opacity       .wrapper-dropdown-3 .dropdown1,
.no-pointerevents .wrapper-dropdown-3 .dropdown1 {
    display: none;
    opacity: 1; /* If opacity support but no pointer-events support */
    pointer-events: auto; /* If pointer-events support but no pointer-events support */
}

.no-opacity       .wrapper-dropdown-3.active .dropdown1,
.no-pointerevents .wrapper-dropdown-3.active .dropdown1 {
    display: block;
}

.wrapper-dropdown-4 {
    /* Size and position */
    position: relative;
    width: 54px;
    margin: 0 auto;
    /* Styles */
    border: 1px solid rgba(0,0,0,0.15);
    cursor: pointer;
    outline: none;
    /* Font settings */
    font-weight: bold;
    color: #3f3f3f;
    z-index:1002;

}



.wrapper-dropdown-4 .dropdown1 {
  /* Size & position */
    position: absolute;
    left: 0;
    right: 0;
    margin:0;
	 padding:0; 
    /* Styles */
    top: 140%;
    border-radius: inherit;
    border: 1px solid rgba(0,0,0,0.17);
    box-shadow: 0 0 5px rgba(0,0,0,0.1);
    font-weight: bold;
    -webkit-transition: all 0.5s ease-in;
    -moz-transition: all 0.5s ease-in;
    -ms-transition: all 0.5s ease-in;
    -o-transition: all 0.5s ease-in;
    transition: all 0.5s ease-in;
    list-style: none;
    background:#003266;
    /* Hiding */
    opacity: 0;
    pointer-events: none;
}

.wrapper-dropdown-4 .dropdown1:after {
    content: "";
    width: 0;
    height: 0;
    position: absolute;
    bottom: 100%;
    right: 15px;
    border-width: 0 6px 6px 6px;
    border-style: solid;
    border-color: #003266 transparent;    
}


.wrapper-dropdown-4 .dropdown1:before {
    content: "";
    width: 0;
    height: 0;
    position: absolute;
    bottom: 100%;
    right: 13px;
    border-width: 0 8px 8px 8px;
    border-style: solid;
    border-color: rgba(0,0,0,0.1) transparent;    
}

.wrapper-dropdown-4 .dropdown1 li{
    display: block;
	text-align:center;
    text-decoration: none;
	top:120%;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}
.wrapper-dropdown-4 .top{
    border-bottom: 1px solid rgba(0,0,0,0.17);
}
.wrapper-dropdown-4 .mid{
    border-bottom: 1px solid rgba(0,0,0,0.17);
}

.wrapper-dropdown-4 .dropdown1 li i {
    float: right;
    color: inherit;
}


/* Hover state */

.wrapper-dropdown-4 .dropdown1 .top:hover{
	color:#003266;
    background: #afcdeb;
    -webkit-border-radius: 5px 5px 0px 0px;
    -moz-border-radius: 5px 5px 0px 0px;
    border-radius: 5px 5px 0px 0px;
}
.wrapper-dropdown-4 .dropdown1 .mid:hover{
	color:#003266;
    background: #afcdeb;
}
.wrapper-dropdown-4 .dropdown1 .bot:hover{
	color:#003266;
    background: #afcdeb;
    -webkit-border-radius: 0px 0px 5px 5px;
    -moz-border-radius: 0px 0px 5px 5px;
    border-radius: 0px 0px 5px 5px;
}

/* Active state */

.wrapper-dropdown-4.active .dropdown1 {
    opacity: 1;
    pointer-events: auto;
}
.wrapper-dropdown-4.active:after {
    border-width: 0 6px 6px 6px;
}
.wrapper-dropdown-4:after {
    content: "";
    width: 0;
    height: 0;
    position: absolute;
    right: 16px;
    top: 50%;
    margin-top: -3px;
    border-width: 6px 6px 0 6px;
    border-style: solid;
    border-color: #afcdeb transparent;
}
/* 小尖号变色 */
.wrapper-dropdown-4:hover:after {
    content: "";
    width: 0;
    height: 0;
    position: absolute;
    right: 16px;
    top: 50%;
    margin-top: -3px;
    border-width: 6px 6px 0 6px;
    border-style: solid;
    border-color: #003266 transparent;
}
.wrapper-dropdown-4.active:hover::after {
    border-width: 0 6px 6px 6px;
    border-color: #003266 transparent;
}
/* No CSS3 support */

.no-opacity       .wrapper-dropdown-4 .dropdown1,
.no-pointerevents .wrapper-dropdown-4 .dropdown1 {
    display: none;
    opacity: 1; /* If opacity support but no pointer-events support */
    pointer-events: auto; /* If pointer-events support but no pointer-events support */
}

.no-opacity       .wrapper-dropdown-4.active .dropdown1,
.no-pointerevents .wrapper-dropdown-4.active .dropdown1 {
    display: block;
}

/* dropdown2 */
.wrapper-dropdown-3 .dropdown2 {
  /* Size & position */
    position: absolute;
    left: 0;
    right: 0;
    margin:0;
	 padding:0; 
    /* Styles */
    top: 140%;
    border-radius: inherit;
    border: 1px solid rgba(0,0,0,0.17);
    box-shadow: 0 0 5px rgba(0,0,0,0.1);
    font-weight: bold;
    -webkit-transition: all 0.5s ease-in;
    -moz-transition: all 0.5s ease-in;
    -ms-transition: all 0.5s ease-in;
    -o-transition: all 0.5s ease-in;
    transition: all 0.5s ease-in;
    list-style: none;
    background:#003266;
    /* Hiding */
    opacity: 0;
    pointer-events: none;
    font-size:12px;
    width:128px;
}

.wrapper-dropdown-3 .dropdown2:after {
    content: "";
    width: 0;
    height: 0;
    position: absolute;
    bottom: 100%;
    left: 15px;
    border-width: 0 6px 6px 6px;
    border-style: solid;
    border-color: #003266 transparent;    
}


.wrapper-dropdown-3 .dropdown2:before {
    content: "";
    width: 0;
    height: 0;
    position: absolute;
    bottom: 100%;
    left: 13px;
    border-width: 0 8px 8px 8px;
    border-style: solid;
    border-color: rgba(0,0,0,0.1) transparent;    
}

.wrapper-dropdown-3 .dropdown2 li{
    display: block;
	/*text-align:center;*/
	padding-left:10px;
    text-decoration: none;
	top:120%;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}
.wrapper-dropdown-3 .top{
    border-bottom: 1px solid rgba(0,0,0,0.17);
}
.wrapper-dropdown-3 .mid{
    border-bottom: 1px solid rgba(0,0,0,0.17);
}

.wrapper-dropdown-3 .dropdown2 li i {
    float: right;
    color: inherit;
}


/* Hover state */

.wrapper-dropdown-3 .dropdown2 .top:hover{
	color:#003266;
    background: #afcdeb;
    -webkit-border-radius: 5px 5px 0px 0px;
    -moz-border-radius: 5px 5px 0px 0px;
    border-radius: 5px 5px 0px 0px;
}
.wrapper-dropdown-3 .dropdown2 .mid:hover{
	color:#003266;
    background: #afcdeb;
}
.wrapper-dropdown-3 .dropdown2 .bot:hover{
	color:#003266;
    background: #afcdeb;
    -webkit-border-radius: 0px 0px 5px 5px;
    -moz-border-radius: 0px 0px 5px 5px;
    border-radius: 0px 0px 5px 5px;
}

/* Active state */

.wrapper-dropdown-3.active .dropdown2 {
    opacity: 1;
    pointer-events: auto;
}
.wrapper-dropdown-3.active:after {
    border-width: 0 6px 6px 6px;
}
.wrapper-dropdown-3:after {
    content: "";
    width: 0;
    height: 0;
    position: absolute;
    right: 16px;
    top: 50%;
    margin-top: -3px;
    border-width: 6px 6px 0 6px;
    border-style: solid;
    border-color: #afcdeb transparent;
}
/* 小尖号变色 */
.wrapper-dropdown-3:hover:after {
    content: "";
    width: 0;
    height: 0;
    position: absolute;
    right: 16px;
    top: 50%;
    margin-top: -3px;
    border-width: 6px 6px 0 6px;
    border-style: solid;
    border-color: #003266 transparent;
}
.wrapper-dropdown-3.active:hover::after {
    border-width: 0 6px 6px 6px;
    border-color: #003266 transparent;
}
/* No CSS3 support */

.no-opacity       .wrapper-dropdown-3 .dropdown2,
.no-pointerevents .wrapper-dropdown-3 .dropdown2 {
    display: none;
    opacity: 1; /* If opacity support but no pointer-events support */
    pointer-events: auto; /* If pointer-events support but no pointer-events support */
}

.no-opacity       .wrapper-dropdown-3.active .dropdown2,
.no-pointerevents .wrapper-dropdown-3.active .dropdown2 {
    display: block;
}

.wrapper-dropdown-4 {
    /* Size and position */
    position: relative;
    width: 54px;
    margin: 0 auto;
    /* Styles */
    border: 1px solid rgba(0,0,0,0.15);
    cursor: pointer;
    outline: none;
    /* Font settings */
    font-weight: bold;
    color: #3f3f3f;
    z-index:1002;

}



.wrapper-dropdown-4 .dropdown2 {
  /* Size & position */
    position: absolute;
    left: 0;
    right: 0;
    margin:0;
	 padding:0; 
    /* Styles */
    top: 140%;
    border-radius: inherit;
    border: 1px solid rgba(0,0,0,0.17);
    box-shadow: 0 0 5px rgba(0,0,0,0.1);
    font-weight: bold;
    -webkit-transition: all 0.5s ease-in;
    -moz-transition: all 0.5s ease-in;
    -ms-transition: all 0.5s ease-in;
    -o-transition: all 0.5s ease-in;
    transition: all 0.5s ease-in;
    list-style: none;
    background:#003266;
    /* Hiding */
    opacity: 0;
    pointer-events: none;
}

.wrapper-dropdown-4 .dropdown2:after {
    content: "";
    width: 0;
    height: 0;
    position: absolute;
    bottom: 100%;
    right: 15px;
    border-width: 0 6px 6px 6px;
    border-style: solid;
    border-color: #003266 transparent;    
}


.wrapper-dropdown-4 .dropdown2:before {
    content: "";
    width: 0;
    height: 0;
    position: absolute;
    bottom: 100%;
    right: 13px;
    border-width: 0 8px 8px 8px;
    border-style: solid;
    border-color: rgba(0,0,0,0.1) transparent;    
}

.wrapper-dropdown-4 .dropdown2 li{
    display: block;
	text-align:center;
    text-decoration: none;
	top:120%;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}
.wrapper-dropdown-4 .top{
    border-bottom: 1px solid rgba(0,0,0,0.17);
}
.wrapper-dropdown-4 .mid{
    border-bottom: 1px solid rgba(0,0,0,0.17);
}

.wrapper-dropdown-4 .dropdown2 li i {
    float: right;
    color: inherit;
}


/* Hover state */

.wrapper-dropdown-4 .dropdown2 .top:hover{
	color:#003266;
    background: #afcdeb;
    -webkit-border-radius: 5px 5px 0px 0px;
    -moz-border-radius: 5px 5px 0px 0px;
    border-radius: 5px 5px 0px 0px;
}
.wrapper-dropdown-4 .dropdown2 .mid:hover{
	color:#003266;
    background: #afcdeb;
}
.wrapper-dropdown-4 .dropdown2 .bot:hover{
	color:#003266;
    background: #afcdeb;
    -webkit-border-radius: 0px 0px 5px 5px;
    -moz-border-radius: 0px 0px 5px 5px;
    border-radius: 0px 0px 5px 5px;
}

/* Active state */

.wrapper-dropdown-4.active .dropdown2 {
    opacity: 1;
    pointer-events: auto;
}
.wrapper-dropdown-4.active:after {
    border-width: 0 6px 6px 6px;
}
.wrapper-dropdown-4:after {
    content: "";
    width: 0;
    height: 0;
    position: absolute;
    right: 16px;
    top: 50%;
    margin-top: -3px;
    border-width: 6px 6px 0 6px;
    border-style: solid;
    border-color: #afcdeb transparent;
}
/* 小尖号变色 */
.wrapper-dropdown-4:hover:after {
    content: "";
    width: 0;
    height: 0;
    position: absolute;
    right: 16px;
    top: 50%;
    margin-top: -3px;
    border-width: 6px 6px 0 6px;
    border-style: solid;
    border-color: #003266 transparent;
}
.wrapper-dropdown-4.active:hover::after {
    border-width: 0 6px 6px 6px;
    border-color: #003266 transparent;
}
/* No CSS3 support */

.no-opacity       .wrapper-dropdown-4 .dropdown2,
.no-pointerevents .wrapper-dropdown-4 .dropdown2 {
    display: none;
    opacity: 1; /* If opacity support but no pointer-events support */
    pointer-events: auto; /* If pointer-events support but no pointer-events support */
}

.no-opacity       .wrapper-dropdown-4.active .dropdown2,
.no-pointerevents .wrapper-dropdown-4.active .dropdown2 {
    display: block;
}

.tool{
	width:56px;
}
.curation{
	width:81px;
}
div.demo {
margin:0 auto;
text-align:center;
}
.demo .picture1 {
	width:95%;
	padding:0;
	margin:0 0 0 4%;
}
.demo .picture{
margin:0 auto;
width: 33%;
height: 256px;
text-align:left;
}
.demo .nonpicture{
list-style: none;
margin:0;
margin-left:20px;
width: 365px;
float:left;
text-align:center;
}

.demo a{
  text-decoration:none;
  color:#3f3f3f;
  font-size:13px;
  line-height:25px;
  font-weight:bold;
  width:100%;
  text-align:left;
}
.demo a:hover{
  color:#003266;
}
.demo{
  font-size:14px;
}

.function{
	width:100%;
	text-align:left;
}
.function p{
	padding-right:25px;
	margin:10px auto;
	font-size:12px;
}
.picture{
  list-style:none;
}
.picture li{
 text-align:left;
 color: #3f3f3f;
 list-style-image:url("../images/home/point.gif");/*把你要的圆点样式切好图作为背景*/
 text-indent: 0px;/*与文字的距离，也就是文字会空多少距离显示*/
 line-height:17px;
}
.picture ul{
 height:90px;
 padding:0;
 margin:0 auto;
 font-size:13px;
 
}
.box {
margin-top:0px;
width: 215px;
height: 129px;
display: inline-block;
background: #fff;
border: 1px solid #ccc;
position:relative;
}
.box1{
background: -webkit-gradient(linear, 0% 20%, 0% 100%, from(#fff), to(#fff), color-stop(.1,#f3f3f3));
background: -webkit-linear-gradient(0% 0%, #fff, #f3f3f3 10%, #fff);
background: -moz-linear-gradient(0% 0%, #fff, #f3f3f3 10%, #fff);
background: -o-linear-gradient(0% 0%, #fff, #f3f3f3 10%, #fff);
/*设置Box的阴影效果*/
-webkit-box-shadow: 0px 3px 30px rgba(0, 0, 0, 0.1) inset;
-moz-box-shadow: 0px 3px 30px rgba(0, 0, 0, 0.1) inset;
box-shadow: 0px 3px 30px rgba(0, 0, 0, 0.1) inset;
/*制作右下脚折边效果*/
-moz-border-radius: 0 0 6px 0 / 0 0 50px 0;
-webkit-border-radius: 0 0 6px 0 / 0 0 50px 0;
border-radius: 0 0 6px 0 / 0 0 50px 0;
}
/*使用:before来制作底部阴影，并对阴影进行旋转的扭曲和位移设置*/
.box1:before{
content: '';
width: 50px;
height: 100px;
position:absolute;
bottom:0; right:0;
-webkit-box-shadow: 20px 20px 10px rgba(0, 0, 0, 0.1);
-moz-box-shadow: 20px 20px 15px rgba(0, 0, 0, 0.1);
box-shadow: 20px 20px 15px rgba(0, 0, 0, 0.1);
z-index:-1;
-webkit-transform: translate(-35px,-40px) skew(0deg,30deg) rotate(-25deg);
-moz-transform: translate(-35px,-40px) skew(0deg,32deg) rotate(-25deg);
-o-transform: translate(-35px,-40px) skew(0deg,32deg) rotate(-25deg);
transform: translate(-35px,-40px) skew(0deg,32deg) rotate(-25deg);
}
/*使用:after来制作顶部的阴影，并对阴影进行旋转的扭曲和位移设置*/
.box1:after{
content: '';
width: 100px;
height: 100px;
top:0; left:0;
position:absolute;
display: inline-block;
z-index:-1;
-webkit-box-shadow: -10px -10px 10px rgba(0, 0, 0, 0.2);
-moz-box-shadow: -10px -10px 15px rgba(0, 0, 0, 0.2);
box-shadow: -10px -10px 15px rgba(0, 0, 0, 0.2);
-webkit-transform: rotate(2deg) translate(20px,25px) skew(20deg);
-moz-transform: rotate(7deg) translate(20px,25px) skew(20deg);
-o-transform: rotate(7deg) translate(20px,25px) skew(20deg);
transform: rotate(7deg) translate(20px,25px) skew(20deg);
}

/*============Box4==============*/
.box4{
padding: 0 ;
background: #fff;
background: -webkit-gradient(linear, 0% 20%, 0% 100%, from(#fff), to(#fff), color-stop(.2, #f2f2f2));
background: -webkit-linear-gradient(0% 0% 360deg, #fff, #f2f2f2 20%, #fff );
background: -moz-linear-gradient(0% 0% 360deg, #fff, #f2f2f2 20%, #fff );
background: -o-linear-gradient(0% 0% 360deg, #fff, #f2f2f2 20%, #fff );
-webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3);
-moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3);
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3);
border-radius:4px;
overflow:hidden;
}

.box4:before{
content: '';
width: 50px;
height: 50px;
top:0; right:0;
position:absolute;
z-index: -1;
-webkit-box-shadow: 10px -10px 8px rgba(0, 0, 0, 0.2);
-moz-box-shadow: 10px -10px 8px rgba(0, 0, 0, 0.2);
box-shadow: 10px -10px 8px rgba(0, 0, 0, 0.2);
-webkit-transform: rotate(2deg) translate(-14px,20px) skew(-20deg);
-moz-transform: rotate(2deg) translate(-14px,20px) skew(-20deg);
-o-transform: rotate(2deg) translate(-14px,20px) skew(-20deg);
transform: rotate(2deg) translate(-14px,20px) skew(-20deg);
}
.box4:after{
content: '';
width: 50px;
height: 50px;
top:0; left:0;
position:absolute;
z-index:-1;
display: inline-block;
-webkit-box-shadow: -10px -10px 10px rgba(0, 0, 0, 0.2);
-moz-box-shadow: -10px -10px 10px rgba(0, 0, 0, 0.2);
box-shadow: -10px -10px 10px rgba(0, 0, 0, 0.2);
-webkit-transform: rotate(2deg) translate(12px,25px) skew(20deg);
-moz-transform: rotate(2deg) translate(12px,25px) skew(20deg);
-o-transform: rotate(2deg) translate(12px,25px) skew(20deg);
transform: rotate(2deg) translate(12px,25px) skew(20deg);
}
/*盒子右下角阴影效果*/
.box4 .shBr{
width: 100px;
height: 100px;
bottom:0; right:0;
position:absolute;
z-index: -1;
-webkit-box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.2);
-moz-box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.2);
box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.2);
-webkit-transform: rotate(0deg) translate(-20px,-15px) skew(20deg);
-moz-transform: rotate(0deg) translate(-20px,-15px) skew(20deg);
-o-transform: rotate(0deg) translate(-20px,-15px) skew(20deg);
transform: rotate(0deg) translate(-20px,-15px) skew(20deg);
}
/*盒子左下角阴影效果*/
.box4 .shBl{
width: 100px;
height: 100px;
bottom:0; left:0;
position:absolute;
z-index: -1;
-webkit-box-shadow: -10px 10px 10px rgba(0, 0, 0, 0.2);
-moz-box-shadow: -10px 10px 10px rgba(0, 0, 0, 0.2);
box-shadow: -10px 10px 10px rgba(0, 0, 0, 0.2);
-webkit-transform: rotate(0deg) translate(20px,-15px) skew(-20deg);
-moz-transform: rotate(0deg) translate(20px,-15px) skew(-20deg);
-o-transform: rotate(0deg) translate(20px,-15px) skew(-20deg);
transform: rotate(0deg) translate(20px,-15px) skew(-20deg);
}

h1, h2, h3, h4, h5, h6 {
    font: bold 1.6em 'Lucida Grande', 'Trebuchet MS', 'Helvetica Neue', Arial, Sans-serif;
    letter-spacing: -0.5px;
}

    /*------------------home quick search-------------------*/
    
    .cf:before, .cf:after{
      content:"";
      display:table;
    }
    
    .cf:after{
      clear:both;
    }

    .cf{
      zoom:1;
    }

    /*-------------------------------------*/	
    
    .form-wrapper {
        width: 380px;
		height:31px;
        padding: 9px;
        margin: 13px auto 7px auto;
        background: rgb(216, 217, 218);
        -moz-border-radius: 5px;
        -webkit-border-radius: 5px;
        border-radius: 5px;
        -webkit-box-shadow: 0px 0px 10px #737373;
        -moz-box-shadow: 0px 0px 10px #737373;
        box-shadow: 0px 0px 10px #737373;
    }
    
    .form-wrapper input {
        width: 284px;
        height: 15px;
        padding: 8px 5px;
        float: left;    
        font: bold 15px;
        border: 0;
        background: #f5f3f5;
        -moz-border-radius: 3px 0 0 3px;
        -webkit-border-radius: 3px 0 0 3px;
        border-radius: 3px 0 0 3px;      
    }
    
    .form-wrapper input:focus {
        outline: 0;
        background: #fff;
        -moz-box-shadow: 0 0 2px rgba(0,0,0,.8) inset;
        -webkit-box-shadow: 0 0 2px rgba(0,0,0,.8) inset;
        box-shadow: 0 0 2px rgba(0,0,0,.8) inset;
    }
    
    .form-wrapper input::-webkit-input-placeholder {
       color: #9b9b9b;
       font-weight: normal;
    }
    
    .form-wrapper input:-moz-placeholder {
        color: #9b9b9b;
        font-weight: normal;
    }
    
    .form-wrapper input:-ms-input-placeholder {
        color: #9b9b9b;
        font-weight: normal;
    }    
    .form-wrapper input{
	    color: #4c4c4c;
        font-weight: normal;
	}
	::-webkit-input-placeholder { /* WebKit browsers */
　　      color:#9b9b9b;
　　  }
　 　:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
　      　color:#9b9b9b;
　　  }
　  ::-moz-placeholder { /* Mozilla Firefox 19+ */
　      　color:#9b9b9b;
　　  }
　　 :-ms-input-placeholder { /* Internet Explorer 10+ */
　　      color:#9b9b9b;
　　  }
    .form-wrapper button {
		overflow: visible;
        position: relative;
        float: right;
        border: 0;
        padding: 0;
        cursor: pointer;
        height: 31px;
        width: 86px;
		font-weight:bold;
		font-size:17px;
		font-family:'Lucida Grande', 'Trebuchet MS', 'Helvetica Neue', Arial, Sans-serif;  
        color: #AFCDEB;
        background: #003266;
        -moz-border-radius: 0 3px 3px 0;
        -webkit-border-radius: 0 3px 3px 0;
        border-radius: 0 3px 3px 0;      
        text-shadow: 0 -1px 0 rgba(0, 0 ,0, .3);
    }   
      
    .form-wrapper button:hover{		
        background: #032c51;
        color: #AFCDEB;
    }	
      
    .form-wrapper button:active,
    .form-wrapper button:focus{   
        background: #032c51;
        color: #AFCDEB;   
    }
    
    .form-wrapper button:before {
        content: '';
        position: absolute;
        border-width: 8px 8px 8px 0;
        border-style: solid solid solid none;
        border-color: transparent #003266 transparent;
        top: 8px;
        left: -6px;
    }
    
    .form-wrapper button:hover:before{
        border-right-color: #032c51;
    }
    
    .form-wrapper button:focus:before{
        border-right-color: #032c51;
    }    
    
    .form-wrapper button::-moz-focus-inner {
        border: 0;
        padding: 0;
    }

#tail{
   float:left;
   margin-top:3px;
   width:100%;
   height:30px;
   text-align:center;
   font-size:14px;
}
#tail p{
   margin:0;
}

.tableinfor {
    border-collapse: collapse;
    border: thin solid #303030;
    width: 35%;
    border-style: hidden hidden none hidden;
    color: #3f3f3f;
    font-size: 13px;
    text-align: center;
    margin: 0 auto;
    line-height: 34px;
}

.tableinfor tbody tr {
    border-bottom: 1px solid #8C8B8B;
    text-align: left;
}

.tableinfor th {
    text-align: center;
    border: 0px;
    border-bottom: 2px solid #595959;
}

.tableinfor tbody td {
    padding-left: 5%;
}
.tableinfor tbody tr:hover{
   background-color:#E7E0FC;
}

.function {
	margin-top:30px;
    border-collapse: collapse;
    border: thin solid #303030;
    width: 85%;
    border-style: hidden hidden none hidden;
    color: #3f3f3f;
    font-size: 13px;
    text-align: center;
    margin: 0 auto;
    text-align: left;
}

.function th {
    text-align: center;
    border: 0px;
    border-bottom: 2px solid #595959;
}

.function tbody tr {
    border-bottom: 1px solid #8C8B8B;
}

.function td {
    padding-left: 3%;
}

.function tbody tr:hover{
   background-color:#E7E0FC;
}