/*******NEW HEADER CSS START Mr N*******/
.header-primary{font-family: PingFang SC;}
.nav_css-one, .navbar-default {
background-color: #fff !important;
border: none !important;
margin-bottom: 0px;
box-shadow: 0px 0px 1px rgba(0,0,0,0.1);
}
.logo_div{float: left;margin-top: 10px;margin-bottom: 10px;}
.header_nav{float: right;}
.logo_div img {   
height: 38px;
width: 100%;
max-width: 84px;
}
.header_ul{
list-style-type: none;
line-height: 58px;
margin: 0px;
}
.header_nav .nav-left{
float: left;
}
.header_nav .nav-right{
float: right;
margin-left: 15px;
}
.header_ul li{
display: inline-block;
margin: 0px 20px;
}
.header_ul li a{
text-decoration: none;
}
.header_ul li span a{
font-family: PingFang SC;
font-size: 16px;
font-weight: 400;
color: #ffffff;
text-decoration: none;
}
.header_nav .nav-right span.line_brk {
width: 1px;
height: 18px;
background-color: #fff;
display: inline-block;
top: 4px;
position: relative;
}
.dropdown-menu {
position: absolute;
top: 56px;
left: 0;
z-index: 1000;
display: none;
float: left;
padding: 8px;
margin: 0;
list-style: none;
font-size: 16px;
text-align: left;
background-color: #fff;
border: 0 solid #e2e6e8;
border-radius: 3px;
-webkit-box-shadow: 0 20px 66px 0 rgba(34,48,73,0.2);
box-shadow: 0 20px 66px 0 rgba(34,48,73,0.2);
background-clip: padding-box;
min-width: 85px;
}
.dropdown-menu li{margin: 0px;cursor: pointer;}
.dropdown-menu li span a{
color: #000;
}
.dropdown-menu li{
display: block;
}
.dropdown-menu li span a{
display: block;
padding: 13px 16px 11px;
clear: both;
font-weight: normal;
border-radius: 3px;
line-height: 24px;
color: #0f0f0f;
white-space: nowrap;
}
.dropdown-menu li span a:hover, .dropdown-menu li span a:focus {
text-decoration: none;
color: #2e4369;
background-color: #f2f5f7;
outline: 0;
}
.dropdown-menu:before{
position: absolute;
top: -4px;
display: block;
width: 8px;
height: 8px;
content: " ";
background-color: inherit;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(40deg);
right: calc((8px * 2) + (8px / 2));
left: auto;
}
.header_nav .header_ul>li.dropdown:hover .dropdown-menu {
display: block;
animation: showDropdown .2s cubic-bezier(.6, .2, .1, 1) both;
-webkit-animation: showDropdown .2s cubic-bezier(.6, .2, .1, 1) both;
-moz-animation: showDropdown .2s cubic-bezier(.6, .2, .1, 1) both;
-o-animation: showDropdown .2s cubic-bezier(.6, .2, .1, 1) both;
-ms-animation: showDropdown .2s cubic-bezier(.6, .2, .1, 1) both;
}
.nav-right .en_img img{width: 20px;height: auto;top: 18px;position: relative;float: left;margin-right: 6px;}
.nav-right .en_img span a{font-size: 14px;}
.nav-right .en_img .dropdown-menu li img{top: 0px;}
.dropdown-menu.drp_m1{left: -32px;width: 129px;}
.dropdown-menu.drp_m2{left: -25px;width: 125px;}
.dropdown-menu.drp_m3{left: -14px;}
.dropdown-menu.drp_m4{left: -12px;}
.dropdown-menu.drp_m5{left: -14px;}
.dropdown-menu.drp_m6{left: -16px;}
.dropdown-menu.drp_m7{width: 120px;left: 2px;}
.nav-right .singup, .nav-right .signin{margin: 0px 2px;}
.nav-right .singup .btn_btn{
padding: 6px 12px;
border-radius: 20px;
color: #ffffff;
}
.nav-right .signin .btn_btn{
background-color: transparent;
padding: 6px 24px;
border-radius: 20px;
color: #ffffff;
/*border:1px solid #ffffff;*/
box-shadow: 0px 2px 4px rgba(0,0,0,0.10);
/*background-image: linear-gradient(to left,
transparent,
transparent 50%,
#EE2167 50%,
#EE2167);
background-position: 100% 0;
background-size: 200% 100%;*/
transition: all .2s ease-in;
}
.nav-right .signin .btn_btn:focus,
.nav-right .signin .btn_btn:hover,
.nav-right .signin .btn_btn:active,
.nav-right .signin .btn_btn:focus-within{
/*background-position: 0 0;*/
box-shadow: 0px 2px 4px rgba(255,64,129,0.6);
outline: none;
color: #ffffff;
background-color: #FF4081;
/*border:1px solid #FF4081;*/
}
.header-primary .nav-right .sigin_div{display: inline-block;}
/***conditions css****/
/*.nav-right .user_board{display: none;}*/
.menu_scroll-css{
background-color: rgba(255, 255, 255, 1) !important;
box-shadow: 0px 2px 4px rgba(0,0,0,0.10) !important;
z-index: 99999999;
}
/*.header_ul.nav-right .my_act{display: none;}*/
#header.menu_none{
display: none;
}
.logo_div img.logo_b{
display: none;
}
.menu_scroll-css .logo_div img.logo_w{
display: none;
}
.menu_scroll-css .logo_div img.logo_b{
display: block;
}
.menu_scroll-css .header_ul li span a{
color: #0f0f0f;
}
.menu_scroll-css .nav-right span.line_brk {
background-color: #0f0f0f;
}
.menu_scroll-css .nav-right .singup .btn_btn{
color: #0f0f0f;
}
.menu_scroll-css .nav-right .signin .btn_btn{
background-color: transparent;
color: #FF4081;
/*border:1px solid #FF4081;*/
/* box-shadow: 0px 2px 4px rgba(255,64,129,0.6); */
/*background-image: linear-gradient(to left,
transparent,
transparent 50%,
#EE2167 50%,
#EE2167);
background-position: 100% 0;
background-size: 200% 100%;*/
transition: all .2s ease-in;
}
.menu_scroll-css .nav-right .signin .btn_btn:focus,
.menu_scroll-css .nav-right .signin .btn_btn:hover,
.menu_scroll-css .nav-right .signin .btn_btn:active,
.menu_scroll-css .nav-right .signin .btn_btn:focus-within{
/*background-position: 0 0;*/
outline: none;
color: #ffffff;
/*border:1px solid #FF4081;*/
background-color: #FF4081;
box-shadow: 0px 0px 0px rgba(255,64,129,0.6);
}
.menu_scroll-css .nav-right .sigin_div{display: inline-block;}
.nav_css-one .nav-right .sigin_div{display: inline-block;}
.nav-right .my_act .btn_btn{
background-color: #FF4081;
padding: 6px 12px;
border-radius: 20px;
color: #ffffff;
border:0px solid #FF4081;
box-shadow: 0px 2px 4px rgba(255,64,129,0.6);
cursor: pointer;
}
.nav-right .my_act .btn_btn:focus,
.nav-right .my_act .btn_btn:hover,
.nav-right .my_act .btn_btn:active,
.nav-right .my_act .btn_btn:focus-within{
outline: none;
color: #ffffff;
}
.menu_scroll-css .nav-right .my_act span a{color: #ffffff;}
.menu_scroll-css .dropdown-menu{
border-top: 1px solid rgba(0,0,0,.15);
}
.menu_scroll-css .dropdown-menu:before{
border: 1px solid rgba(0,0,0,.15);
border-bottom: 0px;
border-right: 0;
}


/*******Mobile Menu********/

.mobile_menu{display: none;}
.mobile_menu{
background: #FFFFFF;
min-height: 4rem;
}
.mobile_menu .navbar-default{
background-color: transparent;
border:none;
margin-bottom: 0rem;
border-color: transparent;
}
.mobile_menu .navbar-default .navbar-collapse{
border-color: transparent;
border: none;
-webkit-box-shadow: none;
box-shadow: none;
background-color: #ffffff;
margin-top: 0.375rem;
height: auto;
}
.mobile_menu .nav_logo{
padding: 1rem 0rem;
height: auto;
}
.mobile_menu .nav_logo img{
width: 5.375rem;
height: 2.375rem;
}
.menu-button{
position: absolute;
top: 12px;
right: 0px;
padding: 10px;
cursor: pointer;
-webkit-transition: .3s;
transition: .3s;
background-color: transparent;
}
.menu-button .bar{
position: relative;
display: block;
width: 25px;
height: 4px;
margin: 5px auto;
background-color: #2096F3;
border-radius: 1px;
-webkit-transition: .3s;
transition: .3s;
}
.menu-button .bar:before{
content: '';
position: absolute;
width: 4px;
height: 4px;
left: -7px;
background-color: #2096F3;
border-radius: 1px;
}
.navbar-collapse.in{
border:none;border-color: transparent;
background-color: transparent;
-webkit-box-shadow: none; 
box-shadow: none; 
}
.menu-button .bar:nth-of-type(1){
margin-top: 0px;
}
.menu-button .bar:nth-of-type(3) {
margin-bottom: 0px;
}
.menu-button:hover .bar:nth-of-type(1){
-webkit-transform: translateY(1.5px) rotate(0deg);
-ms-transform: translateY(1.5px) rotate(0deg);
transform: translateY(1.5px) rotate(0deg);
}
.menu-button:hover .bar:nth-of-type(2) {
opacity: .9;
}
.menu-button:hover .bar:nth-of-type(3) {
-webkit-transform: translateY(-1.5px) rotate(0deg);
-ms-transform: translateY(-1.5px) rotate(0deg);
transform: translateY(-1.5px) rotate(0deg);
}
.cross .bar:nth-of-type(1) {
-webkit-transform: translateY(14px) rotate(-45deg);
-ms-transform: translateY(14px) rotate(-45deg);
transform: translateY(14px) rotate(-45deg);
}
.cross .bar:nth-of-type(2) {
opacity: 0;
}
.cross .bar:nth-of-type(3):before, .cross .bar:nth-of-type(1):before{
display: none;
}
.cross .bar:nth-of-type(3) {
-webkit-transform: translateY(-4px) rotate(45deg);
-ms-transform: translateY(-4px) rotate(45deg);
transform: translateY(-4px) rotate(45deg);
}
.cross:hover .bar:nth-of-type(1) {
-webkit-transform: translateY(13.5px) rotate(-40.5deg);
-ms-transform: translateY(13.5px) rotate(-40.5deg);
transform: translateY(13.5px) rotate(-40.5deg);
}
.cross:hover .bar:nth-of-type(2) {
opacity: .0;
}
.cross:hover .bar:nth-of-type(3) {
-webkit-transform: translateY(-4px) rotate(40.5deg);
-ms-transform: translateY(-4px) rotate(40.5deg);
transform: translateY(-4px) rotate(40.5deg);
}
.mobile_menu.navbar-fixed-top .navbar-collapse{
max-height: 100%;
height: 100%;
}




#header.mobile_none{
display: none;
}


/******Social Menu*******/
.social_left{
position: fixed;
right: 2rem;
bottom: 4rem;
z-index: 999999999;	
}
.social_menu{
list-style-type: none;
}
.social_left .social_menu li{
margin: 1.3rem 0rem;
cursor: pointer;
width: 44px;
height: 44px;
display: block;
-webkit-transition: .8s all ease-in-out;
-moz-transition: .8s all ease-in-out;
-ms-transition: .8s all ease-in-out;
-o-transition: .8s all ease-in-out;
transition: .8s all ease-in-out;
background-size: 100%;
}
.social_left .social_menu li.qq_link_ind a{
visibility: visible;
text-indent: -999999px;
color: #ffff;
padding-left: 6px;
font-size: 11px;
width: 42px;
height: 42px;
position: absolute;
}
.social_left .social_menu li.soc_mail{
background: url('https://static.panpay.com/static/image/cn/header/sprite_images.png') 0px 0px no-repeat;
}
.social_left .social_menu li.soc_call{
background: url('https://static.panpay.com/static/image/cn/header/sprite_images.png') 0px -54px no-repeat;
}
.social_left .social_menu li.soc_qq{
background: url('https://static.panpay.com/static/image/cn/header/sprite_images.png') 0px -108px no-repeat;
}
.social_left .social_menu li.soc_follow{
background: url('https://static.panpay.com/static/image/cn/header/sprite_images.png') 0px -162px no-repeat;
}

.social_left .social_menu li.soc_mail:hover{
background-position: -52px 0px;
}
.social_left .social_menu li.soc_call:hover{
background-position: -52px -54px;
}
.social_left .social_menu li.soc_qq:hover{
background-position: -52px -108px;
}
.social_left .social_menu li.soc_follow:hover{
background-position: -52px -162px;
}
.socail_mail_show{
width: 13rem;
border: 1px solid #ccc;
position: absolute;
right: 3rem;
top: 0.5rem;
text-align: center;
border-radius: 4px;
padding: 1rem;
}
.socail_call_show{
width: 13rem;
border: 1px solid #ccc;
position: absolute;
right: 3rem;
top: 4rem;
text-align: center;
border-radius: 4px;
padding: 1rem;
}
.socail_follow_show{
width: 7rem;
height: 7rem;
border: 1px solid #ccc;
position: absolute;
right: 3rem;
top: 10rem;
text-align: center;
border-radius: 4px;
padding: 0.5rem;
}
.socail_follow_show img{
width: 7rem !important;
height: auto;
}
.dis_css{
display: none;
background-color: #fff;
}
.dis_css img{
width: 7rem !important;
height: auto;
}
.dis_css p{
font-size: 0.875rem;
font-family: PingFang Regular;
color: #0f0f0f;
}
.dis_css span{
font-size: 0.875rem;
font-family: PingFang Regular;
color: #2096f3;
}
.social_left .social_menu li.soc_mail:hover>.dis_css,
.social_left .social_menu li.soc_call:hover>.dis_css,
.social_left .social_menu li.soc_qq:hover>.dis_css,
.social_left .social_menu li.soc_follow:hover>.dis_css
{
display: block;
}

/* @media (max-width: 768px){
.web_page_menu{display: block;}
.mobile_menu{display: none;}
#header.mobile_none{display: none;}
}
@media (max-width: 767px){
.web_page_menu{display: none;}
.mobile_menu{display: block;}
} */
/*******NEW HEADER CSS END Mr N*******/

