html, body {
overflow-x: hidden;
}
body.stop, html.stop {
overflow: hidden;
}
body {
float: left;
width: 100%;
font-family: arimo, "Microsoft YaHei";
letter-spacing: 0.32px;
position: relative;
}
h1, h2, h3, h4, h5, h6 {
font-family: arimo, roboto slab, "Microsoft YaHei";
color: #303030;
}
p {
font-family: arimo, "Microsoft YaHei";
color: #505050;
line-height: 28px;
letter-spacing: 0.3;
}
ul li, ul li a, ol li, ol li a {
font-family: arimo, "Microsoft YaHei";
color: #888888;
}
a:hover, a:focus {
text-decoration: none;
outline: none;
}
.theme-layout {
float: left;
width: 100%;
}
.theme-layout.boxed {
background: none repeat scroll 0 0 #FFFFFF;
float: none;
margin: 0 auto;
overflow: hidden;
position: relative;
z-index: 1;
width: 1230px;
-webkit-box-shadow: 0 0 6px #747474;
-moz-box-shadow: 0 0 6px #747474;
-ms-box-shadow: 0 0 6px #747474;
-o-box-shadow: 0 0 6px #747474;
box-shadow: 0 0 6px #747474;
}
section {
float: left;
position: relative;
width: 100%;
}
.block {
float: left;
width: 100%;
padding: 70px 0;
position: relative;
}
.block.parallax-sec {
padding: 90px 0;
}
.block .container {
padding: 0;
}
.container {
padding: 0;
}
.block.remove-gap {
padding-top: 0;
}
.block.no-padding {
padding: 0;
}
.block.remove-bottom {
padding-bottom: 0;
}
.block.gray, .gray {
background-color: #f9f9f9;
}
.overlap {
margin-top: -150px;
z-index: 2;
}
.block.overlap .container {
background-color: #FFF;
border-left: 30px solid #ffffff;
border-right: 30px solid #ffffff;
border-top: 30px solid #ffffff;
margin-top: -90px;
width: 1230px;
-webkit-border-radius: 3px 3px 0 0;
-moz-border-radius: 3px 3px 0 0;
-ms-border-radius: 3px 3px 0 0;
-o-border-radius: 3px 3px 0 0;
border-radius: 3px 3px 0 0;
}
.block.gray.overlap .container {
border-color: #f9f9f9;
background-color: #f9f9f9;
}
.remove-ext {
float: left;
margin-bottom: -30px;
width: 100%;
}
iframe {
width: 100%;
border: 0;
}
.parallax, .fixed-bg {
height: 100%;
width: 100%;
margin: 0;
position: absolute;
left: 0;
top: 0;
z-index: -2;
}
.fixed-bg {
background-attachment: fixed !important;
background-size: cover!important;
}
.blackish:before, .coloured:before, .whitish:before, .purple:before {
background: none repeat scroll 0 0 #000000;
content: "";
height: 100%;
left: 0;
opacity: 0.8;
position: absolute;
top: 0;
width: 100%;
z-index: -1;
}
.coloured:before {
opacity: 0.9;
}
.whitish:before {
background-color: #FFFFFF;
opacity: 0.95;
}
.blur {
position: relative;
float: left;
width: 100%;
}
.blur:after {
content: "";
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: -1;
-webkit-box-shadow: 0 0 133px 131px #FFF inset;
-moz-box-shadow: 0 0 133px 131px #FFF inset;
-ms-box-shadow: 0 0 133px 131px #FFF inset;
-o-box-shadow: 0 0 133px 131px #FFF inset;
box-shadow: 0 0 133px 131px #FFF inset;
}
iframe {
border: 0;
width: 100%;
float: left;
}
.default-pattern:before, .pattern:before {
background: url("http://www.b5.com/skin/images/pattern.png") repeat scroll 0 0 rgba(97, 22, 45, 0.9);
content: "";
height: 100%;
width: 100%;
position: absolute;
left: 0;
top: 0;
}
.pattern:before {
background: url("http://www.b5.com/skin/images/pattern.png") repeat scroll 0 0 rgba(27, 27, 27, 0.95);
}
.purple::before {
background-color: #61162d;
opacity: 0.9;
}
.parallax.still {
background-position: 50% 50% !important;
}
.circular > a, .video, .cause, .event-toggle, .volunteer, .volunteer-inner > a, .sponsor, .upcoming-eventbar, .join-us > a, .join-btn, .blog-post, .enter-amount > input, .product, .product-img > a, .urgent, .urgent:before, .urgent-detail > a, .clients-testimonials, .big-btn, .deal-detail img, .toggle-item, .don-amt > strong, .service-box, .upcoming-event, .widget-post > a, .video-widget, a.theme-btn, .theme-btn, .counter-box, .widget li a, .page-gallery-img a::before, .field, .button, .contact-form button, .contact-form input, .contact-form textarea, .popup-centralize, .payment-box, .donation-figures li a, .proceed, .payment-type .nav li a, .textfield input, .textfield textarea, .newsletter-signup form input, .slide-button, .blackbox, header.dark-header .menu .container, .popup-form, .popup-form > form input, .gallery-widget .row > div a {
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
-ms-border-radius: 3px;
-o-border-radius: 3px;
border-radius: 3px;
}
.circular > div canvas, .event-toggle:before, .sponsors-carousel .owl-nav > div, .toggle-item h2:before, .toggle-item h2:after, .service-carousel .owl-nav > div, .review > img, .gallery-popup a, .tagclouds > a span::before, .skills > span, .social a {
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
-ms-border-radius: 50%;
-o-border-radius: 50%;
border-radius: 50%;
}
.circular > a:before, .video > a, .video iframe, .cause-detail > h3 a, .cause-img > a.donate-btn, .cause-img > span, .event-bar h3 a, .event-toggle ul.meta li, .event-toggle ul.meta li a, .event-toggle:before, .sponsor, .volunteer-inner > a, .event-intro h3 a, .join-us > a, .join-btn, .blog-detail > h3 a, ul.meta li a, .blog-img span img, .needed-donation > img, .enter-amount, .product > h4 a, .product-img:before, .product-img > a, .urgent-detail > a, .big-btn, .story-detail h3 a, .deal-desc > h4 a, .toggle-item h2, .toggle-item, .toggle-item h2:after, .upcoming-detail > h4 a, .service-box > h3 a, .service-carousel .owl-nav > div, .service-block-inner h3 a, .post-img > span, .page-title > ul li a, .gallery-detail h3 a, .gallery-popup, .gallery-popup a, .gallery-detail, .story-img:before, .story-img > a, .welfare-project:before, .welfare-project:after, a.theme-btn, .theme-btm, .project-info, .project-hover, a.theme-btn:before, .theme-btn:before, .overlay-title, .overlay-donation, .widget li a, .event-overlay-inner h5 a, .page-gallery-img::before, .page-gallery-img::after, .page-gallery-img a::before, .tagclouds > a span:before, .tagclouds > a span::after, .comment > a, .button, .cause-detail > strong a, .contact-form button, .member-social, .member-img:before, .member-img:after, .social-links > a, .team-member > h4 a, .member-img > img, #team-detail-img > ul li, #team-detail-img li p, .frequency li a:before, .wpdonation-button, .donation-figures li a, .your-donation .proceed, .payment-type .nav li a, .social a, nav > ul > li.menu-item-has-children > a:before, nav > ul > li ul li a, nav > ul > li ul:before, nav > ul > li ul li.menu-item-has-children:before, .sideheader-menu > ul li a, .sideheader, .sideheader .c-hamburger, .sideheader.fancy .sideheader-menu > ul li a:after, header .menu .logo img, header nav > ul > li > a, header.dark-header .menu .container, .menu-links, body, .urgentcause-gallery a:before, .urgentcause-gallery a:after, .gallery-img a:before, .gallery-img a:after, .service-box, .blog-img a, .blog-img a i, .donate-btn:after, .donate-btn > i {
-webkit-transition: all 0.3s linear;
-moz-transition: all 0.3s linear;
-ms-transition: all 0.3s linear;
-o-transition: all 0.3s linear;
transition: all 0.3s linear;
}
header#header-sec {
float: left;
overflow: visible;
position: relative;
width: 100%;
z-index: 10000000000;
}
.topbar {
float: left;
width: 100%;
}
.inline-list {
float: left;
list-style: outside none none;
margin: 0 0 0 30px;
padding: 12px 0;
}
.inline-list > li {
float: left;
font-size: 11px;
margin-right: 30px;
padding-right: 30px;
letter-spacing: 0.3px;
position: relative;
}
.inline-list > li:before {
background: none repeat scroll 0 0 #494949;
content: "";
height: 14px;
margin-top: -7px;
position: absolute;
right: 0;
top: 50%;
width: 1px;
}
.inline-list > li:last-child:before {
display: none;
}
.inline-list > li:last-child {
margin: 0;
padding: 0;
}
.inline-list > li a {
font-size: inherit;
color: inherit;
letter-spacing: inherit;
}
.inline-list > li i {
font-size: 14px;
margin-right: 10px;
}
.inline-list.registration-btn > li a {
font-size: 10px;
}
.menu {
background: none repeat scroll 0 0 #ffffff;
width: 100%;
position: absolute;
left: 0;
top: 100%;
}
.menu .container {
display: table;
}
.logo {
vertical-align: middle;
display: table-cell;
}
nav {
padding: 0;
vertical-align: middle;
display: table-cell;
}
nav > ul {
float: right;
list-style: outside none none;
margin: 0px;
padding: 0px;
}
nav > ul > li {
float: left;
position: relative;
}
nav > ul > li > a {
color: #343434;
float: left;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 14px;
padding: 40px 25px;
position: relative;
text-align: center;
}
nav > ul > li ul {
list-style: outside none none;
padding: 20px 0;
width: 260px;
position: absolute;
top: 100%;
left: -9999px;
-webkit-transform: translateY(-10px);
-moz-transform: translateY(-10px);
-ms-transform: translateY(-10px);
-o-transform: translateY(-10px);
transform: translateY(-10px);
-webkit-transition: transform 0.2s linear;
-moz-transition: transform 0.2s linear;
-ms-transition: transform 0.2s linear;
-o-transition: transform 0.2s linear;
transition: transform 0.2s linear;
}
nav > ul > li:hover > ul {
left: 0;
-webkit-transform: translateY(0);
-moz-transform: translateY(0);
-ms-transform: translateY(0);
-o-transform: translateY(0);
transform: translateY(0);
}
nav > ul > li ul:before, nav > ul > li ul:after {
content: "";
position: absolute;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
opacity: 0;
background: transparent url("http://www.b5.com/skin/images/dropdown.jpg") no-repeat scroll 0px 0 / cover;
z-index: -1;
}
nav > ul > li ul:after {
background: #FFF;
opacity: 0.85;
}
nav > ul > li > ul li > ul {
padding: 20px 0;
-webkit-transform: translateX(-10px);
-moz-transform: translateX(-10px);
-ms-transform: translateX(-10px);
-o-transform: translateX(-10px);
transform: translateX(-10px);
-webkit-transition: transform 0.2s linear;
-moz-transition: transform 0.2s linear;
-ms-transition: transform 0.2s linear;
-o-transition: transform 0.2s linear;
transition: transform 0.2s linear;
}
nav > ul > li > ul li:hover > ul {
left: 100%;
top: 0;
-webkit-transform: translateX(0);
-moz-transform: translateX(0);
-ms-transform: translateX(0);
-o-transform: translateX(0);
transform: translateX(0);
}
nav > ul > li ul li {
float: left;
opacity: 0;
width: 100%;
padding: 0 40px;
position: relative;
-webkit-transition: all 0.2s linear;
-moz-transition: all 0.2s linear;
-ms-transition: all 0.2s linear;
-o-transition: all 0.2s linear;
transition: all 0.2s linear;
}
nav > ul > li:hover > ul > li, nav > ul > li > ul li:hover > ul li {
opacity: 1;
}
nav > ul > li:hover > ul:before, nav > ul > li > ul li:hover > ul:before {
opacity: 1
}
nav > ul > li ul li a {
float: left;
padding: 12px 0px;
width: 100%;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 13px;
color: #2e2e2e;
border-bottom: 1px solid #dfdfdf;
}
nav > ul > li ul li:last-child > a {
border: 0;
}
.header-donate:hover {
background: #FFF;
}
header.dark-header .menu {
background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
}
header.dark-header {
margin: 0 !important;
}
header.dark-header .menu .container {
background: rgba(0, 0, 0, 0.5) none repeat scroll 0 0;
margin-top: 10px;
padding: 0 30px;
}
header.dark-header nav > ul > li > a {
color: #FFF;
padding: 35px 25px;
}
header.dark-header nav > ul > li ul::after {
background: #000000;
}
header.dark-header nav > ul > li ul li a {
border-bottom: 1px solid #404040;
color: #efefef;
}
header.dark-header .menu .theme-btn {
margin-top: 20px;
}
.topbar.dark {
background: none repeat scroll 0 0 #3a3a3a;
}
.topbar.dark .inline-list > li {
color: #d8d8d8;
}
.sideheader {
background: #ffffff none repeat scroll 0 0;
height: 100%;
z-index: 1000000000;
position: fixed;
left: -370px;
top: 0;
width: 370px;
padding: 40px;
-webkit-box-shadow: 0 0 13px #9f9f9f;
-moz-box-shadow: 0 0 13px #9f9f9f;
-ms-box-shadow: 0 0 13px #9f9f9f;
-o-box-shadow: 0 0 13px #9f9f9f;
box-shadow: 0 0 13px #9f9f9f;
}
.sideheader.show {
left: 0;
}
.sideheader .c-hamburger {
position: absolute;
right: -48px;
top: 0;
}
.sideheader.show .c-hamburger {
right: 0;
}
.sideheader .logo {
float: left;
margin: 20px 0 50px;
text-align: center;
width: 100%;
}
.sideheader-menu {
background: rgba(0, 0, 0, 0) url("http://www.b5.com/skin/images/sideheader.jpg") repeat scroll 0 0 / cover;
float: left;
max-height: 400px;
padding: 0 !important;
width: 100%;
}
.sideheader-menu > ul {
list-style: outside none none;
margin: 0;
padding: 0;
}
.sideheader-menu > ul li {
float: left;
margin-bottom: 10px;
padding: 30px 40px;
position: relative;
text-align: center;
width: 100%;
z-index: 1;
}
.sideheader-menu > ul li a {
color: #ffffff;
float: left;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 15px;
font-weight: 600;
width: 100%;
}
.sideheader-menu > ul li:before {
background: #ffffff none repeat scroll 0 0;
content: "";
height: 10px;
width: 100%;
position: absolute;
bottom: -10px;
left: 0;
}
.sideheader-menu > ul li:after {
background: #000000;
content: "";
height: 100%;
width: 100%;
opacity: 0.85;
z-index: -1;
position: absolute;
left: 0;
top: 0;
}
.sideheader-menu > ul li ul {
display: none;
float: left;
list-style: outside none none;
margin: 20px 0 0;
padding: 0;
width: 100%;
}
.sideheader-menu > ul li ul li {
padding: 0;
}
.sideheader-menu > ul li ul li:before, .sideheader-menu > ul li ul li:after {
display: none;
}
.sideheader-menu > ul li ul li a {
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 13px;
font-weight: 300;
}
.track3 {
width: 10px;
background-color: transparent;
margin-right: 2px;
-webkit-border-radius: 10px;
border-radius: 10px;
}
.track3:hover, .track3.dragging {
background: #cccccc;
background: rgba(0, 0, 0, 0.2);
}
.handle3 {
width: 7px;
background: #8c8c8c;
background: rgba(0, 0, 0, 0.45);
-webkit-border-radius: 7px;
border-radius: 7px;
right: 0;
-webkit-transition: width 250ms;
transition: width 250ms;
}
.track3:hover .handle3, .track3.dragging .handle3 {
width: 10px;
}
.sideheader-bottom {
float: left;
margin-top: 20px;
text-align: center;
width: 100%;
}
.sideheader-bottom > p {
color: #626060;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 13px;
font-weight: 300;
margin: 0;
padding: 0 20px;
}
.sideheader-bottom > p i {
font-style: normal;
}
.sideheader.fancy .sideheader-menu {
background: none;
}
.sideheader.fancy .sideheader-menu > ul > li {
padding: 5px 10px;
}
.sideheader.fancy .sideheader-menu > ul li:before, .sideheader.fancy .sideheader-menu > ul li:after {
display: none;
}
.sideheader-menu .sideheader-menu > ul li a {
color: #363535;
}
.sideheader.fancy .sideheader-menu > ul li a {
color: #363535;
}
.sideheader.fancy .sideheader-menu > ul li a:after {
content: "\f101";
display: inline-block;
font-family: fontawesome;
font-weight: 500;
margin-left: 4px;
width: 10px;
opacity: 0;
-webkit-transform: translateX(-10px);
-moz-transform: translateX(-10px);
-ms-transform: translateX(-10px);
-o-transform: translateX(-10px);
transform: translateX(-10px);
}
.sideheader.fancy .sideheader-menu > ul li a.active:after {
opacity: 1;
-webkit-transform: translateX(0);
-moz-transform: translateX(0);
-ms-transform: translateX(0);
-o-transform: translateX(0);
transform: translateX(0);
}
.side-megamenu {
background: #FFF url("http://www.b5.com/skin/images/dropdown.jpg") no-repeat scroll 0 0 / cover;
left: -99999px;
padding: 90px 30px 90px 270px;
position: fixed;
top: 250px;
width: 750px;
-webkit-border-radius: 0 3px 3px 0;
-moz-border-radius: 0 3px 3px 0;
-ms-border-radius: 0 3px 3px 0;
-o-border-radius: 0 3px 3px 0;
border-radius: 0 3px 3px 0;
-webkit-transform: translateY(0);
-moz-transform: translateY(0);
-ms-transform: translateY(0);
-o-transform: translateY(0);
transform: translateY(0);
opacity: 0;
-webkit-transition: -webkit-transform 0.3s linear, opacity 0.3s linear;
-moz-transition: -moz-transform 0.3s linear, opacity 0.3s linear;
-ms-transition: -ms-transform 0.3s linear, opacity 0.3s linear;
-o-transition: -o-transform 0.3s linear, opacity 0.3s linear;
transition: transform 0.3s linear, opacity 0.3s linear;
}
.sideheader-menu > ul li .side-megamenu.active {
left: 370px;
opacity: 1;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
}
.side-megamenu h4 {
color: #353535;
float: left;
font-size: 18px;
font-weight: 600;
margin: 0 0 20px;
text-align: left;
width: 100%;
}
.sideheader-menu > ul li .side-megamenu ul {
display: block;
margin: 0;
}
.sideheader-menu > ul li .side-megamenu ul li {
text-align: left;
}
.sideheader.fancy .c-hamburger {
background: #000000 none repeat scroll 0 0;
right: -48px;
width: 48px;
-webkit-border-radius: 0 3px 3px 0;
-moz-border-radius: 0 3px 3px 0;
-ms-border-radius: 0 3px 3px 0;
-o-border-radius: 0 3px 3px 0;
border-radius: 0 3px 3px 0;
}
.sideheader.fancy .c-hamburger span, .sideheader.fancy .c-hamburger span:before, .sideheader.fancy .c-hamburger span:after {
background: #FFF;
}
.sideheader.fancy .c-hamburger--htx.is-active span {
background: none;
}
.c-hamburger {
display: block;
position: relative;
overflow: hidden;
margin: 0;
padding: 0;
width: 48px;
height: 48px;
font-size: 0;
text-indent: -9999px;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
box-shadow: none;
border-radius: none;
border: none;
cursor: pointer;
-webkit-transition: background 0.3s;
transition: background 0.3s;
}
.c-hamburger:focus {
outline: none;
}
.c-hamburger span {
background: #b7b7b7 none repeat scroll 0 0;
display: block;
height: 2px;
left: 25%;
position: absolute;
top: 24px;
width: 50%;
}
.c-hamburger span:before, .c-hamburger span:after {
position: absolute;
display: block;
left: 0;
width: 100%;
height: 2px;
background-color: #b7b7b7;
content: "";
}
.c-hamburger span:before {
top: -7px;
}
.c-hamburger span:after {
bottom: -7px;
}
.c-hamburger--htx {
background: none;
}
.c-hamburger--htx span {
-webkit-transition: background 0s 0.3s;
transition: background 0s 0.3s;
}
.c-hamburger--htx span::before, .c-hamburger--htx span::after {
-webkit-transition-duration: 0.3s, 0.3s;
transition-duration: 0.3s, 0.3s;
-webkit-transition-delay: 0.3s, 0s;
transition-delay: 0.3s, 0s;
}
.c-hamburger--htx span::before {
-webkit-transition-property: top, -webkit-transform;
transition-property: top, transform;
}
.c-hamburger--htx span::after {
-webkit-transition-property: bottom, -webkit-transform;
transition-property: bottom, transform;
}
.c-hamburger--htx.is-active span {
background: none;
}
.c-hamburger--htx.is-active span::before {
top: 0;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
}
.c-hamburger--htx.is-active span::after {
bottom: 0;
-webkit-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
transform: rotate(-45deg);
}
.c-hamburger--htx.is-active span::before, .c-hamburger--htx.is-active span::after {
-webkit-transition-delay: 0s, 0.3s;
transition-delay: 0s, 0.3s;
}
header.sticky .menu {
left: 0;
position: fixed;
top: 0;
width: 100%;
background: rgba(255,255,255, 0.97);
}
header.sticky .menu .logo {
margin: 10px 0;
}
header .menu .logo img {
max-width: 230px;
}
header.sticky .menu .logo img {
max-width: 110px;
}
header.sticky nav > ul > li > a {
padding: 27px 25px;
}
header.sticky .menu .theme-btn {
margin-top: 12px;
}
header.sticky.dark-header .menu {
background: none;
}
header.sticky.dark-header .menu .container {
margin-top: 0;
}
header.dark-header.sticky .menu .container {
background: rgba(0, 0, 0, 0.7) none repeat scroll 0 0;
}
#responsive-header {
display: none;
}
#responsive-header .topbar ul {
float: left;
margin: 0;
text-align: center;
width: 100%;
}
#responsive-header .topbar ul li {
display: inline-block;
float: none;
}
#responsive-header .topbar ul {
padding: 3px 0;
}
#responsive-header .social-media > li a {
font-size: 12px;
height: 30px;
line-height: 30px;
width: 30px;
}
#responsive-menu {
background: none repeat scroll 0 0 #171717;
float: left;
width: 100%;
padding: 10px 30px;
position: relative;
}
#responsive-menu .logo {
float: left;
margin: 0;
}
#responsive-menu .logo img {
width: 120px;
}
#responsive-menu > span {
float: right;
width: 40px;
text-align: center;
height: 40px;
line-height: 40px;
color: #FFF;
background: #3F3F3F;
font-size: 14px;
cursor: pointer;
}
.menu-links {
background: none repeat scroll 0 0 #171717;
height: 100%;
padding: 50px 20px 20px;
width: 200px!important;
z-index: 10000;
position: fixed;
right: -200px;
top: 0;
}
.menu-links.slide {
right: 0;
}
.menu-links > ul {
float: left;
margin: 0;
padding: 0;
width: 100%!important;
height: 100%;
list-style: outside none none;
}
.menu-links > ul li {
float: left;
position: relative;
width: 100%;
}
.menu-links > ul li a {
color: #bfbfbf;
font-family: arimo, "Microsoft YaHei";
font-size: 12px;
padding: 10px 0;
float: left;
width: 100%;
}
.menu-links > ul li:before, .menu-links > ul li:after {
background: none repeat scroll 0 0 #404040;
content: "";
height: 1px;
width: 100%;
position: absolute;
bottom: 0;
left: 0;
}
.menu-links > ul li:after {
background: #000000;
bottom: 1px;
}
.menu-links > ul li ul {
float: left;
list-style: outside none none;
margin: 0;
padding: 0 0 0 20px;
width: 100%;
display: none;
}
#responsive-header .topbar {
display: none;
background: #272727;
}
#responsive-menu span.show-topbar {
background: none repeat scroll 0 0 #3f3f3f;
color: #ffffff;
line-height: 30px;
margin-left: -15px;
text-align: center;
height: 30px;
width: 30px;
cursor: pointer;
position: absolute;
left: 50%;
top: 0;
-webkit-border-radius: 0 0 3px 3px;
-moz-border-radius: 0 0 3px 3px;
-ms-border-radius: 0 0 3px 3px;
-o-border-radius: 0 0 3px 3px;
border-radius: 0 0 3px 3px;
}
.show-topbar i {
color: #ffffff;
float: left;
line-height: 30px;
width: 100%;
}
.show-topbar.slide i {
-webkit-transform: rotate(180deg);
-moz-transform: rotate(180deg);
-ms-transform: rotate(180deg);
-o-transform: rotate(180deg);
transform: rotate(180deg);
}
.popup {
background: none repeat scroll 0 0 rgba(0, 0, 0, 0.95);
height: 100%;
width: 100%;
overflow: auto;
display: none;
z-index: 100000000000;
position: fixed;
left: 0;
top: 0;
}
.popup-centre {
height: 100%;
width: 100%;
text-align: center;
position: absolute;
left: 0;
top: 0;
}
.popup-centre::before {
content: "";
display: inline-block;
height: 100%;
vertical-align: middle;
}
.popup-form {
background-image: url("http://www.b5.com/skin/images/popup-bg.jpg");
background-size: cover;
display: none;
overflow: hidden;
padding: 70px 60px;
position: relative;
text-align: left;
vertical-align: middle;
width: 570px;
z-index: 1;
}
.popup-form.active {
display: inline-block;
}
.popup-form:before {
background: none repeat scroll 0 0 rgba(60, 76, 85, 0.9);
content: "";
height: 100%;
width: 100%;
z-index: -1;
position: absolute;
left: 0;
top: 0;
}
.popup-form > span {
color: #ffffff;
font-family: arimo, "Microsoft YaHei";
font-size: 17px;
cursor: pointer;
position: absolute;
right: 40px;
top: 40px;
}
.popup-form > strong {
color: #ffffff;
float: left;
font-family: arimo, roboto slab, "Microsoft YaHei";
font-size: 24px;
letter-spacing: 0.5px;
line-height: 23px;
margin-bottom: 10px;
width: 100%;
}
.popup-form > p {
color: #e3e3e3;
float: left;
font-size: 13px;
line-height: 26px;
margin-bottom: 30px;
width: 100%;
}
.popup-form > form {
float: left;
width: 100%;
}
.popup-form > form input {
border: 0 none;
color: #5b6e79;
float: left;
font-family: arimo, "Microsoft YaHei";
font-size: 11px;
height: 49px;
margin-bottom: 10px;
padding: 10px 20px;
width: 100%;
}
.popup-form > form p {
color: #FFF;
font-size: 13px;
font-family: arimo, "Microsoft YaHei";
letter-spacing: 0.6px;
line-height: 20px;
margin: 10px 0 20px;
}
.popup-form > form p a {
text-decoration: underline;
}
.popup-form > form input[type="submit"] {
text-transform: uppercase;
width: auto;
height: auto;
margin: 0;
padding: 14px 30px;
color: #FFF;
background: black;
}
.slide-title {
font-family: arimo, roboto, "Microsoft YaHei";
color: #FFF;
font-weight: 400;
letter-spacing: 0.5px;
}
.slide-subtitle {
font-family: arimo, roboto slab, "Microsoft YaHei";
color: #FFF;
}
.slide-text {
font-family: arimo, roboto slab, "Microsoft YaHei";
font-weight: 700;
color: #FFF;
}
.blackbox {
background: rgba(0,0,0,0.7);
font-family: arimo, roboto, "Microsoft YaHei";
color: #FFF;
letter-spacing: 4px;
}
.blackbox i {
font-style: normal;
}
.slide-subtitle i {
color: #111111;
font-weight: 800;
font-style: normal;
}
.urgent-cause {
float: left;
width: 100%;
}
.urgentcause-detail, .who-we-text {
float: left;
width: 100%;
position: relative;
z-index: 1;
}
.who-we-text p {
font-size: 13px;
color: #646464;
}
.urgentcause-detail > span {
float: left;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 13px;
line-height: 15px;
margin-bottom: 15px;
width: 100%;
}
.urgentcause-detail > span i {
margin-right: 10px;
}
.urgentcause-detail h3 {
color: #454545;
float: left;
font-size: 24px;
font-weight: 700;
margin: 0 0 20px;
text-transform: uppercase;
width: 100%;
}
.gray .urgentcause-detail:before, .gray .who-we-text:before {
background: #f8f8f8;
}
.urgentcause-detail > p {
font-size: 13px;
float: left;
width: 100%;
margin: 0;
}
.urgentcause-detail > p a {
margin-left: 9px;
font-size: 12px;
}
.urgent-progress {
float: left;
margin-top: 40px;
text-align: center;
width: 90%;
margin: 40px 5% 0;
}
.urgent-progress .row > div {
display: inline-block;
float: none;
vertical-align: middle;
margin-left: -3px;
padding-left: 18px;
}
.amount {
float: left;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 36px;
font-weight: 600;
letter-spacing: 0.3px;
width: 100%;
}
.amount > i {
display: inline-block;
font-style: normal;
}
.amount > span {
color: #777777;
float: left;
font-size: 11px;
font-weight: 400;
text-align: center;
text-transform: uppercase;
width: 100%;
margin-top: 5px;
}
.circular {
float: left;
position: relative;
width: 100%;
}
.circular > div {
float: left;
height: 100% !important;
position: relative;
width: 100% !important;
}
.circular > div:before {
content: "%";
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 32px;
font-weight: 200;
position: absolute;
right: -26px;
top: 38px;
width: 100%;
}
.circular > div canvas {
background: #ffffff none repeat scroll 0 0;
height: 100% !important;
overflow: hidden;
width: 100% !important;
}
.circular > div input {
color: #303030 !important;
font-family: roboto !important;
font-size: 32px !important;
font-weight: 200 !important;
height: auto !important;
left: -10px;
margin: 0 !important;
position: absolute;
top: 40px;
width: 100% !important;
}
.circular > a {
background: #414141 none repeat scroll 0 0;
bottom: 40px;
color: #eeeeee;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 10px;
font-weight: 300;
left: 50%;
line-height: 15px;
overflow: hidden;
padding: 5px 12px;
position: absolute;
white-space: nowrap;
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
transform: translateX(-50%);
}
.circular > a:before {
background: #ffffff;
content: "";
height: 100%;
position: absolute;
left: 50%;
top: 0;
width: 0;
z-index: -1;
}
.circular > a:hover:before {
left: 0;
width: 100%;
}
.circular span {
position: absolute;
left: 0;
bottom: 38px;
width: 100%;
text-align: center;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 12px;
font-weight: 300;
}
.urgentcause-gallery {
float: left;
width: 100%;
}
.urgentcause-gallery a {
float: left;
width: 100%;
}
.urgentcause-gallery a img {
width: 100%;
}
.urgentcause-gallery a:before, .gallery-img a:before {
background: #000000 none repeat scroll 0 0;
content: "";
height: 100%;
width: 100%;
opacity: 0;
position: absolute;
left: 0;
top: 0;
}
.urgentcause-gallery a:hover:before, .gallery-img a:hover:before {
opacity: 0.7;
}
.urgentcause-gallery a:after, .gallery-img a:after {
color: #ffffff;
content: "\f065";
font-family: fontawesome;
font-size: 22px;
height: 40px;
left: 50%;
line-height: 40px;
position: absolute;
text-align: center;
top: 50%;
width: 40px;
-webkit-transform: translateX(-50%) translateY(-50%) scale(0);
-moz-transform: translateX(-50%) translateY(-50%) scale(0);
-ms-transform: translateX(-50%) translateY(-50%) scale(0);
-o-transform: translateX(-50%) translateY(-50%) scale(0);
transform: translateX(-50%) translateY(-50%) scale(0);
}
.urgentcause-gallery a:hover:after, .gallery-img a:hover:after {
-webkit-transform: translateX(-50%) translateY(-50%) scale(1);
-moz-transform: translateX(-50%) translateY(-50%) scale(1);
-ms-transform: translateX(-50%) translateY(-50%) scale(1);
-o-transform: translateX(-50%) translateY(-50%) scale(1);
transform: translateX(-50%) translateY(-50%) scale(1);
}
.urgentcause-gallery > div {
padding: 0 0.5px;
margin-bottom: 1px;
}
.urgent-cause-list {
float: left;
width: 100%;
margin-bottom: -50px;
}
.urgent-cause-list .urgent-cause {
margin-bottom: 50px;
}
.title {
float: left;
margin-bottom: 40px;
text-align: center;
width: 100%;
}
.title > span {
color: #505050;
float: left;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 14px;
font-weight: 300;
letter-spacing: 0.3px;
margin-top: 10px;
width: 100%;
}
.title h2 {
color: #3f3f3f;
float: left;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 33px;
font-weight: 600;
margin: 0;
width: 100%;
}
.title h2 span {
font-weight: 300;
}
.title.light > span, .title.light h2 {
color: #FFF;
}
.title > p {
float: left;
font-family: arimo, "Microsoft YaHei";
font-size: 15px;
margin: 15px 30% 0;
width: 40%;
}
.title.light > p {
color: #cacaca;
}
.title.style2 {
text-align: left;
}
.title.style2 h2 {
font-size: 26px;
font-weight: 500;
position: relative;
}
.title.style2 > span {
background: #ffffff none repeat scroll 0 0;
padding-right: 20px;
width: auto;
position: relative;
}
.gray .title.style2 > span {
background: #f9f9f9;
}
.title.style2 h2::before {
background: #e4e4e4 none repeat scroll 0 0;
content: "";
height: 1px;
width: 100%;
z-index: 0;
position: absolute;
bottom: -20px;
left: 0;
}
.title.style2 > span::before {
background: #e4e4e4 none repeat scroll 0 0;
content: "";
height: 3px;
position: absolute;
right: 0;
top: 11px;
width: 60px;
-webkit-transform: translateX(100%);
-moz-transform: translateX(100%);
-ms-transform: translateX(100%);
-o-transform: translateX(100%);
transform: translateX(100%);
}
.video {
float: left;
min-height: 300px;
overflow: hidden;
position: relative;
width: 100%;
}
.video > img {
width: 100%;
}
.video > a {
font-size: 25px;
height: 70px;
width: 70px;
line-height: 55px;
text-align: center;
margin-left: -35px;
margin-top: -35px;
z-index: 1;
position: absolute;
left: 50%;
top: 50%;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
-ms-border-radius: 50%;
-o-border-radius: 50%;
border-radius: 50%;
}
.video.active > a {
-webkit-transform: scale(0);
-moz-transform: scale(0);
-ms-transform: scale(0);
-o-transform: scale(0);
transform: scale(0);
}
.video > a.pause {
font-size: 12px;
height: 40px;
line-height: 29px;
margin: 0;
width: 40px;
top: 20px;
left: 20px;
-webkit-transform: scale(0);
-moz-transform: scale(0);
-ms-transform: scale(0);
-o-transform: scale(0);
transform: scale(0);
}
.video > a::before {
color: #ffffff;
content: "\f16a";
font-family: fontawesome;
font-size: 72px;
line-height: 55px;
text-shadow: 0 1px 7px #202020;
}
.video > a.pause:before {
content: "\f04c";
font-size: 15px;
line-height: 29px;
}
.video.active > a.pause {
-webkit-transform: scale(1);
-moz-transform: scale(1);
-ms-transform: scale(1);
-o-transform: scale(1);
transform: scale(1);
}
.video iframe {
opacity: 0;
height: 100%;
width: 100%;
position: absolute;
left: 0;
top: 0;
-webkit-transform: scale(0.8);
-moz-transform: scale(0.8);
-ms-transform: scale(0.8);
-o-transform: scale(0.8);
transform: scale(0.8);
}
.video.active iframe {
opacity: 1;
-webkit-transform: scale(1);
-moz-transform: scale(1);
-ms-transform: scale(1);
-o-transform: scale(1);
transform: scale(1);
}
.events {
float: left;
width: 100%;
margin-bottom: -10px;
}
.event-toggle {
background: #ffffff none repeat scroll 0 0;
cursor: pointer;
float: left;
margin-bottom: 10px;
padding: 30px 40px 30px 150px;
position: relative;
width: 100%;
-webkit-box-shadow: 0 1px 3px #dfdfdf;
-moz-box-shadow: 0 1px 3px #dfdfdf;
-ms-box-shadow: 0 1px 3px #dfdfdf;
-o-box-shadow: 0 1px 3px #dfdfdf;
box-shadow: 0 1px 3px #dfdfdf;
}
.event-bar {
float: left;
width: 100%;
}
.event-bar h3 {
float: left;
font-size: 15px;
font-weight: 600;
line-height: 24px;
margin: 0px 0 10px;
width: 100%;
padding-right: 60px;
}
.event-bar h3 a {
color: inherit;
}
.event-toggle:before {
background: #ffffff;
border: 3px solid #f8f8f8;
color: #dfdfdf;
content: "\f107";
font-family: fontawesome;
height: 26px;
line-height: 20px;
margin-top: -13px;
text-align: center;
width: 26px;
position: absolute;
right: -13px;
top: 50%;
}
.event-toggle:hover:before, .event-toggle.active:before {
-webkit-transform: rotate(180deg);
-moz-transform: rotate(180deg);
-ms-transform: rotate(180deg);
-o-transform: rotate(180deg);
transform: rotate(180deg);
}
.event-bar > div {
padding: 0;
}
.count-down {
float: left;
width: 100%;
}
.countdown-period {
left: 0;
position: absolute;
top: 0;
width: 100%;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 11px;
color: #888888;
}
.countdown-amount {
float: left;
width: 100%;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 20px;
font-weight: 600;
}
.countdown-section {
float: left;
padding-top: 20px;
position: relative;
text-align: center;
width: 25%;
}
.countdown-section:before {
content: "";
position: absolute;
}
.countdown-section:before {
border-left: 1px dashed #e1e1e1;
content: "";
height: 30px;
margin-top: -15px;
position: absolute;
right: 0;
top: 50%;
width: 1px;
}
.countdown-section:last-child:before {
display: none;
}
.event-desc {
border-top: 1px dashed #e1e1e1;
float: left;
margin-top: 30px;
padding-top: 20px;
width: 100%;
display: none;
}
.event-desc > p {
margin: 0;
}
ul.meta {
float: left;
list-style: outside none none;
margin: 0;
padding: 0;
width: 100%;
}
ul.meta li {
font-size: 11px;
padding: 0;
font-family: arimo, roboto, "Microsoft YaHei";
}
ul.meta li i {
font-size: 12px;
margin-right: 10px;
}
.event-toggle .event-date {
color: #514f4f;
}
.event-toggle .event-date strong {
color: #514f4f;
}
.event-toggle:after {
content: "";
position: absolute;
left: 120px;
top: 0;
width: 1px;
height: 100%;
background: #f9f9f9;
}
.event-toggle.active {
background: #fdfdfd;
}
.upcoming-eventbar.overlap {
margin-top: -40px;
}
.upcoming-eventbar {
background: url("http://www.b5.com/skin/images/event-bar.jpg") no-repeat scroll 0 0 / cover rgba(0, 0, 0, 0);
float: left;
margin-bottom: 20px;
padding: 10px 0 0 125px;
position: relative;
overflow: hidden;
width: 100%;
z-index: 10000;
-webkit-box-shadow: 0 4px 5px #e5e5e5;
-moz-box-shadow: 0 4px 5px #e5e5e5;
-ms-box-shadow: 0 4px 5px #e5e5e5;
-o-box-shadow: 0 4px 5px #e5e5e5;
box-shadow: 0 4px 5px #e5e5e5;
}
.upcoming-eventbar:before {
background: #000;
content: "";
height: 100%;
width: 100%;
opacity: 0.5;
z-index: -1;
position: absolute;
left: 0;
top: 0;
}
.event-date {
color: #f3f3f3;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 12px;
left: 0;
padding: 0 20px;
position: absolute;
text-align: center;
font-weight: 300;
text-transform: uppercase;
top: 50%;
width: 125px;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
}
.event-date > strong {
color: #ffffff;
float: left;
font-family: arimo, "Microsoft YaHei";
font-size: 30px;
width: 100%;
}
.event-inner {
background: #ffffff none repeat scroll 0 0;
display: table;
margin-bottom: 0;
padding: 40px 60px;
width: 100%;
-webkit-border-radius: 3px 0 0 0;
-moz-border-radius: 3px 0 0 0;
-ms-border-radius: 3px 0 0 0;
-o-border-radius: 3px 0 0 0;
border-radius: 3px 0 0 0;
}
.event-inner > img {
display: table-cell;
}
.event-intro {
display: table-cell;
vertical-align: middle;
width: 45%;
}
.event-intro h3 {
display: inline-block;
font-size: 16px;
font-weight: 600;
line-height: 30px;
margin: 0;
width: 70%;
}
.event-intro h3 a {
color: inherit;
}
.start-time {
display: table-cell;
vertical-align: middle;
width: 30%;
}
.join-us {
display: table-cell;
text-align: right;
vertical-align: middle;
width: 25%;
}
.start-time .count-down {
display: inline-block;
float: none;
vertical-align: middle;
}
a.theme-btn, .theme-btn, .slide-button {
border: 0 none;
color: #ffffff;
display: inline-block;
font-family: arimo, roboto slab, "Microsoft YaHei";
font-size: 11px;
font-weight: 500;
letter-spacing: 0.1px;
padding: 15px 35px;
position: relative;
vertical-align: middle;
}
a.theme-btn:hover, .theme-btn:hover, .slide-button:hover {
color: #FFF;
}
a.theme-btn:before, .theme-btn:before, .slide-button:before {
border-right: 20px solid rgba(0, 0, 0, 0.2);
border-top: 20px solid rgba(0, 0, 0, 0);
content: "";
height: 0;
width: 0;
position: absolute;
bottom: 3px;
right: 3px;
}
a.theme-btn:hover:before, .theme-btn:hover:before, .slide-button:hover:before {
border-right: 20px solid rgba(255, 255, 255, 1.0);
}
.volunteer {
float: left;
overflow: hidden;
position: relative;
width: 100%;
}
.volunteer > img {
width: 100%;
}
.volunteer-overlay {
background: rgba(0, 0, 0, 0.5) none repeat scroll 0 0;
height: 100%;
width: 100%;
text-align: center;
position: absolute;
left: 0;
top: 0;
}
.volunteer-overlay::before {
content: "";
display: inline-block;
height: 100%;
vertical-align: middle;
}
.volunteer-inner {
display: inline-block;
padding: 20px 0;
text-align: left;
vertical-align: middle;
width: 75%;
}
.volunteer-inner > span {
color: #ffffff;
float: left;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 26px;
font-weight: 200;
line-height: 30px;
margin-bottom: 20px;
width: 100%;
}
.volunteer-inner > strong {
color: #ffffff;
float: left;
font-family: arimo, roboto slab, "Microsoft YaHei";
font-size: 36px;
line-height: 44px;
margin-bottom: 20px;
width: 100%;
}
.volunteer-inner > strong i {
font-style: normal;
}
.volunteer-inner > p {
color: #FFF;
font-size: 13px;
letter-spacing: 0.3px;
float: left;
width: 100%;
margin-bottom: 30px;
}
.volunteer-inner > a {
margin-top: 20px;
text-transform: uppercase;
}
.volunteer-inner > a:hover {
color: #FFF;
}
.center .volunteer-inner {
text-align: center;
}
.col-md-3 .volunteer-inner > span {
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 22px;
margin-bottom: 10px;
}
.col-md-3 .volunteer-inner > strong {
color: #ffffff;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 24px;
line-height: 20px;
}
.needed {
float: left;
margin-bottom: -30px;
width: 100%;
}
.needed-donation {
float: left;
width: 100%;
margin-bottom: 30px;
position: relative;
overflow: hidden;
}
.needed-donation > img {
width: 100%;
}
.needed-donation:hover > img {
-webkit-transform: scale(1.2) rotate(10deg);
-moz-transform: scale(1.2) rotate(10deg);
-ms-transform: scale(1.2) rotate(10deg);
-o-transform: scale(1.2) rotate(10deg);
transform: scale(1.2) rotate(10deg);
}
.needed-donation:before {
background: #000000;
content: "";
opacity: 0.4;
height: 100%;
width: 100%;
z-index: 1;
position: absolute;
left: 0;
top: 0;
}
.overlay-title {
left: 0;
padding: 0 70px;
position: absolute;
text-align: center;
top: 50%;
width: 100%;
z-index: 1;
opacity: 1;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
}
.needed-donation:hover .overlay-title {
opacity: 0;
-webkit-transform: translateY(0);
-moz-transform: translateY(0);
-ms-transform: translateY(0);
-o-transform: translateY(0);
transform: translateY(0);
}
.overlay-title > h3 {
color: #ffffff;
float: left;
font-size: 18px;
font-weight: 600;
line-height: 30px;
margin: 0;
width: 100%;
}
.overlay-donation {
left: 0;
padding: 0 60px;
position: absolute;
text-align: center;
top: 50%;
width: 100%;
z-index: 1;
opacity: 0;
-webkit-transform: translateY(0);
-moz-transform: translateY(0);
-ms-transform: translateY(0);
-o-transform: translateY(0);
transform: translateY(0);
}
.needed-donation:hover .overlay-donation {
opacity: 1;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
}
.overlay-donation > span {
color: #ffffff;
float: left;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 36px;
font-weight: 700;
line-height: 36px;
margin-bottom: 30px;
width: 100%;
}
.overlay-donation > span i {
font-style: normal;
}
.join {
background-image: url("http://www.b5.com/skin/images/people.png");
background-position: center center;
float: left;
text-align: center;
width: 100%;
}
.join h3 {
color: #343434;
float: left;
font-size: 60px;
font-weight: 200;
line-height: 50px;
margin: 0 0 30px;
width: 100%;
}
.join h3 span {
font-weight: 700;
}
.join > p {
color: #646464;
font-size: 14px;
line-height: 30px;
margin: 0 auto 30px;
width: 80%;
}
.counters {
float: left;
width: 100%;
margin-top: 50px;
}
.counter-box {
background: #ffffff none repeat scroll 0 0;
float: left;
padding: 28px 30px;
position: relative;
text-align: center;
width: 100%;
z-index: 1;
-webkit-box-shadow: 0 1px 2px #dfdfdf;
-moz-box-shadow: 0 1px 2px #dfdfdf;
-ms-box-shadow: 0 1px 2px #dfdfdf;
-o-box-shadow: 0 1px 2px #dfdfdf;
box-shadow: 0 1px 2px #dfdfdf;
}
.counter-box > strong {
color: #343434;
float: left;
font-family: arimo, roboto slab, "Microsoft YaHei";
font-size: 33px;
line-height: 30px;
margin-bottom: 10px;
text-align: center;
width: 100%;
}
.counter-box > span {
float: left;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 13px;
font-weight: 300;
letter-spacing: 0.3px;
text-transform: uppercase;
width: 100%;
}
.counter-box > i {
bottom: 20px;
color: #f2f2f2;
font-size: 80px;
left: 50%;
padding-left: 100px;
position: absolute;
z-index: -1;
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
transform: translateX(-50%);
}
.blog-list {
float: left;
width: 100%;
margin-bottom: -50px;
}
.blog-post {
float: left;
margin-bottom: 50px;
width: 100%;
position: relative;
background: #FFF;
}
.blog-img {
float: left;
position: relative;
overflow: hidden;
width: 100%;
background: black;
}
.blog-img:hover span img {
opacity: 0.6
}
.blog-img > img {
width: 100%;
}
.gray .blog-img:before, .gray .blog-img:after {
background: #f9f9f9;
}
.blog-img::before, .blog-img::after {
background: #FFF none repeat scroll 0 0;
content: "";
height: 17px;
left: -4%;
z-index: 1;
position: absolute;
top: -10px;
width: 55%;
-webkit-transform: rotate(-3deg);
-moz-transform: rotate(-3deg);
-ms-transform: rotate(-3deg);
-o-transform: rotate(-3deg);
transform: rotate(-3deg);
}
.blog-img::after {
left: auto;
right: -4%;
-webkit-transform: rotate(3deg);
-moz-transform: rotate(3deg);
-ms-transform: rotate(3deg);
-o-transform: rotate(3deg);
transform: rotate(3deg);
}
.blog-img span {
float: left;
width: 100%;
overflow: hidden;
position: relative;
}
.blog-img span img {
width: 100%;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-ms-border-radius: 5px;
-o-border-radius: 5px;
border-radius: 5px;
}
.blog-img span:before, .blog-img span:after {
background: #fdfdfd none repeat scroll 0 0;
content: "";
height: 17px;
left: -4%;
z-index: 1;
position: absolute;
bottom: -10px;
width: 55%;
-webkit-transform: rotate(-3deg);
-moz-transform: rotate(-3deg);
-ms-transform: rotate(-3deg);
-o-transform: rotate(-3deg);
transform: rotate(-3deg);
}
.blog-img span:after {
left: auto;
right: -4%;
-webkit-transform: rotate(3deg);
-moz-transform: rotate(3deg);
-ms-transform: rotate(3deg);
-o-transform: rotate(3deg);
transform: rotate(3deg);
}
.blog-detail {
background: #fdfdfd none repeat scroll 0 0;
border-left: 1px solid #f2f2f2;
border-right: 1px solid #f2f2f2;
float: left;
padding: 30px 0 0;
text-align: center;
width: 100%;
}
.blog-detail > h3 {
color: #343434;
float: left;
font-size: 16px;
font-weight: 600;
line-height: 25px;
margin: 0 0 30px;
padding: 0 70px;
width: 100%;
}
.blog-detail .meta {
background: #f8f8f8 none repeat scroll 0 0;
padding: 20px;
-webkit-box-shadow: 0 1px 2px #dfdfdf;
-moz-box-shadow: 0 1px 2px #dfdfdf;
-ms-box-shadow: 0 1px 2px #dfdfdf;
-o-box-shadow: 0 1px 2px #dfdfdf;
box-shadow: 0 1px 2px #dfdfdf;
}
.blog-detail .meta li {
display: inline-block;
padding: 0 15px;
}
.blog-detail > h3 a {
color: inherit;
}
.meta li a {
padding: 0 1px;
}
.blog-detail-page {
float: left;
width: 100%;
}
.post-intro {
background: none repeat scroll 0 0 #ffffff;
float: left;
margin-bottom: 45px;
padding: 30px 30px 30px 0;
position: relative;
width: 100%;
}
.post-intro > img {
margin-bottom: 40px;
width: 100%;
}
.post-intro:before, .blog-detail-page blockquote:before, .comment:before {
background: none repeat scroll 0 0 #ffffff;
content: "";
height: 100%;
width: 1000%;
position: absolute;
left: -1000%;
top: 0;
}
.post-intro ul.meta li {
float: left;
margin-right: 40px;
}
.post-intro ul.meta li span[itemprop="name"] {
display: none;
}
.post-intro ul.meta {
margin-bottom: 20px;
}
.post-intro ul.meta li i {
font-size: 12px;
}
.blog-detail-page h1.post-title {
float: left;
font-size: 22px;
font-weight: 600;
margin: 0 0 20px;
text-transform: uppercase;
width: 100%;
}
.share-this {
float: left;
}
.share-this > span {
float: left;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 14px;
font-weight: 800;
margin-right: 20px;
text-transform: uppercase;
}
.share-this > a {
color: #888888;
float: left;
font-size: 12px;
line-height: 22px;
padding: 0 10px;
position: relative;
}
.share-this > a:before {
background: none repeat scroll 0 0 #888888;
content: "";
height: 10px;
margin-top: -5px;
width: 1px;
position: absolute;
right: 0;
top: 50%;
}
.share-this > a:last-child::before {
display: none;
}
.blog-detail-page > p {
font-size: 13px;
}
.page-gallery {
float: left;
margin: 50px 0;
width: 100%;
}
.page-gallery > div {
padding: 0;
}
.page-gallery > div img {
width: 100%;
}
.page-gallery-img {
float: left;
position: relative;
width: 100%;
}
.page-gallery-img:before, .page-gallery-img:after {
background: none repeat scroll 0 0 #000000;
content: "";
height: 100%;
left: 0;
opacity: 0.8;
position: absolute;
top: 0;
width: 0;
z-index: 1;
}
.page-gallery-img:hover:before, .page-gallery-img:hover:after {
width: 50px;
}
.page-gallery-img:after {
left: auto;
right: 0;
}
.page-gallery-img a {
float: left;
position: relative;
width: 100%;
}
.page-gallery-img a:before {
background: none repeat scroll 0 0 #000000;
color: #ffffff;
content: "\f00e";
font-family: fontawesome;
font-size: 19px;
height: 40px;
line-height: 40px;
margin-left: -20px;
margin-top: -20px;
text-align: center;
width: 40px;
position: absolute;
left: 50%;
top: 50%;
-webkit-transform: scale(0);
-moz-transform: scale(0);
-ms-transform: scale(0);
-o-transform: scale(0);
transform: scale(0);
}
.page-gallery-img:hover a:before {
-webkit-transform: scale(1);
-moz-transform: scale(1);
-ms-transform: scale(1);
-o-transform: scale(1);
transform: scale(1);
}
.blog-detail-page blockquote {
background: none repeat scroll 0 0 #ffffff;
border: 0 none;
color: #666666;
float: left;
font-family: arimo, "Microsoft YaHei";
font-size: 16px;
font-style: italic;
font-weight: 700;
line-height: 30px;
margin: 30px 0;
padding: 40px 80px;
position: relative;
text-align: center;
width: 100%;
}
.tagclouds {
float: left;
margin: 15px 0;
width: 100%;
}
.heading {
color: #2a2929;
float: left;
font-size: 22px;
margin: 0 0 20px;
width: 100%;
}
.heading span {
font-weight: 700;
}
.heading h3 {
color: #2a2929;
float: left;
font-size: 22px;
margin: 0;
padding-bottom: 10px;
position: relative;
}
.heading h3:before {
background: none repeat scroll 0 0 #000000;
content: "";
height: 1px;
width: 70px;
position: absolute;
bottom: 0;
right: 0;
}
.tagclouds > a span {
background: none repeat scroll 0 0 #ffffff;
color: #666666;
float: left;
font-family: arimo, "Microsoft YaHei";
font-size: 11px;
padding: 10px 16px;
position: relative;
text-transform: uppercase;
}
.tagclouds > a {
float: left;
padding: 0 25px;
margin: 5px 0;
position: relative;
overflow: hidden;
}
.tagclouds > a:before, .tagclouds > a:after {
color: #ffffff;
content: "\f0da";
font-family: fontawesome;
font-size: 58px;
line-height: 36px;
position: absolute;
right: 5px;
top: 0;
}
.tagclouds > a:after {
content: "\f0d9";
left: 5px;
right: auto;
}
.tagclouds > a span:before {
background: none repeat scroll 0 0 #e6e6e6;
content: "";
height: 7px;
width: 7px;
margin-top: -3.5px;
z-index: 1;
position: absolute;
top: 50%;
left: 0;
}
.tagclouds > a span:after {
color: #f0f0f0;
content: "\f105";
font-family: fontawesome;
font-size: 78px;
line-height: 10px;
position: absolute;
right: -24px;
z-index: 0;
}
.comments-thread {
float: left;
margin-top: 40px;
width: 100%;
}
.comments-thread ul {
float: left;
list-style: outside none none;
margin: 0;
padding: 0;
width: 100%;
}
.comments-thread ul li {
float: left;
margin-bottom: 40px;
width: 100%;
position: relative;
}
.comment {
background: none repeat scroll 0 0 #ffffff;
float: left;
padding: 50px 50px 0 0;
width: 100%;
position: relative;
}
.comment > img {
background: none repeat scroll 0 0 #ffffff;
border: 1px dashed #d7d7d7;
float: left;
margin-bottom: -20px;
margin-right: 30px;
padding: 10px;
}
.comment h6 {
border-left: 3px solid #8f8f8f;
color: #343434;
display: table;
font-size: 12px;
font-weight: 600;
line-height: 13px;
margin: 0 0 12px;
padding-left: 10px;
position: relative;
text-transform: uppercase;
}
.comment h6 span {
color: #666666;
font-family: arimo, "Microsoft YaHei";
font-size: 13px;
font-weight: 200;
text-transform: capitalize;
}
.comment > i {
display: table;
font-size: 12px;
font-style: normal;
margin: 0 0 10px;
}
.comment > p {
font-size: 13px;
line-height: 30px;
}
.comment > a {
background: none repeat scroll 0 0 #f0f0f0;
font-family: arimo, roboto slab, "Microsoft YaHei";
font-size: 11px;
font-weight: 600;
padding: 6px 20px;
position: absolute;
right: 50px;
text-transform: uppercase;
top: 50px;
}
.comment > a:hover {
color: #FFF
}
.comments-thread ul li:last-child {
margin-bottom: 0;
}
.comments-thread ul ul {
margin-top: 50px;
}
.comments-thread ul ul {
padding-left: 85px;
}
.comments-thread ul ul li .comment:after {
background: url("http://www.b5.com/skin/images/reply-comment.png") repeat scroll 0 0 rgba(0, 0, 0, 0);
content: "";
height: 10px;
width: 51px;
z-index: 1;
margin-top: -5px;
position: absolute;
left: -70px;
top: 50%;
}
.comments {
float: left;
margin-top: 60px;
width: 100%;
}
.comments > p {
color: #888888;
float: left;
font-size: 12px;
line-height: 20px;
margin: 10px 0 30px;
width: 100%;
}
.comments > form {
float: left;
width: 100%;
}
.comments > form .row {
margin: 0 -5px;
}
.comments > form .row > div {
padding: 0 5px;
}
.comments > form .button {
margin-top: 20px;
}
.field {
border: 1px solid #d2d0d0;
float: left;
font-family: arimo, "Microsoft YaHei";
font-size: 11px;
height: 40px;
letter-spacing: 0.3px;
padding: 10px 20px;
width: 100%;
margin-bottom: 10px;
}
textarea.field {
min-height: 140px;
padding: 20px 30px;
}
.button {
background: #363636 none repeat scroll 0% 0%;
color: #FFF;
float: left;
font-family: arimo, "Microsoft YaHei";
font-size: 11px;
letter-spacing: 0.6px;
line-height: 16px;
padding: 12px 25px;
position: relative;
z-index: 1;
}
.button:hover {
color: #FFF;
}
.cause-detail {
background: none repeat scroll 0 0 #343434;
color: #ffffff;
float: left;
margin: -40px 0 -30px;
padding: 40px 0;
text-align: center;
width: 100%;
}
.cause-detail > span {
float: left;
font-family: archivo narrow, "Microsoft YaHei";
font-size: 35px;
font-weight: 600;
line-height: 29px;
margin-bottom: 20px;
margin-top: 10px;
text-align: center;
width: 100%;
}
.cause-detail > span i {
color: #FFF;
font-style: normal;
}
.cause-detail > strong {
background: none repeat scroll 0 0 #ffffff;
color: #000000;
float: left;
font-family: arimo, roboto slab, "Microsoft YaHei";
font-size: 12px;
line-height: 20px;
padding: 12px 0;
width: 100%;
position: relative;
}
.cause-detail > strong a {
color: #fff;
height: 100%;
left: 0;
line-height: 43px;
position: absolute;
text-transform: uppercase;
top: 0;
width: 100%;
-webkit-transform: rotateX(90deg);
-moz-transform: rotateX(90deg);
-ms-transform: rotateX(90deg);
-o-transform: rotateX(90deg);
transform: rotateX(90deg);
}
.post-intro:hover .cause-detail > strong a {
-webkit-transform: rotateX(0);
-moz-transform: rotateX(0);
-ms-transform: rotateX(0);
-o-transform: rotateX(0);
transform: rotateX(0);
}
.special-services {
float: left;
width: 100%;
}
.about-service {
display: inline-block;
background: #fcf7ee none repeat scroll 0 0;
margin-left: -5px;
position: relative;
padding: 50px 0;
vertical-align: middle;
width: 32.5%;
}
.about-service-inner {
left: 20%;
position: absolute;
top: 50%;
width: 60%;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
}
.about-service-inner > span {
color: #2d2d2d;
float: left;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 16px;
font-weight: 500;
line-height: 20px;
margin-bottom: 5px;
width: 100%;
}
.about-service-inner h2 {
float: left;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 60px;
font-weight: 700;
line-height: 55px;
margin: 0 0 20px;
width: 100%;
}
.about-service-inner > strong {
float: left;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 20px;
font-weight: 500;
margin-bottom: 20px;
width: 100%;
}
.about-service-inner > p {
color: #646464;
float: left;
font-size: 12px;
line-height: 26px;
margin: 0;
width: 100%;
}
.services-list {
display: inline-block;
width: 67.5%;
vertical-align: middle;
}
.services-list > ul {
list-style: outside none none;
margin: 0;
padding: 0;
}
.services-list > ul li {
float: left;
width: 25%;
}
.services-list > ul li:first-child:nth-last-child(1), .services-list > ul li:first-child:nth-last-child(1) ~ li {
width: 100%;
}
.services-list > ul li:first-child:nth-last-child(2), .services-list > ul li:first-child:nth-last-child(2) ~ li {
width: 50%;
}
.services-list > ul li:first-child:nth-last-child(3), .services-list > ul li:first-child:nth-last-child(3) ~ li {
width: 33.334%;
}
.services-list > ul li:first-child:nth-last-child(4), .services-list > ul li:first-child:nth-last-child(4) ~ li {
width: 25%;
}
.service-block {
float: left;
width: 100%;
padding: 20px;
text-align: center;
}
.service-block-inner h3 {
float: left;
margin: 20px 0;
width: 100%;
}
.service-block-inner h3 a {
color: #2d2d2d;
float: left;
font-family: "Roboto Slab";
font-size: 16px;
font-weight: 600;
width: 100%;
}
.service-block-inner > p {
float: left;
font-size: 12px;
letter-spacing: 0.4px;
line-height: 23px;
margin: 0;
width: 100%;
}
.service-carousel {
float: left;
padding: 0 60px;
width: 100%;
}
.service-ways {
float: left;
width: 100%;
margin-bottom: -30px;
}
.service-box {
background: #FFF none repeat scroll 0px 0px;
float: left;
padding: 65px 30px;
text-align: center;
width: 100%;
margin-bottom: 2px;
-webkit-box-shadow: 0px 1px 2px #DFDFDF;
-moz-box-shadow: 0px 1px 2px #DFDFDF;
-ms-box-shadow: 0px 1px 2px #DFDFDF;
-o-box-shadow: 0px 1px 2px #DFDFDF;
box-shadow: 0px 1px 2px #DFDFDF;
}
.gray .service-ways .service-box {
background: #FFF;
}
.service-ways .service-box {
background: #f9f9f9 none repeat scroll 0 0;
margin-bottom: 30px;
}
.service-box:hover {
background: #fbfbfb;
}
.service-carousel .owl-item {
padding: 0 2px;
}
.service-box > h3 {
color: #2d2d2d;
float: left;
font-size: 15px;
font-weight: 600;
margin: 20px 0 10px;
width: 100%;
}
.service-box > h3 a {
color: inherit;
}
.service-box > p {
color: #646464;
float: left;
font-size: 12px;
letter-spacing: 0.3px;
margin: 0;
width: 100%;
}
.service-carousel .owl-nav {
height: 0;
left: 0;
padding: 0 20px;
position: absolute;
top: 50%;
width: 100%;
}
.service-carousel .owl-nav > div {
border: 1px solid #454545;
color: rgba(0, 0, 0, 0);
float: left;
height: 32px;
margin-top: -16px;
margin-left: -10px;
position: relative;
width: 32px;
}
.service-carousel .owl-nav > div::before {
color: #5c5c5c;
content: "\f104";
font-family: fontawesome;
font-size: 18px;
height: 100%;
left: 0;
line-height: 28px;
position: absolute;
text-align: center;
top: 0;
width: 100%;
}
.service-carousel .owl-nav > div.owl-next {
float: right;
margin-left: 0;
margin-right: -10px;
}
.service-carousel .owl-nav > div.owl-next:before {
content: "\f105";
}
.who-we-are {
float: left;
width: 100%;
}
.who-we-text {
float: left;
width: 100%;
}
.title.style3 {
margin-bottom: 30px;
padding-bottom: 10px;
text-align: left;
}
.title.style3 > span {
font-size: 13px;
margin-bottom: 5px;
}
.title.style3 > h2 {
font-size: 28px;
font-weight: 800;
}
.title.style3 > h2 span:before {
background: #000000 none repeat scroll 0 0;
bottom: -8px;
content: "";
height: 1px;
position: absolute;
right: 0;
width: 100%;
}
.title.style3 > h2 span {
position: relative;
}
.title.style3 h2 span {
font-weight: 600;
}
.who-we-detail {
float: left;
width: 100%;
margin-top: 25px;
}
.collected-donation {
background: #FFF;
float: left;
width: 100%;
padding: 25px;
text-align: center;
-webkit-box-shadow: 1px 1px 3px #f1f1f1;
-moz-box-shadow: 1px 1px 3px #f1f1f1;
-ms-box-shadow: 1px 1px 3px #f1f1f1;
-o-box-shadow: 1px 1px 3px #f1f1f1;
box-shadow: 1px 1px 3px #f1f1f1;
}
.collected-donation > strong {
display: table;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 40px;
color: #343434;
letter-spacing: 1px;
line-height: 40px;
margin-bottom: 10px;
width: 100%;
}
.collected-donation > span {
float: left;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 12px;
font-weight: 300;
line-height: 20px;
width: 100%;
}
.collected-donation > strong i {
font-style: normal;
}
.blackish .who-we-text > p {
color: #cccccc;
font-size: 13px;
}
.blackish .who-we-text {
background-image: none;
}
.blackish .collected-donation {
background: #292929;
box-shadow: none;
}
.blackish .collected-donation > strong {
color: #ffffff;
}
.help-needed {
float: left;
margin-bottom: -30px;
width: 100%;
}
.help {
float: left;
margin-bottom: 30px;
width: 100%;
}
.help-img {
float: left;
width: 100%;
}
.help-img > img {
width: 100%;
}
.help-detail {
background: #fdfdfd;
float: left;
padding: 45px 85px 45px 55px;
position: relative;
width: 100%;
width: calc(100% - 27px);
-webkit-border-radius: 0 0 3px 3px;
-moz-border-radius: 0 0 3px 3px;
-ms-border-radius: 0 0 3px 3px;
-o-border-radius: 0 0 3px 3px;
border-radius: 0 0 3px 3px;
-webkit-box-shadow: 0 0 3px #DFDFDF;
-moz-box-shadow: 0 0 3px #DFDFDF;
-ms-box-shadow: 0 0 3px #DFDFDF;
-o-box-shadow: 0 0 3px #DFDFDF;
box-shadow: 0 0 3px #DFDFDF;
}
.cats {
float: left;
margin-bottom: 10px;
width: 100%;
}
.cats > a {
color: #878787;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 12px;
font-weight: 300;
}
.help-detail > h3 {
float: left;
font-size: 16px;
line-height: 25px;
margin: 0;
width: 100%;
}
.help-detail > h3 a {
color: #343434;
-webkit-transition: all 0.3s linear;
-moz-transition: all 0.3s linear;
-ms-transition: all 0.3s linear;
-o-transition: all 0.3s linear;
transition: all 0.3s linear;
}
.donate-btn {
background: #f8f8f8 none repeat scroll 0 0;
cursor: pointer;
height: 210px;
position: absolute;
right: -27px;
top: 0;
width: 57px;
z-index: 1;
-webkit-transform: translateY(-58px);
-moz-transform: translateY(-58px);
-ms-transform: translateY(-58px);
-o-transform: translateY(-58px);
transform: translateY(-58px);
}
.donate-btn::before {
border-right: 20px solid rgba(0, 0, 0, 0.2);
border-top: 20px solid rgba(0, 0, 0, 0);
bottom: 5px;
content: "";
height: 0;
position: absolute;
right: 5px;
width: 0;
}
.donate-btn:after {
content: "";
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 0;
background: white;
z-index: -1;
}
.donate-btn:hover:after {
height: 100%;
}
.donate-btn > span {
background: #000000 none repeat scroll 0 0;
float: left;
height: 58px;
line-height: 58px;
text-align: center;
width: 57px;
z-index: 1;
}
.donate-btn > i {
color: #616161;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 12px;
font-style: normal;
font-weight: 600;
left: -52%;
min-width: 120px;
position: absolute;
text-align: center;
text-transform: uppercase;
top: 58%;
width: auto;
-webkit-transform: rotate(-90deg);
-moz-transform: rotate(-90deg);
-ms-transform: rotate(-90deg);
-o-transform: rotate(-90deg);
transform: rotate(-90deg);
}
.donate-btn:hover > i {
color: #ffffff;
}
.products-list {
float: left;
width: 100%;
margin-bottom: -30px;
}
.product {
background: none repeat scroll 0 0 #ffffff;
float: left;
width: 100%;
overflow: hidden;
margin-bottom: 30px;
-webkit-box-shadow: 0 0 3px #dfdfdf;
-moz-box-shadow: 0 0 3px #dfdfdf;
-ms-box-shadow: 0 0 3px #dfdfdf;
-o-box-shadow: 0 0 3px #dfdfdf;
box-shadow: 0 0 3px #dfdfdf;
}
.product-img {
float: left;
width: 100%;
position: relative;
}
.product-img:before {
background: none repeat scroll 0 0 #ffffff;
content: "";
opacity: 0;
height: 100%;
width: 100%;
position: absolute;
left: 0;
top: -50%;
}
.product:hover .product-img:before {
top: 0;
opacity: 0.8;
}
.product-img > img {
width: 100%;
}
.product-img > a {
background: none repeat scroll 0 0 rgba(50, 50, 50, 0.9);
color: #ffffff;
font-size: 20px;
height: 52px;
width: 52px;
line-height: 52px;
margin-left: -26px;
margin-top: -26px;
text-align: center;
opacity: 0;
position: absolute;
left: 50%;
top: 50%;
-webkit-transform: perspective(100px) rotateY(30deg);
-moz-transform: perspective(100px) rotateY(30deg);
-ms-transform: perspective(100px) rotateY(30deg);
-o-transform: perspective(100px) rotateY(30deg);
transform: perspective(100px) rotateY(30deg);
-webkit-transition: all 0.3s ease 0.2s;
-moz-transition: all 0.3s ease 0.2s;
-ms-transition: all 0.3s ease 0.2s;
-o-transition: all 0.3s ease 0.2s;
transition: all 0.3s ease 0.2s;
}
.product:hover .product-img > a {
opacity: 1;
-webkit-transform: rotateY(0);
-moz-transform: rotateY(0);
-ms-transform: rotateY(0);
-o-transform: rotateY(0);
transform: rotateY(0);
}
.product > h4 {
color: #3f3f3f;
float: left;
font-family: arimo, roboto slab, "Microsoft YaHei";
font-size: 13px;
font-weight: 800;
margin: 25px 0 15px;
padding: 0 20px;
text-align: center;
text-transform: uppercase;
width: 100%;
}
.product > h4 a {
color: inherit;
}
.product > span {
float: left;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 17px;
font-weight: 600;
line-height: 20px;
margin-bottom: 30px;
padding: 0 20px;
text-align: center;
width: 100%;
}
.product > span ins {
text-decoration: none;
margin-right: 5px;
}
.product > span del {
color: #9f9f9f;
font-size: 14px;
font-weight: 300;
}
.fancy-projects {
float: left;
margin-bottom: -30px;
width: 100%;
}
.urgent {
float: left;
width: 100%;
position: relative;
overflow: hidden;
margin-bottom: 30px;
z-index: 1;
}
.urgent > img {
width: 100%;
z-index: -1;
-webkit-transform: scale(1.07);
-moz-transform: scale(1.07);
-ms-transform: scale(1.07);
-o-transform: scale(1.07);
transform: scale(1.07);
-webkit-transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-ms-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
.urgent:hover > img {
-webkit-transform: translateX(20px) scale(1.07);
-moz-transform: translateX(20px) scale(1.07);
-ms-transform: translateX(20px) scale(1.07);
-o-transform: translateX(20px) scale(1.07);
transform: translateX(20px) scale(1.07);
}
.urgent-detail {
height: 100%;
width: 100%;
padding: 40px 30px;
z-index: 1;
position: absolute;
left: 0;
top: 0;
}
.urgent:before {
background: none repeat scroll 0 0 #000000;
content: "";
height: 100%;
left: 0;
opacity: 0.5;
position: absolute;
top: 0;
width: 100%;
z-index: 1;
}
.cause-title {
padding: 40px 50px 0;
width: 100%;
position: absolute;
left: 0;
top: 0;
}
.cause-donation {
bottom: 0;
left: 0;
padding: 0 0 40px 50px;
position: absolute;
text-align: center;
}
.cause-title span {
color: #ffffff;
float: left;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 13px;
font-weight: 300;
text-transform: uppercase;
width: 100%;
}
.cause-title h5 {
color: #ffffff;
float: left;
font-size: 26px;
font-weight: 600;
letter-spacing: 1px;
margin: 10px 0 0;
width: 100%;
}
.collected-amount {
color: #ffffff;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 40px;
font-weight: 500;
line-height: 45px;
}
.collected-amount i {
font-style: normal;
margin-right: 5px;
}
.cause-donation > i {
color: #ffffff;
display: block;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 13px;
font-style: normal;
font-weight: 300;
text-align: center;
}
.urgent-detail > a {
bottom: 40px;
position: absolute;
right: 50px;
}
.clients-testimonials {
background: #fdfdfd none repeat scroll 0 0;
float: left;
padding: 45px 40px;
text-align: center;
width: 100%;
-webkit-box-shadow: 0 1px 2px #dfdfdf;
-moz-box-shadow: 0 1px 2px #dfdfdf;
-ms-box-shadow: 0 1px 2px #dfdfdf;
-o-box-shadow: 0 1px 2px #dfdfdf;
box-shadow: 0 1px 2px #dfdfdf;
}
.review {
float: left;
width: 100%;
background: #fdfdfd none repeat scroll 0 0;
}
.review blockquote {
background: rgba(0, 0, 0, 0) url("http://www.b5.com/skin/images/testimonial.png") no-repeat scroll center 0 / auto 100%;
border: 0 none;
color: #646464;
font-size: 12px;
letter-spacing: 0.3px;
line-height: 24px;
margin-bottom: 25px;
padding: 0;
position: relative;
}
.review > span {
float: left;
font-family: arimo, roboto slab, "Microsoft YaHei";
font-size: 11px;
margin-top: 20px;
width: 100%;
text-transform: uppercase;
}
.urgent-parallax {
float: left;
text-align: center;
width: 100%;
}
.urgent-parallax > h2 {
color: #ffffff;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 50px;
margin: 0 0 20px;
}
.urgent-parallax > strong {
float: left;
font-family: arimo, "Roboto Slab", "Microsoft YaHei";
font-size: 20px;
font-weight: 400;
line-height: 33px;
width: 100%;
}
.urgent-parallax > p {
color: #ebebeb;
float: left;
font-size: 15px;
line-height: 40px;
margin: 25px 25% 0;
width: 50%;
}
.urgent-parallax > p strong {
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 26px;
font-weight: 700;
}
.urgent-progress .progress {
float: left;
width: 100%;
}
.urgent-progress .goal {
color: #d8d8d8;
text-align: right;
width: 33.334%;
padding: 0 20px;
}
.urgent-progress .goal span {
color: #ffffff;
}
.urgent-progress .goal.raised {
text-align: left;
}
.urgent-progress .goal.raised span {
float: none;
}
.urgent-progress .goal span {
color: #ffffff;
margin-left: 10px;
}
.percent {
color: #ffffff;
float: left;
font-family: arimo, roboto, "Microsoft YaHei";
line-height: 33px;
font-size: 26px;
font-weight: 200;
width: 33.334%;
position: relative;
}
.percent::before {
bottom: -13px;
color: #ffffff;
content: "\f103";
font-family: fontawesome;
font-size: 15px;
height: 20px;
left: 50%;
line-height: 24px;
margin-left: -10px;
position: absolute;
text-align: center;
width: 20px;
}
.percent > i {
color: #9fca45;
font-style: normal;
margin-left: 5px;
}
.progress-border {
border: 1px solid #757575;
float: left;
padding: 5px;
width: 100%;
margin-top: 20px;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
-ms-border-radius: 20px;
-o-border-radius: 20px;
border-radius: 20px;
}
.progress-border .progress {
background: none;
margin: 0;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
-ms-border-radius: 20px;
-o-border-radius: 20px;
border-radius: 20px;
}
.progress-border .progress .progress-bar {
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
-ms-border-radius: 20px;
-o-border-radius: 20px;
border-radius: 20px;
}
.urgent-parallax .theme-btn {
margin-top: 30px;
}
.goal {
color: #d8d8d8;
float: left;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 13px;
font-weight: 300;
letter-spacing: 1px;
text-transform: uppercase;
}
.goal span {
font-size: 20px;
font-weight: 500;
}
.goal span i {
font-style: normal;
}
.causes-carousel {
float: left;
width: 100%;
padding: 10px 5px;
}
.fancy-cause {
float: left;
padding: 0 5px;
width: 100%;
}
.fancy-cause > img {
width: 100%;
}
.fancy-overlay {
background: rgba(255, 255, 255, 0.9) none repeat scroll 0 0;
height: 100%;
padding: 40px;
width: 50%;
text-align: center;
position: absolute;
right: 5px;
top: 0;
}
.fancy-overlay:before {
content: "";
display: inline-block;
height: 100%;
vertical-align: middle;
}
.fancy-cause-detail {
display: inline-block;
text-align: left;
vertical-align: middle;
width: 97%;
}
.fancy-cause-detail > span {
float: left;
font-family: arimo, "Microsoft YaHei";
font-size: 12px;
font-weight: 600;
margin-bottom: 15px;
width: 100%;
}
.fancy-cause-detail h4 {
float: left;
font-weight: 600;
margin: 0 0 20px;
text-transform: uppercase;
width: 100%;
}
.fancy-cause-detail h4 a {
color: inherit;
}
.fancy-cause-detail > p {
color: #646464;
float: left;
font-size: 13px;
line-height: 28px;
margin-bottom: 40px;
width: 100%;
}
.help-us {
color: #646464;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 12px;
width: 100%;
}
.help-us i {
font-size: 18px;
font-style: normal;
}
.help-us > strong {
color: #303030;
float: right;
font-size: 30px;
line-height: 30px;
}
.help-us > strong i {
font-size: inherit;
}
.parallax-banner {
display: table;
padding: 60px 0;
width: 100%;
}
.banner-text {
display: table-cell;
width: 35%;
vertical-align: middle;
}
.banner-info {
display: table-cell;
text-align: center;
width: 35%;
vertical-align: middle;
}
.banner-button {
display: table-cell;
width: 30%;
text-align: right;
vertical-align: middle;
}
.banner-text > strong {
color: #ffffff;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 18px;
font-weight: 500;
line-height: 30px;
width: 100%;
}
.banner-text > strong i {
font-style: normal;
}
.banner-button .big-btn {
margin: 0;
}
.counting {
color: #ffffff;
display: table-cell;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 26px;
font-weight: 500;
position: relative;
text-align: center;
vertical-align: middle;
}
.counting > span {
font-size: 40px;
}
.banner-info > span {
color: #ffffff;
display: table-cell;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 30px;
font-weight: 700;
text-align: center;
line-height: 80px;
text-transform: uppercase;
}
.counting > i {
float: left;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 16px;
font-style: normal;
font-weight: 200;
text-transform: uppercase;
width: 100%;
}
.successful-stories {
float: left;
margin-bottom: -30px;
width: 100%;
}
.story {
float: left;
margin-bottom: 30px;
width: 100%;
}
.story-img {
float: left;
overflow: hidden;
width: 100%;
position: relative;
-webkit-border-radius: 3px 3px 0 0;
-moz-border-radius: 3px 3px 0 0;
-ms-border-radius: 3px 3px 0 0;
-o-border-radius: 3px 3px 0 0;
border-radius: 3px 3px 0 0;
}
.story-img > img {
width: 100%;
min-height: 202px;
object-fit: cover;
}
.story-detail {
background: #fdfdfd none repeat scroll 0 0;
border: 1px solid #F7F7F7;
float: left;
padding: 30px 45px;
width: 100%;
}
.story-detail > span {
float: left;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 12px;
font-weight: 300;
margin-bottom: 10px;
width: 100%;
}
.story-detail h3 {
color: #454545;
float: left;
font-size: 15px;
font-weight: 600;
line-height: 24px;
margin: 0;
width: 100%;
}
.story-detail h3 a {
color: inherit;
}
.spent-bar {
background: #f8f8f8 none repeat scroll 0 0;
border-bottom: 1px solid #f7f7f7;
border-left: 1px solid #f7f7f7;
border-right: 1px solid #f7f7f7;
float: left;
padding: 0 40px;
width: 100%;
-webkit-border-radius: 0 0 3px 3px;
-moz-border-radius: 0 0 3px 3px;
-ms-border-radius: 0 0 3px 3px;
-o-border-radius: 0 0 3px 3px;
border-radius: 0 0 3px 3px;
}
.spent-bar > span {
color: #777777;
font-family: arimo, "Microsoft YaHei";
font-size: 13px;
line-height: 54px;
}
.spent-bar > span.price {
border-left: 1px solid #e9e9e9;
color: #222222;
float: right;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 20px;
font-weight: 600;
line-height: 24px;
padding-bottom: 15px;
padding-left: 20px;
padding-top: 15px;
}
.spent-bar > span.price i {
font-style: normal;
margin-right: 5px;
}
.story-img:before {
background: #000000 none repeat scroll 0 0;
content: "";
height: 100%;
width: 100%;
opacity: 0;
position: absolute;
left: 0;
top: 0;
}
.story-img:hover:before {
opacity: 0.5;
}
.story-img > a, .blog-img a {
color: #dad9d9;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 100px;
font-weight: 200;
position: absolute;
left: 50%;
top: 50%;
-webkit-transform: translateX(-50%) translateY(-50%) scale(0);
-moz-transform: translateX(-50%) translateY(-50%) scale(0);
-ms-transform: translateX(-50%) translateY(-50%) scale(0);
-o-transform: translateX(-50%) translateY(-50%) scale(0);
transform: translateX(-50%) translateY(-50%) scale(0);
}
.story-img:hover > a, .blog-img:hover a {
-webkit-transform: translateX(-50%) translateY(-50%) scale(1);
-moz-transform: translateX(-50%) translateY(-50%) scale(1);
-ms-transform: translateX(-50%) translateY(-50%) scale(1);
-o-transform: translateX(-50%) translateY(-50%) scale(1);
transform: translateX(-50%) translateY(-50%) scale(1);
}
.welfare-projects-carousel {
float: left;
width: 100%;
}
.welfare-project {
float: left;
width: 100%;
position: relative;
z-index: 1;
}
.welfare-project:before, .welfare-project:after {
background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.77) 77%, rgba(0,0,0,0.77) 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0,0,0,0)), color-stop(77%, rgba(0,0,0,0.77)), color-stop(100%, rgba(0,0,0,0.77)));
background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.77) 77%, rgba(0,0,0,0.77) 100%);
background: -o-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.77) 77%, rgba(0,0,0,0.77) 100%);
background: -ms-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.77) 77%, rgba(0,0,0,0.77) 100%);
background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,0.77) 77%, rgba(0,0,0,0.77) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#c4000000', GradientType=0 );
content: "";
z-index: 1;
position: absolute;
left: 0;
bottom: 0;
width: 100%;
height: 40%;
}
.welfare-project:hover:before {
height: 0;
}
.welfare-project::after {
background: #000000 none repeat scroll 0 0;
bottom: auto;
height: 0;
opacity: 0.75;
top: 0;
z-index: 0;
}
.welfare-project:hover:after {
height: 100%;
}
.welfare-project > img {
width: 100%;
}
.project-info {
padding: 0 30px 30px;
width: 100%;
z-index: 1;
position: absolute;
bottom: 0;
left: 0;
}
.welfare-project:hover .project-info {
opacity: 0;
}
.project-info > h3 {
color: #ffffff;
float: left;
font-size: 20px;
font-weight: 600;
margin: 0 0 20px;
width: 100%;
}
.project-info > h3 a {
color: inherit;
}
.project-info .progress-border {
border: 1px solid #bcbcbc;
margin-top: 0;
padding: 2px;
-webkit-border-radius: 0;
-moz-border-radius: 0;
-ms-border-radius: 0;
-o-border-radius: 0;
border-radius: 0;
}
.project-info .progress-border .progress {
background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
height: 7px;
-webkit-border-radius: 0;
-moz-border-radius: 0;
-ms-border-radius: 0;
-o-border-radius: 0;
border-radius: 0;
}
.project-info .progress-border .progress .progress-bar {
-webkit-border-radius: 0;
-moz-border-radius: 0;
-ms-border-radius: 0;
-o-border-radius: 0;
border-radius: 0;
}
.project-info .urgent-progress {
margin: 0;
}
.project-info .urgent-progress .goal.raised {
line-height: 17px;
margin-top: 15px;
padding: 0;
width: 100%;
}
.project-info .goal > i {
float: right;
font-size: 16px;
font-family: arimo, roboto, "Microsoft YaHei";
font-style: normal;
font-weight: 300;
}
.project-hover {
text-align: center;
width: 100%;
z-index: 1;
padding: 0 20px;
opacity: 0;
position: absolute;
top: 50%;
left: 0;
}
.welfare-project:hover .project-hover {
opacity: 1;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
}
.project-hover > h3 {
float: left;
font-size: 20px;
margin: 0 0 10px;
width: 100%;
}
.project-hover > h3 a {
color: #ffffff;
}
.project-hover .goal {
color: #ffffff;
float: left;
width: 100%;
margin-bottom: 40px;
}
.special-deals {
float: left;
position: relative;
width: 100%;
}
.deal-selector {
float: left;
width: 100%;
}
.deal {
border: 0 none !important;
float: left;
padding-bottom: 30px;
position: relative;
width: 100% !important;
cursor: pointer;
}
.deal > img {
width: 100%;
-webkit-border-radius: 3px 3px 0 0;
-moz-border-radius: 3px 3px 0 0;
-ms-border-radius: 3px 3px 0 0;
-o-border-radius: 3px 3px 0 0;
border-radius: 3px 3px 0 0;
}
.deal h5 {
background: #ffffff none repeat scroll 0 0;
bottom: 30px;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 13px;
font-weight: 300;
left: 0;
margin: 0;
padding: 13px 10px;
position: absolute;
text-align: center;
width: 100%;
-webkit-border-radius: 0 0 3px 3px;
-moz-border-radius: 0 0 3px 3px;
-ms-border-radius: 0 0 3px 3px;
-o-border-radius: 0 0 3px 3px;
border-radius: 0 0 3px 3px;
}
.deal h5 a {
color: #545454;
}
.deal-desc > ul, .project-progress ul {
float: left;
list-style: outside none none;
margin: 0 0 10px;
padding: 0;
width: 100%;
}
.deal-desc > ul li, .project-progress ul li {
float: left;
font-size: 11px;
line-height: 15px;
margin-right: 6px;
padding-right: 6px;
position: relative;
}
.deal-desc > ul li:before, .project-progress ul li:before {
content: "/";
position: absolute;
right: -2px;
top: 0;
}
.deal-desc > ul li a, .project-progress ul li a {
float: left;
font-size: 11px;
line-height: inherit;
}
.deal-desc > ul li:last-child, .project-progress ul li:last-child {
margin: 0;
padding: 0;
}
.deal-desc > ul li:last-child::before, .project-progress ul li:last-child:before {
display: none;
}
.deal-desc > h4 {
float: left;
font-size: 26px;
font-weight: 600;
margin: 0 0 20px;
width: 100%;
}
.deal-desc > h4 a {
color: #FFF;
}
.deal-desc > span {
color: #ffffff;
float: left;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 22px;
line-height: 20px;
font-weight: 500;
margin-bottom: 20px;
width: 100%;
}
.deal-desc > span i {
font-style: normal;
}
.deal-desc > span del {
color: #9a9a9a;
font-family: arimo, "Microsoft YaHei";
font-size: 13px;
margin-left: 10px;
}
.deal-detail img {
width: 100%;
}
.deal-detail .row > div {
float: none;
display: inline-block;
vertical-align: middle;
margin-left: -4px;
padding-left: 19px;
}
.deal-desc > p {
color: #cacaca;
float: left;
font-size: 13px;
margin-bottom: 60px;
width: 100%;
}
.deal-detail-carousel {
cursor: move;
float: left;
position: relative;
width: 100%;
z-index: 1000;
}
.deal-detail-carousel:before {
background: url("http://www.b5.com/skin/images/deal-detail-bg.jpg") no-repeat scroll 520px 0 rgba(0, 0, 0, 0);
content: "";
opacity: 0.1;
height: 100%;
width: 100%;
position: absolute;
right: 0;
top: 0;
z-index: -1;
}
.project-progress h4 {
float: left;
font-size: 20px;
margin: 0;
width: 100%;
}
.project-progress h4 a {
color: inherit;
}
.deal-desc > span ins {
text-decoration: none;
}
.choose-us {
float: left;
width: 100%;
}
.choose-us > p {
float: left;
margin-bottom: 30px;
width: 100%;
}
.toggle {
float: left;
width: 100%;
}
.toggle-item {
background: #fdfdfd none repeat scroll 0 0;
float: left;
width: 100%;
margin-bottom: 5px;
padding: 24px 30px;
-webkit-box-shadow: 0px 1px 2px #DFDFDF;
-moz-box-shadow: 0px 1px 2px #DFDFDF;
-ms-box-shadow: 0px 1px 2px #DFDFDF;
-o-box-shadow: 0px 1px 2px #DFDFDF;
box-shadow: 0px 1px 2px #DFDFDF;
}
.toggle-item.activate {
background: #f8f8f8;
}
.toggle-item h2 {
color: #505050;
cursor: pointer;
float: left;
font-size: 13px;
font-weight: 500;
margin: 0;
position: relative;
text-transform: capitalize;
padding-left: 25px;
width: 100%;
}
.toggle-item h2:before, .toggle-item h2:after {
border: 1px solid #b7b7b7;
content: "";
height: 8px;
width: 8px;
margin-top: -4px;
position: absolute;
top: 50%;
left: 0;
}
.toggle-item h2:after {
-webkit-transform: scale(0);
-moz-transform: scale(0);
-ms-transform: scale(0);
-o-transform: scale(0);
transform: scale(0);
}
.toggle-item h2.active:after {
-webkit-transform: scale(1);
-moz-transform: scale(1);
-ms-transform: scale(1);
-o-transform: scale(1);
transform: scale(1);
}
.content {
float: left;
width: 100%;
}
.toggle-item h2.active {
margin: 0 0 15px;
}
.content p {
float: left;
font-size: 13px;
letter-spacing: 0.3px;
line-height: 26px;
width: 100%;
margin: 0;
}
.upcoming-event {
float: left;
overflow: hidden;
width: 100%;
-webkit-box-shadow: 0px 1px 2px #DFDFDF;
-moz-box-shadow: 0px 1px 2px #DFDFDF;
-ms-box-shadow: 0px 1px 2px #DFDFDF;
-o-box-shadow: 0px 1px 2px #DFDFDF;
box-shadow: 0px 1px 2px #DFDFDF;
}
.upcoming-img {
float: left;
position: relative;
width: 100%;
}
.upcoming-img > img {
width: 100%;
}
.overlay-countdown {
background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.78) 99%, rgba(0,0,0,0.79) 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0,0,0,0)), color-stop(99%, rgba(0,0,0,0.78)), color-stop(100%, rgba(0,0,0,0.79)));
background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.78) 99%, rgba(0,0,0,0.79) 100%);
background: -o-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.78) 99%, rgba(0,0,0,0.79) 100%);
background: -ms-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.78) 99%, rgba(0,0,0,0.79) 100%);
background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,0.78) 99%, rgba(0,0,0,0.79) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#c9000000', GradientType=0 );
padding: 20px 40px;
position: absolute;
bottom: 0;
left: 0;
width: 100%;
}
.overlay-countdown .countdown-period {
color: #ccc;
}
.countdown-section:before {
border-color: #e1e1e1;
}
.upcoming-detail {
float: left;
padding: 30px 50px;
width: 100%;
background: #FDFDFD none repeat scroll 0% 0%;
}
.upcoming-detail > h4 {
float: left;
font-size: 15px;
margin: 0;
width: 100%;
line-height: 30px;
font-weight: 800;
}
.upcoming-detail > h4 a {
color: inherit;
}
.about-img {
padding-left: 15px;
padding-right: 0;
position: absolute;
right: 0;
top: 0;
}
.about-img img {
width: 100%;
}
.static {
position: static;
}
.video.overlap {
margin: -90px 0;
border-radius: 0;
}
.urgent-cause-progress {
float: left;
position: relative;
width: 100%;
}
.urgent-cause-progress img {
width: 100%;
}
.urgent-cause-overlay {
height: 100%;
text-align: center;
width: 100%;
position: absolute;
left: 0;
top: 0;
}
.urgent-cause-overlay::before {
content: "";
display: inline-block;
height: 100%;
vertical-align: middle;
}
.urgent-cause-inner {
display: inline-block;
vertical-align: middle;
width: 90%;
}
.urgent-cause-inner > h3 {
color: #ffffff;
float: left;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 30px;
font-weight: 700;
margin: 0;
width: 100%;
}
.urgent-cause-inner > strong {
color: #ffffff;
float: left;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 20px;
font-weight: 500;
margin-top: 40px;
width: 100%;
}
.blank-space {
float: left;
height: 70px;
width: 100%;
}
.all-posts {
float: left;
width: 100%;
margin-bottom: -30px;
}
.list-style .post-listview > div {
display: inline-block;
float: none;
margin-left: -3px;
padding: 0;
vertical-align: middle;
}
.post-listview {
background: #fdfdfd none repeat scroll 0 0;
border-radius: 3px;
float: left;
margin-bottom: 30px;
overflow: hidden;
width: 100%;
-webkit-box-shadow: 0 1px 3px #dfdfdf;
-moz-box-shadow: 0 1px 3px #dfdfdf;
-ms-box-shadow: 0 1px 3px #dfdfdf;
-o-box-shadow: 0 1px 3px #dfdfdf;
box-shadow: 0 1px 3px #dfdfdf;
}
.post-img {
float: left;
width: 100%;
position: relative;
overflow: hidden;
}
.post-img > img {
width: 100%;
}
.post-img > span {
background: none repeat scroll 0 0 #585858;
color: #ffffff;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 11px;
padding: 13px 40px 13px 0;
text-transform: uppercase;
position: absolute;
bottom: 0;
right: -1px;
-webkit-border-radius: 3px 0 0;
-moz-border-radius: 3px 0 0;
-ms-border-radius: 3px 0 0;
-o-border-radius: 3px 0 0;
border-radius: 3px 0 0;
}
.post-listview:hover .post-img > span {
-webkit-transform: translateY(-43px);
-moz-transform: translateY(-43px);
-ms-transform: translateY(-43px);
-o-transform: translateY(-43px);
transform: translateY(-43px);
}
.post-img > span > i {
background: none repeat scroll 0 0 #ffffff;
color: #797979;
float: left;
height: 43px;
margin: -13px 30px -13px 0;
text-align: center;
width: 46px;
font-size: 16px;
line-height: 43px;
-webkit-border-radius: 3px 0 0;
-moz-border-radius: 3px 0 0;
-ms-border-radius: 3px 0 0;
-o-border-radius: 3px 0 0;
border-radius: 3px 0 0;
}
.post-detail {
background: none repeat scroll 0 0 #fdfdfd;
float: left;
padding: 20px 70px;
width: 100%;
text-align: center;
}
.post-detail > h3 {
color: #343434;
float: left;
font-family: arimo, roboto slab, "Microsoft YaHei";
font-size: 16px;
font-weight: 600;
margin: 0 0 15px;
text-transform: uppercase;
width: 100%;
}
.post-detail > h3 a {
color: inherit;
}
.post-detail > p {
float: left;
font-size: 13px;
margin-top: 15px;
width: 100%;
color: rgb(116, 116, 116);
margin-bottom: 0;
}
.post-detail .meta {
position: relative;
}
.list-style .post-detail ul.meta li {
display: inline;
float: none;
margin-right: 30px;
max-width: 50%;
}
.post-detail ul.meta li:last-child {
margin: 0;
}
.post-img > span a, .post-img > span strong {
background: #ffffff none repeat scroll 0 0;
color: #343434;
font-family: arimo, "Microsoft YaHei";
font-size: 11px;
height: 100%;
left: 0;
line-height: 27px;
padding: 10px 20px;
position: absolute;
text-align: center;
text-transform: uppercase;
top: 100%;
width: 100%;
}
.post-img > span strong {
font-family: archivo narrow, "Microsoft YaHei";
font-size: 22px;
font-weight: 200;
padding: 10px 5px;
}
.post-img > span strong i {
color: #6e6e6e;
font-size: 12px;
font-style: normal;
font-weight: 200;
margin-left: 5px;
}
.more {
float: left;
width: 100%;
}
.loadmore {
background: #fdfdfd none repeat scroll 0 0;
color: #797979;
float: left;
font-family: arimo, roboto slab, "Microsoft YaHei";
font-size: 13px;
font-weight: 800;
padding: 20px;
text-align: center;
width: 100%;
-webkit-box-shadow: 0 1px 3px #dfdfdf;
-moz-box-shadow: 0 1px 3px #dfdfdf;
-ms-box-shadow: 0 1px 3px #dfdfdf;
-o-box-shadow: 0 1px 3px #dfdfdf;
box-shadow: 0 1px 3px #dfdfdf;
}
.loadmore i {
display: inline-block;
margin-right: 10px;
-webkit-transition: all 1s ease 0s;
-moz-transition: all 1s ease 0s;
-ms-transition: all 1s ease 0s;
-o-transition: all 1s ease 0s;
transition: all 1s ease 0s;
}
.loadmore:hover i {
-webkit-transform: rotate(720deg);
-moz-transform: rotate(720deg);
-ms-transform: rotate(720deg);
-o-transform: rotate(720deg);
transform: rotate(720deg);
}
@-webkit-keyframes fadeInUp {
0% {
opacity: 0;
-webkit-transform: translateY(20px);
transform: translateY(20px);
}
100% {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
@keyframes fadeInUp {
0% {
opacity: 0;
-webkit-transform: translateY(20px);
-ms-transform: translateY(20px);
transform: translateY(20px);
}
100% {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
}
.fadeInUp {
-webkit-animation-name: fadeInUp;
animation-name: fadeInUp;
}
.post-listview.added {
-webkit-animation: 1s ease 0s normal none 1 running fadeInUp;
-moz-animation: 1s ease 0s normal none 1 running fadeInUp;
-ms-animation: 1s ease 0s normal none 1 running fadeInUp;
-o-animation: 1s ease 0s normal none 1 running fadeInUp;
animation: 1s ease 0s normal none 1 running fadeInUp;
}
.sidebar-life-life .widget {
margin-bottom: 60px;
}
.widget-life {
float: left;
width: 100%;
}
.widget-title {
float: left;
width: 100%;
margin-bottom: 30px;
}
.widget-title h4 {
float: left;
width: 100%;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 24px;
margin: 0px 0px 10px;
}
.widget-title h4 span {
font-weight: 300;
}
.widget-title > span {
float: left;
width: 100%;
font-family: arimo, roboto, "Microsoft YaHei";
font-weight: 300;
font-size: 12px;
color: #505050;
}
.sidebar-life .widget:last-child {
margin-bottom: 0;
}
.blog-widget {
float: left;
width: 100%;
}
.sidebar-life .widget p, .sidebar-life .widget li {
color: #888888;
}
.sidebar-life .welcome > p {
color: #fff;
}
.widget-post {
border-bottom: 1px solid #f4f4f4;
float: left;
margin-bottom: 25px;
padding-bottom: 15px;
width: 100%;
}
.widget-post:last-child {
margin: 0;
padding: 0;
border: 0;
}
.widget-post > a {
float: left;
margin-right: 15px;
overflow: hidden;
}
.widget-post h5 {
font-size: 13px;
line-height: 23px;
margin: 0 0 8px;
}
footer .widget-post h5 {
color: #FFF;
}
.widget-post h5 a {
color: inherit;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
white-space: normal;
}
.widget .widget-post ul, .sidebar-life .widget .widget-post ul {
float: none;
margin-top: 5px;
width: auto;
}
.widget .widget-post ul li {
background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
float: left;
line-height: 20px;
margin: 0;
padding: 0;
width: auto;
-webkit-box-shadow: none;
-moz-box-shadow: none;
-ms-box-shadow: none;
-o-box-shadow: none;
box-shadow: none;
}
.widget .widget-post ul li:hover {
background: none;
}
.widget .widget-post ul li a {
float: left;
font-size: 11px;
text-transform: uppercase;
background: transparent none repeat scroll 0% 0%;
box-shadow: none;
padding: 0px 6px;
}
.sidebar-life .widget .widget-post ul li a span {
float: none;
}
.widget .widget-post ul li i {
font-size: 13px;
}
.video-widget {
float: left;
width: 100%;
overflow: hidden;
position: relative;
}
.video-widget > img {
width: 100%;
}
.video-layer {
padding: 0 40px;
text-align: center;
width: 100%;
z-index: 1;
position: absolute;
left: 0;
top: 50%;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
}
.video-widget h6 {
color: #ffffff;
font-size: 15px;
font-weight: 600;
line-height: 25px;
margin: 20px 0 0;
}
.video-widget:before, .video-widget:after {
background: none repeat scroll 0 0 #000000;
content: "";
height: 100%;
width: 100%;
opacity: 0.6;
position: absolute;
left: 0;
top: 0;
}
.video-layer > a {
display: inline-block;
}
.sidebar-life .volunteer-inner > p {
color: #ffffff;
}
.sidebar-life .tweet blockquote {
color: #888;
}
.sidebar-life .widget form input {
background: none repeat scroll 0 0 #dfdfdf;
}
.sidebar-life .tagclouds {
margin: -5px 0 0;
}
.sidebar-life .widget ul {
float: none;
list-style: outside none none;
margin: 0;
padding: 0;
text-align: left;
width: auto;
}
.sidebar-life .widget ul ul {
padding-left: 20px;
}
.sidebar-life .widget li {
float: left;
font-family: arimo, "Microsoft YaHei";
font-size: 12px;
width: 100%;
}
.sidebar-life .widget li a {
background: #FDFDFD none repeat scroll 0px 0px;
padding: 15px 25px;
color: inherit;
float: left;
width: 100%;
font-family: inherit;
text-align: left;
line-height: 18px;
font-size: inherit;
margin-bottom: 3px;
-webkit-box-shadow: 0px 1px 1px #DFDFDF;
-moz-box-shadow: 0px 1px 1px #DFDFDF;
-ms-box-shadow: 0px 1px 1px #DFDFDF;
-o-box-shadow: 0px 1px 1px #DFDFDF;
box-shadow: 0px 1px 1px #DFDFDF;
}
.sidebar-life .widget li a:hover {
background: #f8f8f8;
}
.sidebar-life .widget li a span {
float: right;
}
.sidebar-life .widget li {
background: none repeat scroll 0 0 rgba(0, 0, 0, 0);
margin: 0;
padding: 0;
text-align: left;
line-height: 30px;
}
.sidebar-life .widget li i {
margin-right: 10px;
}
.event-widget {
float: left;
overflow: hidden;
position: relative;
min-height: 140px;
width: 100%;
margin-bottom: 1px;
}
.event-widget > img {
width: 100%;
}
.event-widget-overlay {
background: none repeat scroll 0 0 rgba(0, 0, 0, 0.7);
height: 100%;
width: 100%;
text-align: center;
position: absolute;
left: 0;
top: 0;
}
.event-widget-overlay:before {
content: "";
display: inline-block;
height: 100%;
vertical-align: middle;
}
.event-overlay-inner {
display: inline-block;
vertical-align: middle;
width: 90%;
}
.event-overlay-inner h5 {
float: left;
font-size: 13px;
margin: 0 0 10px;
text-transform: uppercase;
width: 100%;
}
.event-overlay-inner h5 a {
color: #ffffff;
}
.event-overlay-inner span {
color: #ffffff;
font-family: arimo, "Microsoft YaHei";
font-size: 11px;
letter-spacing: 0.4px;
text-transform: uppercase;
}
.event-overlay-inner span i {
margin-right: 5px;
}
.gallery-widget {
float: left;
width: 100%;
margin-bottom: -15px;
}
.gallery-widget .row {
margin: 0 -7.5px;
}
.gallery-widget .row > div {
margin-bottom: 15px;
padding: 0 7.5px;
}
.gallery-widget .row > div a {
float: left;
width: 100%;
position: relative;
overflow: hidden;
}
.gallery-widget .row > div a:before {
background: none repeat scroll 0 0 #000000;
content: "";
opacity: 0;
height: 80%;
width: 80%;
position: absolute;
left: 10%;
top: 10%;
-webkit-transition: all 0.2s ease 0.3s;
-moz-transition: all 0.2s ease 0.3s;
-ms-transition: all 0.2s ease 0.3s;
-o-transition: all 0.2s ease 0.3s;
transition: all 0.2s ease 0.3s;
}
.gallery-widget .row > div a:hover:before {
opacity: 0.8;
height: 100%;
width: 100%;
left: 0;
top: 0;
-webkit-transition: all 0.2s linear;
-moz-transition: all 0.2s linear;
-ms-transition: all 0.2s linear;
-o-transition: all 0.2s linear;
transition: all 0.2s linear;
}
.gallery-widget .row > div a img {
width: 100%;
}
.sponsors-carousel {
float: left;
padding: 0 20px;
width: 100%;
}
.sponsor {
background: #fafafa none repeat scroll 0 0;
float: left;
margin-bottom: 2px;
padding: 30px 20px;
text-align: center;
width: 100%;
-webkit-box-shadow: 0 1px 2px #dfdfdf;
-moz-box-shadow: 0 1px 2px #dfdfdf;
-ms-box-shadow: 0 1px 2px #dfdfdf;
-o-box-shadow: 0 1px 2px #dfdfdf;
box-shadow: 0 1px 2px #dfdfdf;
}
.gray .sponsor {
background: #FFF;
}
.sponsor:hover {
background: none repeat scroll 0 0 #e0e0e0;
}
.sponsor > a {
float: left;
text-align: center;
width: 100%;
}
.sponsor img, .owl-carousel .sponsor img {
display: unset;
width: auto;
}
.sponsors-carousel .owl-nav {
height: 0;
left: 0;
margin-top: -16px;
position: absolute;
top: 50%;
width: 100%;
}
.sponsors-carousel .owl-nav > div {
border: 1px solid #818181;
color: rgba(0, 0, 0, 0);
position: relative;
float: left;
height: 33px;
width: 33px;
}
.sponsors-carousel .owl-nav > div:before {
color: #9f9f9f;
content: "\f104";
font-family: fontawesome;
font-size: 20px;
left: 0;
line-height: 30px;
position: absolute;
text-align: center;
top: 0;
width: 100%;
}
.sponsors-carousel .owl-nav > div.owl-prev {
margin-left: -25px;
}
.sponsors-carousel .owl-nav > div.owl-next {
float: right;
margin-left: 0;
margin-right: -25px;
}
.sponsors-carousel .owl-nav > div.owl-next:before {
content: "\f105";
}
.countries {
float: left;
width: 100%;
}
.countries-list {
float: left;
margin-top: 30px;
width: 100%;
}
.page-top {
float: left;
width: 100%;
padding: 70px 0;
z-index: 1;
position: relative;
}
.page-top:before {
background: #000000 none repeat scroll 0 0;
content: "";
height: 100%;
width: 100%;
opacity: 0.7;
z-index: -1;
position: absolute;
left: 0;
top: 0;
}
.page-title {
float: left;
text-align: center;
width: 100%;
}
.page-top h2 {
color: #ffffff;
float: left;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 28px;
margin: 0 0 20px;
width: 100%;
}
.page-title > ul {
float: left;
list-style: outside none none;
margin: 0;
padding: 0;
text-align: center;
width: 100%;
}
.page-title > ul li {
color: #ffffff;
display: inline-block;
font-size: 11px;
padding: 0 20px;
position: relative;
}
.page-title > ul li a {
color: inherit;
}
.page-title > ul li::before {
content: "/";
position: absolute;
right: -2px;
top: 1px;
}
.page-title > ul li:last-child:before {
display: none;
}
.gallery-page {
float: left;
width: 100%;
margin-bottom: -30px;
}
.gallery {
float: left;
margin-bottom: 30px;
position: relative;
width: 100%;
}
.gallery-img {
float: left;
position: relative;
overflow: hidden;
width: 100%;
}
.gallery-img img {
width: 100%;
}
.gallery-detail {
background: #ffffff none repeat scroll 0 0;
float: left;
margin: -50px 3% 0;
padding: 30px;
position: relative;
text-align: center;
width: 94%;
z-index: 1;
}
.gallery-img:hover .gallery-detail {
opacity: 0;
-webkit-transform: translateY(50%);
-moz-transform: translateY(50%);
-ms-transform: translateY(50%);
-o-transform: translateY(50%);
transform: translateY(50%);
}
.gallery-detail > ul {
float: left;
list-style: outside none none;
margin: 0 0 10px;
padding: 0;
text-align: center;
width: 100%;
}
.gallery-detail > ul li {
display: inline-block;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 11px;
line-height: 10px;
padding: 0 8px;
position: relative;
}
.gallery-detail > ul li::before {
content: "/";
position: absolute;
right: -2px;
top: 0;
}
.gallery-detail > ul li:last-child::before {
display: none;
}
.gallery-detail h3 {
float: left;
font-family: "Roboto Slab";
font-size: 15px;
font-weight: 600;
margin: 0;
text-transform: uppercase;
width: 100%;
}
.gallery-detail h3 a {
color: inherit;
}
.gallery-img.style2 .gallery-detail {
margin: 0;
opacity: 1;
width: 100%;
-webkit-transform: translateY(0);
-moz-transform: translateY(0);
-ms-transform: translateY(0);
-o-transform: translateY(0);
transform: translateY(0);
}
.cart-table, .cart-box {
border: 1px solid #dddcdc;
float: left;
overflow: hidden;
width: 100%;
margin-bottom: 30px;
}
.cart-heading {
background: none repeat scroll 0 0 #272727;
float: left;
width: 100%;
cursor: pointer;
}
.cart-heading > ul {
float: left;
list-style: outside none none;
margin: 0;
padding: 0;
width: 100%;
}
.cart-table ul li {
float: left;
width: 10%;
}
.cart-heading > ul li {
color: #ffffff;
font-family: arimo, roboto slab, "Microsoft YaHei";
font-size: 12px;
font-weight: 600;
padding: 25px 10px;
}
.cart-table ul li.col1 {
padding: 25px 35px;
width: 25%;
}
.cart-table ul li.col2 {
width: 15%;
}
.cart-list {
background: none repeat scroll 0 0 #ffffff;
float: left;
width: 100%;
}
.cart-item {
border-bottom: 1px solid #dddcdc;
float: left;
position: relative;
width: 100%;
z-index: 1;
}
.cart-item > ul {
float: left;
list-style: outside none none;
margin: 0;
padding: 0;
width: 100%;
}
.cart-item > ul li.col1 {
padding: 15px 30px;
}
.cart-item > ul li.col2 {
padding: 15px 10px;
}
.cart-item img {
float: left;
height: 40px;
margin-right: 15px;
width: 40px;
}
.cart-item span, .cart-item i {
color: #3f3f3f;
float: left;
font-family: arimo, "Microsoft YaHei";
font-size: 12px;
line-height: 20px;
padding: 10px 0;
}
.cart-item i {
font-family: arimo, "Microsoft YaHei";
font-size: 14px;
font-style: normal;
}
.cart-item span.remove {
float: left;
width: 100%;
}
.cart-item i.ti-close {
font-family: themify;
cursor: pointer;
}
.input-group {
background: #ffffff;
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjIzJSIgc3RvcC1jb2xvcj0iI2ZiZmJmYiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjU4JSIgc3RvcC1jb2xvcj0iI2ZhZmFmYSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmOGY4ZjgiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top, #ffffff 0%, #fbfbfb 23%, #fafafa 58%, #f8f8f8 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffffff), color-stop(23%, #fbfbfb), color-stop(58%, #fafafa), color-stop(100%, #f8f8f8));
background: -webkit-linear-gradient(top, #ffffff 0%, #fbfbfb 23%, #fafafa 58%, #f8f8f8 100%);
background: -o-linear-gradient(top, #ffffff 0%, #fbfbfb 23%, #fafafa 58%, #f8f8f8 100%);
background: -ms-linear-gradient(top, #ffffff 0%, #fbfbfb 23%, #fafafa 58%, #f8f8f8 100%);
background: linear-gradient(to bottom, #ffffff 0%, #fbfbfb 23%, #fafafa 58%, #f8f8f8 100%);
filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f8f8f8', GradientType=0 );
border: 1px solid #d2d0d0;
float: left;
overflow: hidden;
padding-right: 30px;
position: relative;
width: 65%;
}
.input-group:before {
background: none repeat scroll 0 0 #d2d0d0;
content: "";
height: 10px;
margin-top: -5px;
position: absolute;
right: 30px;
top: 50%;
width: 1px;
}
.input-group span.input-group-btn {
border: 0 none;
height: 50%;
width: 30px;
padding: 0;
z-index: 5;
position: absolute;
right: 1px;
top: 1px;
}
.input-group input.form-control {
background: none repeat scroll 0 0 rgba(0, 0, 0, 0);
border: 0 none;
box-shadow: none;
color: #6f6f6f;
font-family: arimo, "Microsoft YaHei";
font-size: 11px;
}
.input-group span.input-group-btn:last-child {
bottom: 1px;
top: auto;
}
.input-group span.input-group-btn button.btn {
background: none;
border: 0 none;
box-shadow: none;
border-radius: 0;
color: rgba(0, 0, 0, 0);
float: left;
height: 100%;
margin: 0;
padding: 0;
width: 100%;
z-index: 2;
}
.input-group span.input-group-btn:before {
border-bottom: 4px solid #6f6f6f;
border-left: 4px solid rgba(0, 0, 0, 0);
border-right: 4px solid rgba(0, 0, 0, 0);
bottom: 3px;
content: "";
height: 0;
left: 50%;
margin-left: -2px;
position: absolute;
width: 0;
z-index: 0;
}
.input-group span.input-group-btn:last-child:before {
border-bottom: 0 none;
border-top: 4px solid #6f6f6f;
top: 3px;
}
.cart-bottom {
background: #FFF;
border-top: 1px solid #dddcdc;
float: left;
margin-top: -1px;
padding: 20px 60px;
width: 100%;
}
.cart-bottom a {
float: right;
margin-left: 20px;
}
.button {
background: #363636;
color: #ffffff;
float: left;
font-family: arimo, "Microsoft YaHei";
font-size: 11px;
letter-spacing: 0.6px;
line-height: 16px;
padding: 12px 25px;
position: relative;
z-index: 1;
}
.button:hover {
color: #FFF;
}
.button:before {
background: url(../fonts/91902c01a24b422aa0aa7442e0b6cc0b.woff);
background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255,255,255,1)), color-stop(100%, rgba(255,255,255,0)));
background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
background: -o-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
background: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff', GradientType=0 );
content: "";
z-index: 0;
opacity: 0.3;
height: 100%;
width: 100%;
position: absolute;
left: 0;
top: 0;
}
ins {
text-decoration: none;
}
.cart-heading h5 {
color: #ffffff;
float: left;
font-size: 16px;
font-weight: 600;
letter-spacing: 0.7px;
margin: 0;
padding: 25px 20px;
text-align: center;
width: 100%;
}
.cart-box .cart-item {
padding: 15px 50px;
}
.cart-box .cart-item .row > div {
padding: 0 5px;
}
.cart-box .cart-item .row {
margin: 0 -10px;
}
.cart-item:nth-child(2n+2) {
background: none repeat scroll 0 0 #f9f9f9;
}
.shipping {
float: left;
font-size: 24px;
text-align: center;
width: 100%;
}
.cart-price {
color: #343434;
float: left;
font-size: 15px;
font-weight: 600;
line-height: 20px;
padding: 10px 0;
width: 100%;
}
.cart-price span {
font-size: 13px;
font-weight: 300;
margin-left: 7px;
}
.checkout-page .cart-box .cart-detail, .checkout-page .cart-box .cart-bottom {
display: none;
}
.cart-heading h6 {
color: #ffffff;
font-family: arimo, roboto slab, "Microsoft YaHei";
font-size: 16px;
font-weight: 600;
letter-spacing: 0.4px;
margin: 0;
padding: 25px 50px;
}
.cart-detail {
background: none repeat scroll 0 0 #ffffff;
float: left;
padding: 65px 100px;
width: 100%;
}
.cart-detail h4 {
color: #343434;
float: left;
font-size: 17px;
font-weight: 600;
margin: 0 0 25px;
text-transform: uppercase;
width: 100%;
}
.cart-detail {
color: #3f3f3f;
float: left;
font-size: 12px;
margin: 0;
width: 100%;
}
.cart-detail p {
color: #3f3f3f;
float: left;
font-size: 12px;
line-height: 26px;
width: 100%;
}
.checkbox, .radio {
width: 19px;
height: 25px;
padding: 0 5px 0 0;
background: url(../img/checkbox.png) no-repeat;
display: block;
clear: left;
float: left;
}
.radio {
background: url(../img/radio.png) no-repeat;
}
.form-field {
float: left;
margin-bottom: 10px;
width: 100%;
}
.form-field .radio {
height: 22px;
margin: 0 10px 0 0;
padding: 0;
width: 18px;
}
.form-field label {
color: #343434;
font-family: arimo, roboto slab, "Microsoft YaHei";
font-size: 13px;
line-height: 22px;
margin: 0;
text-transform: uppercase;
}
.choice {
float: left;
margin-bottom: 10px;
width: 100%;
}
.cart-detail .button {
margin-right: 20px;
margin-top: 30px;
}
.form {
float: left;
width: 100%;
}
.form .row > div {
padding: 0 5px;
}
.form .row {
margin: 0 -5px;
}
.password {
color: #3f3f3f;
float: left;
font-family: arimo, "Microsoft YaHei";
font-size: 12px;
margin: 25px 0 25px;
text-decoration: underline;
width: 100%;
}
.label {
color: #3f3f3f;
float: left;
font-family: arimo, "Microsoft YaHei";
font-size: 12px;
font-weight: 100;
margin-bottom: 9px;
margin-top: 30px;
padding: 0;
text-align: left;
width: 100%;
}
.cart-bottom .choice {
margin-bottom: 0;
margin-top: 10px;
width: auto;
}
.cart-bottom .choice .form-field {
margin: 0;
}
textarea.field {
min-height: 140px;
padding: 20px 30px;
}
.cart-box .cart-detail .cart-item {
padding: 0;
}
.order-rec {
background: none repeat scroll 0 0 #ffffff;
float: left;
padding: 70px;
position: relative;
text-align: center;
width: 100%;
z-index: 1;
}
.order-rec i {
color: #f9f9f9;
font-size: 150px;
width: 100%;
z-index: -1;
position: absolute;
top: 70px;
left: 0;
}
.order-rec > h4 {
float: left;
font-size: 24px;
font-weight: 600;
margin: 0 0 20px;
text-transform: uppercase;
width: 100%;
}
.order-rec > h4 strong {
font-size: 30px;
}
.order-rec .button {
display: table;
float: none;
margin: 30px auto 0;
}
.product-detail {
background: none repeat scroll 0 0 #ffffff;
float: left;
width: 100%;
padding: 50px 50px 50px 0;
position: relative;
}
.product-detail:before {
background: none repeat scroll 0 0 #ffffff;
content: "";
height: 100%;
width: 100%;
position: absolute;
left: -100%;
top: 0;
}
.product-detail img {
width: 100%;
}
.product-detail {
background: none repeat scroll 0 0 #ffffff;
float: left;
padding: 50px 50px 50px 0;
position: relative;
width: 100%;
}
.product-detail::before {
background: none repeat scroll 0 0 #ffffff;
content: "";
height: 100%;
width: 100%;
position: absolute;
left: -100%;
top: 0;
}
.product-detail img {
width: 100%;
}
.product-desc {
float: left;
padding: 30px 0 0 20px;
}
.product-desc > strong {
float: left;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 14px;
margin-bottom: 10px;
text-transform: uppercase;
width: 100%;
}
.product-desc > strong i {
color: #888888;
font-size: 12px;
font-style: normal;
font-weight: 300;
padding: 0 10px;
}
h2.product-name {
color: #343434;
float: left;
font-family: arimo, roboto slab, "Microsoft YaHei";
font-size: 22px;
font-weight: 600;
margin: 0 0 20px;
text-transform: uppercase;
width: 100%;
}
.product-desc > span {
float: left;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 26px;
font-weight: 300;
line-height: 30px;
margin: 0 0 20px;
width: 100%;
}
.product-desc > p {
color: #666666;
font-size: 13px;
margin-bottom: 30px;
}
.product-count {
float: left;
width: 140px;
}
.product-count h6 {
float: left;
font-size: 14px;
font-weight: 700;
margin: 8px 15px 0 0;
}
.product-count .input-group {
float: left;
width: 90px;
}
.product-desc .share-this {
float: right;
margin-bottom: 8px;
margin-top: 8px;
}
.product-desc .button {
float: left;
margin-top: 20px;
}
.search-filters {
float: left;
width: 100%;
}
.search-filters > h4 {
float: left;
font-size: 16px;
margin: 0 0 20px;
width: 100%;
}
.select2 {
float: left;
height: 50px;
margin-bottom: 10px;
padding: 0 !important;
width: 100% !important;
}
.select2-container .select2-selection--single {
background: #ffffff;
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjIzJSIgc3RvcC1jb2xvcj0iI2ZiZmJmYiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjU4JSIgc3RvcC1jb2xvcj0iI2ZhZmFmYSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmOGY4ZjgiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top, #ffffff 0%, #fbfbfb 23%, #fafafa 58%, #f8f8f8 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffffff), color-stop(23%, #fbfbfb), color-stop(58%, #fafafa), color-stop(100%, #f8f8f8));
background: -webkit-linear-gradient(top, #ffffff 0%, #fbfbfb 23%, #fafafa 58%, #f8f8f8 100%);
background: -o-linear-gradient(top, #ffffff 0%, #fbfbfb 23%, #fafafa 58%, #f8f8f8 100%);
background: -ms-linear-gradient(top, #ffffff 0%, #fbfbfb 23%, #fafafa 58%, #f8f8f8 100%);
background: linear-gradient(to bottom, #ffffff 0%, #fbfbfb 23%, #fafafa 58%, #f8f8f8 100%);
filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f8f8f8', GradientType=0 );
border: 0 none;
float: left;
height: 100%;
padding: 0;
width: 100%;
}
.select2-container .select2-selection--single .select2-selection__rendered {
color: #646464;
float: none;
font-family: arimo, "Microsoft YaHei";
font-size: 11px;
letter-spacing: 0.3px;
line-height: 50px;
padding: 0 40px 0 20px;
}
.select2-container span.selection {
float: left;
height: 100%;
line-height: 50px;
padding: 0;
width: 100%;
}
.select2-container .select2-selection--single .select2-selection__arrow {
background: url("../img/select2.png") no-repeat scroll center center rgba(0, 0, 0, 0);
height: 100%;
right: 0;
top: 0;
width: 40px;
}
.select2-container .select2-selection--single .select2-selection__arrow b {
display: none;
}
.select2-container .select2-selection--single .select2-selection__arrow:before {
background: none repeat scroll 0 0 #d2d0d0;
content: "";
height: 10px;
margin-top: -5px;
width: 1px;
z-index: 1;
position: absolute;
top: 50%;
left: 0;
}
.select2-results__option {
border-bottom: 1px solid #f3f3f3;
font-family: arimo, roboto slab, "Microsoft YaHei";
font-size: 11px;
padding: 6px 20px;
-webkit-transition: all 0.2s linear;
-moz-transition: all 0.2s linear;
-ms-transition: all 0.2s linear;
-o-transition: all 0.2s linear;
transition: all 0.2s linear;
}
.select2-container--default .select2-results__option--highlighted[aria-selected] {
background: none repeat scroll 0 0 #8f8f8f;
}
.select2-container--default .select2-results__option[aria-selected="true"] {
color: #FFF;
}
.search-filters .select2 {
margin-bottom: 30px;
}
.search-filters {
margin-bottom: -30px;
}
.search-page h5 {
float: left;
font-size: 16px;
font-weight: 700;
margin: 40px 0 20px;
width: 100%;
}
.search-page > p {
color: #646464;
float: left;
font-size: 13px;
line-height: 18px;
margin-bottom: 20px;
width: 100%;
}
.search-page .contact-form input {
background: none repeat scroll 0 0 #ffffff;
}
.field {
border: 1px solid #d2d0d0;
float: left;
font-family: arimo, "Microsoft YaHei";
font-size: 11px;
height: 40px;
letter-spacing: 0.3px;
padding: 10px 20px;
width: 100%;
margin-bottom: 10px;
}
.map {
float: left;
width: 100%;
}
.map #map-canvas {
height: 500px;
margin: 0px;
padding: 0px
}
.contact-box {
background: none repeat scroll 0 0 #ffffff;
float: left;
padding: 75px 0;
width: 100%;
}
.countries-contact .nav {
background: none repeat scroll 0 0 #f9f9f9;
border: 0 none;
float: left;
width: 100%;
padding: 0 70px;
}
.countries-contact .nav {
background: none repeat scroll 0 0 #f9f9f9;
border: 0 none;
float: left;
padding: 0 120px;
width: 100%;
}
.countries-contact .nav li {
float: left;
margin: 0;
padding: 20px 3px;
width: 100%;
}
.countries-contact .nav li a, .countries-contact .nav li.active a {
background: none repeat scroll 0 0 #ffffff;
border: 0 none;
color: #545454;
float: left;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 13px;
font-weight: 600;
letter-spacing: 0;
line-height: 25px;
margin: 0;
padding: 15px;
width: 100%;
}
.countries-contact .nav li a img {
float: left;
width: auto;
margin-right: 10px;
}
.countries-contact .owl-nav {
padding: 0 62px;
width: 100%;
height: 0;
position: absolute;
top: 20px;
left: 0;
}
.countries-contact .owl-nav > div {
background: none repeat scroll 0 0 #ffffff;
color: rgba(0, 0, 0, 0);
float: left;
height: 55px;
width: 55px;
line-height: 50px;
position: relative;
text-align: center;
}
.countries-contact .owl-nav > div.owl-next {
float: right;
}
.countries-contact .owl-nav > div::before {
color: #000000;
content: "\e629";
font-family: themify;
line-height: 55px;
height: 100%;
width: 100%;
position: absolute;
left: 0;
top: 0;
}
.countries-contact .owl-nav > div.owl-next:before {
content: "\e628";
}
.countries-contact .tab-content {
float: left;
padding: 65px 60px 0;
width: 100%;
}
.contact-info {
float: left;
position: relative;
width: 100%;
}
.contact-info > p {
color: #646464;
font-size: 13px;
letter-spacing: 0.3px;
line-height: 28px;
margin-bottom: 50px;
}
.contact-info strong {
color: #545454;
float: left;
font-family: arimo, roboto, "Microsoft YaHei";
font-weight: 700;
margin-bottom: 15px;
width: 100%;
}
.contact-info strong i {
margin-right: 10px;
}
.contact-info span {
color: #646464;
float: left;
font-family: arimo, "Microsoft YaHei";
font-size: 12px;
letter-spacing: 0;
margin-bottom: 50px;
width: 100%;
}
.contact-form {
float: left;
position: relative;
width: 100%;
}
.contact-form input, .contact-form textarea {
background: none repeat scroll 0 0 #f9f9f9;
border: 0 none;
box-shadow: none;
color: #929292;
float: left;
font-family: arimo, "Microsoft YaHei";
font-size: 11px;
height: 50px;
letter-spacing: 0.3px;
margin-bottom: 10px;
padding: 15px 20px;
width: 100%;
max-width: 100%;
}
.contact-form textarea {
min-height: 130px;
min-width: 100%;
}
.contact-form button {
background: none repeat scroll 0 0 #000000;
border: 0 none;
color: #ffffff;
float: left;
font-family: arimo, "Microsoft YaHei";
font-size: 12px;
letter-spacing: 0.5px;
margin-top: 15px;
padding: 13px 26px;
text-transform: uppercase;
}
.full-border {
border-bottom: 1px dashed #c2c2c2;
float: left;
margin: 30px 0;
width: 100%;
}
#message {
float: left;
margin: 0;
padding: 0;
width: 100%;
}
.error_message {
background: url("../img/error.gif") no-repeat scroll 10px center #fbe3e4;
border: 1px solid #fbc2c4;
color: #8a1f11;
display: block;
float: left;
font-family: archivo narrow, "Microsoft YaHei";
font-weight: 600;
line-height: 22px;
margin-bottom: 20px;
padding: 10px 10px 10px 35px;
text-transform: uppercase;
width: 100%;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
-ms-border-radius: 3px;
-o-border-radius: 3px;
border-radius: 3px;
}
.loader {
padding: 0 10px;
}
#contact #success_page h1 {
background: url('http://www.b5.com/skin/images/success.gif') left no-repeat;
padding-left: 22px;
}
acronym {
border-bottom: 1px dotted #ccc;
}
.success_page {
background-color: #dff0d8;
border-color: #d6e9c6;
color: #3c763d;
border: 1px solid rgba(0, 0, 0, 0);
margin-bottom: 20px;
padding: 15px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
-ms-border-radius: 4px;
-o-border-radius: 4px;
border-radius: 4px;
}
.success_page h1 {
font-size: 20px;
font-weight: 600;
margin: 0;
text-transform: uppercase;
}
.success_page p {
font-size: 13px;
line-height: 20px;
margin: 10px 0 0;
}
.members {
float: left;
width: 100%;
margin-bottom: -30px;
}
.team-member {
background: none repeat scroll 0 0 #ffffff;
float: left;
width: 100%;
text-align: center;
margin-bottom: 30px;
}
.member-img {
float: left;
width: 100%;
position: relative;
overflow: hidden;
}
.member-img > img {
width: 100%;
}
.team-member:hover .member-img > img {
-webkit-transform: scale(1.1);
-moz-transform: scale(1.1);
-ms-transform: scale(1.1);
-o-transform: scale(1.1);
transform: scale(1.1);
}
.member-img:before, .member-img:after {
border-bottom: 50px solid rgba(0, 0, 0, 0);
border-right: 50px solid rgba(0, 0, 0, 0);
border-top: 50px solid #ffffff;
content: "";
height: 0;
width: 0;
z-index: 1;
position: absolute;
left: 0;
top: 0;
}
.member-img:after {
left: auto;
right: 0;
top: auto;
bottom: 0;
border-top: none;
border-right: none;
border-left: 50px solid rgba(0, 0, 0, 0);
border-bottom: 50px solid #FFF;
}
.member-img:hover:before {
left: -50px;
}
.member-img:hover:after {
right: -50px;
}
.member-social {
padding: 10px;
width: 100%;
z-index: 1;
position: absolute;
bottom: 0;
left: 0;
}
.team-member:hover .member-social {
bottom: 30px;
}
.member-social:before {
background: none repeat scroll 0 0 padding-box content-box #000000;
content: "";
padding: 10px;
opacity: 0.95;
height: 100%;
width: 100%;
z-index: -1;
position: absolute;
left: 0;
top: 0;
}
.member-social > span {
color: #ffffff;
float: left;
font-family: archivo narrow, "Microsoft YaHei";
font-size: 14px;
padding: 13px 0 13px 20px;
}
.social-links {
float: right;
padding: 10px 20px 10px 0;
}
.social-links > a, .social-links > a:hover {
color: #ffffff;
float: left;
font-size: 12px;
height: 25px;
line-height: 26px;
margin-right: 5px;
text-align: center;
width: 20px;
}
.social-links > a:hover {
background: #FFF;
color: #afafaf;
}
.team-member > h4 {
color: #303030;
float: left;
font-size: 18px;
margin: 0;
padding: 25px 20px 8px;
width: 100%;
}
.team-member > h4 a {
color: inherit;
}
.team-member > i {
float: left;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 14px;
font-style: normal;
font-weight: 400;
padding: 0 20px 30px;
width: 100%;
}
.team-detail {
background: none repeat scroll 0 0 #ffffff;
float: left;
width: 100%;
}
.team-detail > div {
padding: 0;
}
#team-detail-img {
float: left;
position: relative;
width: 100%;
}
#team-detail-img > img {
width: 100%;
}
.team-detail .member-social {
bottom: 50px;
left: 20%;
width: 60%;
}
.team-detail .member-social span {
padding: 20px 0 20px 30px;
}
.team-detail .social-links {
padding: 18px 20px 18px 0;
}
.team-detail .social-links > a {
font-size: 16px;
height: 25px;
line-height: 30px;
width: 30px;
}
#team-detail-img > ul {
direction: rtl;
list-style: outside none none;
margin: 0;
padding: 0;
position: absolute;
right: 0;
text-align: right;
top: 25px;
}
#team-detail-img > ul li {
display: table;
margin-bottom: 10px;
margin-right: 20px;
overflow: hidden;
position: relative;
z-index: 1;
}
#team-detail-img > ul li:hover {
margin-right: 0;
}
#team-detail-img > ul li span {
color: #ffffff;
font-size: 16px;
height: 60px;
left: 0;
line-height: 60px;
position: absolute;
text-align: center;
top: 0;
width: 60px;
}
#team-detail-img p {
color: #ffffff;
direction: ltr;
float: left;
font-family: arimo, "Microsoft YaHei";
font-size: 13px;
line-height: 20px;
margin: 0;
padding: 20px 20px 20px 60px;
text-align: left;
}
#team-detail-img > ul li:hover p {
width: auto;
}
#team-detail-img p i {
display: inline-block;
font-style: normal;
margin-right: 20px;
}
#team-detail-img > ul li:before {
background: none repeat scroll 0 0 #000000;
content: "";
height: 100%;
left: 0;
opacity: 1;
position: absolute;
top: 0;
width: 100%;
z-index: -1;
}
.team-desc {
float: left;
padding: 70px 45px 0;
width: 100%;
}
.team-desc > p {
letter-spacing: 0;
margin: 0 0 45px;
}
#team-detail-img > ul li:hover p {
margin: 0 !important;
}
.join-team {
background: none repeat scroll 0 0 #ffffff;
float: left;
padding: 75px 100px;
text-align: center;
width: 100%;
}
.join-team > h4 {
float: left;
font-size: 22px;
font-weight: 600;
margin: 0 0 15px;
text-transform: uppercase;
width: 100%;
}
.join-team > p {
color: #666666;
float: left;
font-size: 13px;
width: 100%;
}
.join-team .button {
display: inline-block;
float: none;
margin-top: 30px;
}
.all-skills {
float: left;
margin-bottom: -30px;
width: 100%;
}
.skills {
float: left;
margin-bottom: 30px;
width: 100%;
}
.skills > span {
border: 1px solid #8f8f8f;
float: left;
font-size: 30px;
height: 93px;
line-height: 93px;
margin-right: 20px;
text-align: center;
width: 93px;
}
.skills h5 {
font-size: 16px;
font-weight: 600;
margin: 0px 0px 10px;
text-transform: uppercase;
font-family: arimo, roboto, "Microsoft YaHei";
}
.skills > p {
color: #666666;
font-family: arimo, "Microsoft YaHei";
font-size: 13px;
line-height: 25px;
}
.event-time {
color: #888888;
float: left;
font-family: arimo, "Microsoft YaHei";
font-size: 12px;
letter-spacing: 0.4px;
line-height: 22px;
margin-right: 40px;
}
.event-time i {
margin-right: 5px;
}
.event-org {
border-top: 1px dashed #bfbfbf;
float: left;
margin-top: 25px;
padding-top: 25px;
width: 100%;
}
.event-org > h4 {
color: #2A2929;
float: left;
font-size: 17px;
margin: 0px 30px 0px 0px;
text-transform: uppercase;
font-family: arimo, roboto, "Microsoft YaHei";
}
.event-org > h4 span {
font-weight: 700;
}
.event-org > ul {
float: right;
list-style: outside none none;
margin: 0;
padding: 0;
}
.event-org li {
color: #888;
float: left;
margin-left: 50px;
font-size: 12px;
}
.event-org li:first-child {
margin: 0;
}
.event-org li i {
margin-right: 5px;
}
.charity-events {
float: left;
width: 100%;
margin-bottom: -30px;
}
.charity-events .upcoming-event {
margin-bottom: 30px;
}
.all-projects {
float: left;
width: 100%;
margin-bottom: -30px;
}
.all-projects .welfare-project {
margin-bottom: 30px;
}
.donation-popup {
position: fixed;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
z-index: 2147483647;
display: none;
background: rgba(0, 0, 0, 0.8) none repeat scroll 0% 0%;
overflow-x: hidden;
overflow-y: scroll;
}
.donation-popup .container {
position: relative;
height: 100%;
width: 1300px;
}
.popup-centralize {
position: absolute;
overflow: hidden;
padding: 100px;
width: 100%;
left: 0px;
margin-top: 100px;
margin-bottom: 100px;
}
.popup-centralize:before {
content: "";
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: #f6f4f4;
opacity: 0.9;
}
.donation-intro {
float: left;
width: 100%;
margin-bottom: 80px;
}
.make-donation {
float: left;
width: 100%;
}
.make-donation span {
float: left;
width: 100%;
color: #505050;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 16px;
margin-bottom: 15px;
font-weight: 300;
}
.make-donation h5 {
float: left;
width: 100%;
font-size: 50px;
font-family: arimo, roboto, "Microsoft YaHei";
font-weight: 700;
text-transform: uppercase;
margin: 0 0 20px;
}
.make-donation h5 i {
font-size: 30px;
font-style: normal;
font-weight: 300;
text-transform: capitalize;
}
.make-donation p {
float: left;
width: 100%;
font-size: 13px;
color: #646464;
}
.cause-selectbox .select2-container .select2-selection--single {
background: rgba(255, 255, 255, 0.8) none repeat scroll 0 0;
height: 50px;
-webkit-border-radius: 3px !important;
-moz-border-radius: 3px !important;
-ms-border-radius: 3px !important;
-o-border-radius: 3px !important;
border-radius: 3px !important;
}
.cause-selectbox .select2-container {
height: 50px;
}
.cause-selectbox .select2-container .select2-selection--single .select2-selection__rendered {
line-height: 50px;
padding: 0px 40px 0 20px;
}
.cause-selectbox .select2-container--default .select2-selection--single .select2-selection__arrow {
width: 40px;
height: 50px;
}
.payment-box {
float: left;
width: 100%;
position: relative;
background: #FFF none repeat scroll 0% 0%;
overflow: hidden;
padding-bottom: 50px;
-webkit-box-shadow: 0 0 4px #BBBBBB !important;
-moz-box-shadow: 0 0 4px #BBBBBB !important;
-ms-box-shadow: 0 0 4px #BBBBBB !important;
-o-box-shadow: 0 0 4px #BBBBBB !important;
box-shadow: 0 0 4px #BBBBBB !important;
}
.frequency {
float: left;
width: 100%;
padding: 0px;
list-style: outside none none;
margin-bottom: 50px;
}
.frequency li:first-child:nth-last-child(1), .frequency li:first-child:nth-last-child(1) ~ li {
width: 100%;
}
.frequency li:first-child:nth-last-child(2), .frequency li:first-child:nth-last-child(2) ~ li {
width: 50%;
}
.frequency li:first-child:nth-last-child(3), .frequency li:first-child:nth-last-child(3) ~ li {
width: 33.334%;
}
.frequency li:first-child:nth-last-child(4), .frequency li:first-child:nth-last-child(4) ~ li {
width: 25%;
}
.frequency li:first-child:nth-last-child(5), .frequency li:first-child:nth-last-child(5) ~ li {
width: 20%;
}
.frequency li:first-child:nth-last-child(6), .frequency li:first-child:nth-last-child(6) ~ li {
width: 16.666%;
}
.frequency li:first-child:nth-last-child(7), .frequency li:first-child:nth-last-child(7) ~ li {
width: 14.285%;
}
.frequency li:first-child:nth-last-child(8), .frequency li:first-child:nth-last-child(8) ~ li {
width: 12.5%;
}
.frequency li {
float: left;
text-align: center;
padding-right: 1px;
}
.frequency li:last-child {
padding: 0;
}
.frequency li a {
padding: 20px;
float: left;
width: 100%;
position: relative;
z-index: 1;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 15px;
color: #FFF;
font-weight: 300;
}
.frequency li a:before {
content: "";
background: #515151 none repeat scroll 0 0;
z-index: -1;
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
}
.your-donation {
float: left;
width: 100%;
margin-top: 40px;
text-align: center;
}
.popup-title {
font-family: arimo, roboto slab, "Microsoft YaHei";
font-size: 22px;
float: left;
width: 100%;
margin-bottom: 30px;
text-align: center;
}
ul.donation-figures {
float: left;
list-style: outside none none;
margin: 0;
padding: 0;
text-align: center;
width: 100%;
}
ul.donation-figures li {
display: inline-block;
margin: 0;
}
.wpdonation-button, .donation-figures li a {
background: #ffffff;
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjIzJSIgc3RvcC1jb2xvcj0iI2ZiZmJmYiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjU4JSIgc3RvcC1jb2xvcj0iI2ZhZmFmYSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmOGY4ZjgiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top, #ffffff 0%, #fbfbfb 23%, #fafafa 58%, #f8f8f8 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffffff), color-stop(23%, #fbfbfb), color-stop(58%, #fafafa), color-stop(100%, #f8f8f8));
background: -webkit-linear-gradient(top, #ffffff 0%, #fbfbfb 23%, #fafafa 58%, #f8f8f8 100%);
background: -o-linear-gradient(top, #ffffff 0%, #fbfbfb 23%, #fafafa 58%, #f8f8f8 100%);
background: -ms-linear-gradient(top, #ffffff 0%, #fbfbfb 23%, #fafafa 58%, #f8f8f8 100%);
background: linear-gradient(to bottom, #ffffff 0%, #fbfbfb 23%, #fafafa 58%, #f8f8f8 100%);
filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f8f8f8', GradientType=0 );
color: #5d5d5d;
float: left;
font-family: arimo, roboto slab, "Microsoft YaHei";
font-size: 15px;
line-height: 25px;
padding: 7px 20px;
border: 1px solid #C5C5C5;
}
.wpdonation-button, .donation-figures li a.active {
background-image: none;
color: #FFF;
}
.textfield {
float: left;
position: relative;
width: 100%;
}
.textfield input, .textfield textarea {
border: 1px solid #D2CFCF;
color: #A8A8A8;
float: left;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 12px;
letter-spacing: 0.5px;
height: 49px;
padding: 10px 20px;
width: 100%;
background: #F9F8F8 none repeat scroll 0% 0%;
}
.textfield textarea::-moz-placeholder, .textfield input::-moz-placeholder {
opacity: 1;
color:#8f8f8f;
}
.textfield textarea::-webkit-placeholder, .textfield input::-webkit-placeholder {
opacity: 1;
color:#8f8f8f;
}
.donation-amount .textfield textarea {
text-align: center;
line-height: 110px;
min-height: 120px;
}
.donation-amount .textfield textarea {
font-size: 20px;
line-height: 90px;
font-family: arimo, roboto, "Microsoft YaHei";
color: #333;
background: #f5f5f5;
}
.donation-amount .textfield textarea::-moz-placeholder {
font-size: 12px;
}
.donation-amount {
float: left;
margin-top: 50px;
width: 100%;
}
.donation-amount .textfield::after {
background: none repeat scroll 0 0 #ffffff;
border: 0 none;
content: "";
height: 57px;
margin-left: -28.5px;
margin-top: -6.5px;
width: 57px;
z-index: 0;
}
.wpdonation-box ul {
border: 0 none;
}
.wpdonation-box .nav {
float: left;
text-align: center;
width: 100%;
}
.wpdonation-box .nav li {
display: inline-block;
float: none;
margin: 0 5px;
}
.wpdonation-box .nav li a, .wpdonation-box .nav li.active a, .wpdonation-box .nav li a:hover {
background: none repeat scroll 0 0 #4a4a4a;
border: 0 none;
color: #ffffff;
line-height: 20px;
margin: 0;
padding: 13px 50px;
}
.wpdonation-box > .tab-content {
float: left;
padding-top: 50px;
width: 100%;
}
.payment-type h3 {
color: #4d4c4c;
float: left;
font-size: 15px;
font-weight: 400;
margin: 0 0 20px;
text-align: center;
width: 100%;
}
.wpdonation-box .tab-content .tab-content {
float: left;
margin-top: 10px;
padding: 0 60px;
width: 100%;
}
.wpdonation-box .tab-content .tab-content p {
float: left;
font-family: arimo, roboto slab, "Microsoft YaHei";
margin-bottom: 30px;
text-align: center;
width: 100%;
}
.form {
float: left;
margin-bottom: -20px;
width: 100%;
}
.form > div {
margin-bottom: 20px;
}
.textfield > img {
position: absolute;
right: 10px;
top: 10px;
}
.wp-donation-system button {
background: none repeat scroll 0 0 #4a4a4a;
border: 0 none;
color: #ffffff;
display: table-caption;
float: none;
font-family: arimo, "Microsoft YaHei";
font-size: 11px;
font-weight: 700;
letter-spacing: 0.5px;
margin: 30px auto 0;
padding: 14px 50px;
text-transform: uppercase;
}
.donate-now {
float: left;
width: 100%;
text-align: center;
}
.proceed {
display: inline-block;
margin-top: 40px;
padding: 13px 40px;
background: black none repeat scroll 0% 0%;
color: rgb(255, 255, 255);
font-family: arimo, roboto slab, "Microsoft YaHei";
font-size: 13px;
text-transform: uppercase;
}
.proceed:hover {
color: #ffffff;
}
.select-payment, .personal-detail {
float: left;
width: 100%;
margin-top: 40px;
padding: 0px 50px;
display: none;
}
.payment-type .nav {
float: left;
text-align: center;
width: 100%;
border: 0;
}
.payment-type .nav li {
display: inline-block;
float: none;
margin: 0 5px;
}
.payment-type .nav li a, .payment-type .nav li.active a, .payment-type .nav li a:hover {
background: #4A4A4A none repeat scroll 0px 0px;
border: 0px none;
color: #FFF;
line-height: 20px;
margin: 0px;
padding: 13px 50px;
font-family: arimo, roboto slab, "Microsoft YaHei";
font-size: 13px;
}
.payment-type > .tab-content {
float: left;
padding-top: 50px;
width: 100%;
}
.payment-type .tab-content p {
float: left;
font-family: arimo, roboto slab, "Microsoft YaHei";
margin-bottom: 30px;
text-align: center;
width: 100%;
}
.form {
float: left;
margin-bottom: -20px;
width: 100%;
}
.form > div {
margin-bottom: 20px;
}
footer {
float: left;
width: 100%;
position: relative;
z-index: 0;
}
footer:before {
content: "";
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: #181723;
opacity: 0.7;
z-index: -1;
}
.footer-widgets {
float: left;
width: 100%;
margin-bottom: -30px;
}
footer .widget-title > span {
display: none;
}
footer .widget-title h4 {
color: #FFF;
font-size: 20px;
margin: 0px;
font-weight: 400;
letter-spacing: 0.5px;
}
footer .widget-title h4 span {
font-weight: inherit;
}
footer .widget ul {
padding: 0px;
list-style: outside none none;
float: left;
width: 100%;
}
footer .widget p, footer .widget ul li, footer .widget ul li a {
color: #eeeefe;
}
footer .widget ul li {
font-size: 13px;
line-height: 35px;
padding-left: 20px;
position: relative;
}
footer .widget ul li::before {
content: "";
position: absolute;
left: 0px;
top: 14px;
width: 6px;
height: 6px;
margin-top:;
background: #A6A5A5 none repeat scroll 0% 0%;
}
footer .widget ul li i {
margin-right: 10px;
font-size: 14px;
}
footer .widget .contact-widget ul li {
padding: 0px;
font-size: 12px;
}
footer .widget .contact-widget ul li:before {
display: none;
}
.contact-widget h5 {
float: left;
width: 100%;
color: rgb(255, 255, 255);
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 24px;
margin: 0px 0px 30px;
}
.contact-widget h5 span {
font-weight: 400;
}
.twitter-feed {
float: left;
width: 100%;
}
.tweet {
float: left;
width: 100%;
}
.tweet blockquote {
float: left;
width: 100%;
padding: 0;
border: 0;
font-family: arimo, "Microsoft YaHei";
font-size: 13px;
color: #efeeee;
line-height: 30px;
}
.footer-bar {
float: left;
width: 100%;
background: rgb(17, 17, 32) none repeat scroll 0% 0%;
padding: 30px 0px;
}
.newsletter-signup {
float: left;
width: 100%;
}
.footer-bar-title {
display: inline-block;
max-width: 35%;
color: #FFF;
margin: 0px;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 18px;
vertical-align: middle;
padding-right: 20px;
}
.newsletter-signup form {
display: inline-block;
vertical-align: middle;
width: 64%;
}
.newsletter-signup form input {
height: 40px;
display: table-cell;
width: 66%;
margin-right: 2%;
font-family: arimo, "Microsoft YaHei";
font-size: 12px;
color: #525151;
padding: 10px 20px;
border: 0;
}
.newsletter-signup form button {
display: table-cell;
width: 30%;
height: 40px;
padding: 10px;
}
.footer-social-btns {
float: right;
text-align: right;
width: 100%;
}
.social {
display: inline-block;
vertical-align: middle;
}
.social a {
float: left;
width: 44px;
height: 44px;
margin-right: 11px;
line-height: 44px;
text-align: center;
background: rgb(37, 37, 60) none repeat scroll 0% 0%;
color: rgb(255, 255, 255);
}
.social a i {
float: left;
line-height: 42px;
width: 100%;
}
footer .widget-post {
padding: 0;
border: 0;
}
.widget .widget-post ul li:before {
display: none
}
.bottom-bar {
float: left;
width: 100%;
padding: 20px 0px;
}
.bottom-links {
padding: 0px;
margin: 0px;
list-style: outside none none;
}
.bottom-links a {
border-right: 1px solid #464556;
color: #cbcbcb;
display: inline-block;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 13px;
line-height: 9px;
padding: 0 15px;
font-weight: 300;
}
.bottom-links a:last-child {
border: 0 none;
}
.bottom-bar p {
color: #afafaf;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 13px;
line-height: 20px;
margin: 0;
text-align: right;
}
.poptrox-overlay {
z-index: 2147483647 !important
}
.poptrox-popup {
z-index: 2147483647 !important
}
.close, .close:hover {
background: #4d4d4d none repeat scroll 0 0;
color: #ffffff;
font-size: 14px;
height: 40px;
line-height: 40px;
opacity: 1;
position: absolute;
right: 50px;
text-align: center;
top: 0;
width: 40px;
-webkit-border-radius: 0 0 3px 3px;
-moz-border-radius: 0 0 3px 3px;
-ms-border-radius: 0 0 3px 3px;
-o-border-radius: 0 0 3px 3px;
border-radius: 0 0 3px 3px;
}
.banner-popup {
position: fixed;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
display: none;
z-index: 2147483647;
background: rgba(0, 0, 0, 0.8) none repeat scroll 0% 0%;
}
.big-banner {
background: rgba(0, 0, 0, 0) url("http://www.b5.com/skin/images/big-banner.jpg") no-repeat scroll 0 0 / 100% 100%;
text-align: center;
height: 90%;
width: 80%;
position: absolute;
left: 10%;
top: 5%;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
-ms-border-radius: 4px;
-o-border-radius: 4px;
border-radius: 4px;
}
.big-banner::before {
content: "";
display: inline-block;
height: 100%;
vertical-align: middle;
}
.banner-inner {
display: inline-block;
vertical-align: middle;
width: 98%;
}
.banner-inner > h5 {
color: #303030;
float: left;
font-size: 40px;
font-weight: 200;
margin-bottom: 20px;
width: 100%;
}
.banner-inner > h5 strong {
text-transform: uppercase;
}
.banner-subtitle {
float: left;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 20px;
font-weight: 200;
margin-bottom: 20px;
width: 100%;
}
.banner-inner > strong {
color: #4d4d4d;
float: left;
font-family: arimo, roboto, "Microsoft YaHei";
font-size: 150px;
font-weight: 700;
width: 100%;
line-height: 120px;
margin: 20px 0;
}
.banner-inner > strong i {
font-style: normal;
margin-right: 11px;
}
.big-banner .theme-btn {
margin-top: 40px;
}
.owl-carousel .animated {
-webkit-animation-duration: 1000ms;
animation-duration: 1000ms;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
}
.owl-carousel .owl-animated-in {
z-index: 0;
}
.owl-carousel .owl-animated-out {
z-index: 1;
}
.owl-carousel .fadeOut {
-webkit-animation-name: fadeOut;
animation-name: fadeOut;
}
@-webkit-keyframes fadeOut {
0% {
opacity:1;
}
100% {
opacity:0;
}
}
@keyframes fadeOut {
0% {
opacity:1;
}
100% {
opacity:0;
}
}
.owl-height {
-webkit-transition: height 500ms ease-in-out;
-moz-transition: height 500ms ease-in-out;
-ms-transition: height 500ms ease-in-out;
-o-transition: height 500ms ease-in-out;
transition: height 500ms ease-in-out;
}
.owl-carousel {
display: none;
-webkit-tap-highlight-color: transparent;
position: relative;
z-index: 1;
}
.owl-carousel .owl-stage {
position: relative;
-ms-touch-action: pan-Y;
}
.owl-carousel .owl-stage:after {
content: ".";
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0;
}
.owl-carousel .owl-stage-outer {
position: relative;
overflow: hidden;
-webkit-transform: translate3d(0px, 0px, 0px);
}
.owl-carousel .owl-controls .owl-nav .owl-prev, .owl-carousel .owl-controls .owl-nav .owl-next, .owl-carousel .owl-controls .owl-dot {
cursor: pointer;
cursor: hand;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.owl-carousel.owl-loaded {
display: block;
}
.owl-carousel.owl-loading {
opacity: 0;
display: block;
}
.owl-carousel.owl-hidden {
opacity: 0;
}
.owl-carousel .owl-refresh .owl-item {
display: none;
}
.owl-carousel .owl-item {
position: relative;
min-height: 1px;
float: left;
-webkit-backface-visibility: hidden;
-webkit-tap-highlight-color: transparent;
-webkit-touch-callout: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.owl-carousel .owl-item img {
-webkit-transform-style: preserve-3d;
}
.owl-carousel.owl-text-select-on .owl-item {
-webkit-user-select: auto;
-moz-user-select: auto;
-ms-user-select: auto;
user-select: auto;
}
.owl-carousel .owl-grab {
cursor: move;
cursor: -webkit-grab;
cursor: -o-grab;
cursor: -ms-grab;
cursor: grab;
}
.owl-carousel.owl-rtl {
direction: rtl;
}
.owl-carousel.owl-rtl .owl-item {
float: right;
}
.no-js .owl-carousel {
display: block;
}
.owl-carousel .owl-item .owl-lazy {
opacity: 0;
-webkit-transition: opacity 400ms ease;
-moz-transition: opacity 400ms ease;
-ms-transition: opacity 400ms ease;
-o-transition: opacity 400ms ease;
transition: opacity 400ms ease;
}
.owl-carousel .owl-item img {
transform-style: preserve-3d;
}
.owl-carousel .owl-video-wrapper {
position: relative;
height: 100%;
background: #000;
}
.owl-carousel .owl-video-play-icon {
position: absolute;
height: 80px;
width: 80px;
left: 50%;
top: 50%;
margin-left: -40px;
margin-top: -40px;
background: url("http://www.b5.com/skin/images/owl.video.play.png") no-repeat;
cursor: pointer;
z-index: 1;
-webkit-backface-visibility: hidden;
-webkit-transition: scale 100ms ease;
-moz-transition: scale 100ms ease;
-ms-transition: scale 100ms ease;
-o-transition: scale 100ms ease;
transition: scale 100ms ease;
}
.owl-carousel .owl-video-play-icon:hover {
-webkit-transition: scale(1.3, 1.3);
-moz-transition: scale(1.3, 1.3);
-ms-transition: scale(1.3, 1.3);
-o-transition: scale(1.3, 1.3);
transition: scale(1.3, 1.3);
}
.owl-carousel .owl-video-playing .owl-video-tn, .owl-carousel .owl-video-playing .owl-video-play-icon {
display: none;
}
.owl-carousel .owl-video-tn {
opacity: 0;
height: 100%;
background-position: center center;
background-repeat: no-repeat;
-webkit-background-size: contain;
-moz-background-size: contain;
-o-background-size: contain;
background-size: contain;
-webkit-transition: opacity 400ms ease;
-moz-transition: opacity 400ms ease;
-ms-transition: opacity 400ms ease;
-o-transition: opacity 400ms ease;
transition: opacity 400ms ease;
}
.owl-carousel .owl-video-frame {
position: relative;
z-index: 1;
}
.select2-container {
box-sizing: border-box;
display: inline-block;
margin: 0;
position: relative;
vertical-align: middle;
z-index: 10000000000000;
}
.select2-container .select2-selection--single {
box-sizing: border-box;
cursor: pointer;
display: block;
user-select: none;
-webkit-user-select: none;
}
.select2-container .select2-selection--single .select2-selection__rendered {
display: block;
padding-left: 8px;
padding-right: 20px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.select2-container[dir="rtl"] .select2-selection--single .select2-selection__rendered {
padding-right: 8px;
padding-left: 20px;
}
.select2-container .select2-selection--multiple {
box-sizing: border-box;
cursor: pointer;
display: block;
min-height: 32px;
user-select: none;
-webkit-user-select: none;
}
.select2-container .select2-selection--multiple .select2-selection__rendered {
display: inline-block;
overflow: hidden;
padding-left: 8px;
text-overflow: ellipsis;
white-space: nowrap;
}
.select2-container .select2-search--inline {
float: left;
}
.select2-container .select2-search--inline .select2-search__field {
box-sizing: border-box;
border: none;
font-size: 100%;
margin-top: 5px;
}
.select2-container .select2-search--inline .select2-search__field::-webkit-search-cancel-button {
-webkit-appearance:none;
}
.select2-dropdown {
background-color: white;
border: 1px solid #aaa;
border-radius: 4px;
box-sizing: border-box;
display: block;
position: absolute;
left: -100000px;
width: 100%;
z-index: 1051;
}
.select2-results {
display: block;
}
.select2-results__options {
list-style: none;
margin: 0;
padding: 0;
}
.select2-results__option {
padding: 6px;
user-select: none;
-webkit-user-select: none;
}
.select2-results__option[aria-selected] {
cursor: pointer;
}
.select2-container--open .select2-dropdown {
left: 0;
}
.select2-container--open .select2-dropdown--above {
border-bottom: none;
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
}
.select2-container--open .select2-dropdown--below {
border-top: none;
border-top-left-radius: 0;
border-top-right-radius: 0;
}
.select2-search--dropdown {
display: block;
padding: 4px;
}
.select2-search--dropdown .select2-search__field {
padding: 4px;
width: 100%;
box-sizing: border-box;
}
.select2-search--dropdown .select2-search__field::-webkit-search-cancel-button {
-webkit-appearance:none;
}
.select2-search--dropdown.select2-search--hide {
display: none;
}
.select2-close-mask {
border: 0;
margin: 0;
padding: 0;
display: block;
position: fixed;
left: 0;
top: 0;
min-height: 100%;
min-width: 100%;
height: auto;
width: auto;
opacity: 0;
z-index: 99;
background-color: #fff;
filter: alpha(opacity=0);
}
.select2-container--default .select2-selection--single {
background-color: #fff;
border: 1px solid #aaa;
border-radius: 4px;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
color: #444;
}
.select2-container--default .select2-selection--single .select2-selection__clear {
cursor: pointer;
float: right;
font-weight: bold;
}
.select2-container--default .select2-selection--single .select2-selection__placeholder {
color: #999;
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
position: absolute;
top: 1px;
right: 1px;
width: 40px;
}
.select2-container--default .select2-selection--single .select2-selection__arrow b {
border-color: #888 transparent transparent transparent;
border-style: solid;
border-width: 5px 4px 0 4px;
height: 0;
left: 50%;
margin-left: -4px;
margin-top: -2px;
position: absolute;
top: 50%;
width: 0;
}
.select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__clear {
float: left;
}
.select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__arrow {
left: 1px;
right: auto;
}
.select2-container--default.select2-container--disabled .select2-selection--single {
background-color: #eee;
cursor: default;
}
.select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__clear {
display: none;
}
.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
border-color: transparent transparent #888 transparent;
border-width: 0 4px 5px 4px;
}
.select2-container--default .select2-selection--multiple {
background-color: white;
border: 1px solid #aaa;
border-radius: 4px;
cursor: text;
}
.select2-container--default .select2-selection--multiple .select2-selection__rendered {
box-sizing: border-box;
list-style: none;
margin: 0;
padding: 0 5px;
width: 100%;
}
.select2-container--default .select2-selection--multiple .select2-selection__placeholder {
color: #999;
margin-top: 5px;
float: left;
}
.select2-container--default .select2-selection--multiple .select2-selection__clear {
cursor: pointer;
float: right;
font-weight: bold;
margin-top: 5px;
margin-right: 10px;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice {
background-color: #e4e4e4;
border: 1px solid #aaa;
border-radius: 4px;
cursor: default;
float: left;
margin-right: 5px;
margin-top: 5px;
padding: 0 5px;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
color: #999;
cursor: pointer;
display: inline-block;
font-weight: bold;
margin-right: 2px;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover {
color: #333;
}
.select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice, .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__placeholder {
float: right;
}
.select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice {
margin-left: 5px;
margin-right: auto;
}
.select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove {
margin-left: 2px;
margin-right: auto;
}
.select2-container--default.select2-container--focus .select2-selection--multiple {
border: solid black 1px;
outline: 0;
}
.select2-container--default.select2-container--disabled .select2-selection--multiple {
background-color: #eee;
cursor: default;
}
.select2-container--default.select2-container--disabled .select2-selection__choice__remove {
display: none;
}
.select2-container--default.select2-container--open.select2-container--above .select2-selection--single, .select2-container--default.select2-container--open.select2-container--above .select2-selection--multiple {
border-top-left-radius: 0;
border-top-right-radius: 0;
}
.select2-container--default.select2-container--open.select2-container--below .select2-selection--single, .select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple {
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
}
.select2-container--default .select2-search--dropdown .select2-search__field {
border: 1px solid #aaa;
}
.select2-container--default .select2-search--inline .select2-search__field {
background: transparent;
border: none;
outline: 0;
}
.select2-container--default .select2-results>.select2-results__options {
max-height: 200px;
overflow-y: auto;
}
.select2-container--default .select2-results__option[role=group] {
padding: 0;
}
.select2-container--default .select2-results__option[aria-disabled=true] {
color: #999;
}
.select2-container--default .select2-results__option[aria-selected=true] {
background-color: #ddd;
}
.select2-container--default .select2-results__option .select2-results__option {
padding-left: 1em;
}
.select2-container--default .select2-results__option .select2-results__option .select2-results__group {
padding-left: 0;
}
.select2-container--default .select2-results__option .select2-results__option .select2-results__option {
margin-left: -1em;
padding-left: 2em;
}
.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
margin-left: -2em;
padding-left: 3em;
}
.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
margin-left: -3em;
padding-left: 4em;
}
.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
margin-left: -4em;
padding-left: 5em;
}
.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
margin-left: -5em;
padding-left: 6em;
}
.select2-container--default .select2-results__option--highlighted[aria-selected] {
background-color: #5897fb;
color: white;
}
.select2-container--default .select2-results__group {
cursor: default;
display: block;
padding: 6px;
}
.select2-container--classic .select2-selection--single {
background-color: #f6f6f6;
border: 1px solid #aaa;
border-radius: 4px;
outline: 0;
background-image: -webkit-linear-gradient(top, #ffffff 50%, #eeeeee 100%);
background-image: -o-linear-gradient(top, #ffffff 50%, #eeeeee 100%);
background-image: linear-gradient(to bottom, #ffffff 50%, #eeeeee 100%);
background-repeat: repeat-x;
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#eeeeee', GradientType=0);
}
.select2-container--classic .select2-selection--single:focus {
border: 1px solid #5897fb;
}
.select2-container--classic .select2-selection--single .select2-selection__rendered {
color: #444;
line-height: 28px;
}
.select2-container--classic .select2-selection--single .select2-selection__clear {
cursor: pointer;
float: right;
font-weight: bold;
margin-right: 10px;
}
.select2-container--classic .select2-selection--single .select2-selection__placeholder {
color: #999;
}
.select2-container--classic .select2-selection--single .select2-selection__arrow {
background-color: #ddd;
border: none;
border-left: 1px solid #aaa;
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
height: 26px;
position: absolute;
top: 1px;
right: 1px;
width: 20px;
background-image: -webkit-linear-gradient(top, #eeeeee 50%, #cccccc 100%);
background-image: -o-linear-gradient(top, #eeeeee 50%, #cccccc 100%);
background-image: linear-gradient(to bottom, #eeeeee 50%, #cccccc 100%);
background-repeat: repeat-x;
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#eeeeee', endColorstr='#cccccc', GradientType=0);
}
.select2-container--classic .select2-selection--single .select2-selection__arrow b {
border-color: #888 transparent transparent transparent;
border-style: solid;
border-width: 5px 4px 0 4px;
height: 0;
left: 50%;
margin-left: -4px;
margin-top: -2px;
position: absolute;
top: 50%;
width: 0;
}
.select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__clear {
float: left;
}
.select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__arrow {
border: none;
border-right: 1px solid #aaa;
border-radius: 0;
border-top-left-radius: 4px;
border-bottom-left-radius: 4px;
left: 1px;
right: auto;
}
.select2-container--classic.select2-container--open .select2-selection--single {
border: 1px solid #5897fb;
}
.select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow {
background: transparent;
border: none;
}
.select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow b {
border-color: transparent transparent #888 transparent;
border-width: 0 4px 5px 4px;
}
.select2-container--classic.select2-container--open.select2-container--above .select2-selection--single {
border-top: none;
border-top-left-radius: 0;
border-top-right-radius: 0;
background-image: -webkit-linear-gradient(top, #ffffff 0%, #eeeeee 50%);
background-image: -o-linear-gradient(top, #ffffff 0%, #eeeeee 50%);
background-image: linear-gradient(to bottom, #ffffff 0%, #eeeeee 50%);
background-repeat: repeat-x;
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#eeeeee', GradientType=0);
}
.select2-container--classic.select2-container--open.select2-container--below .select2-selection--single {
border-bottom: none;
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
background-image: -webkit-linear-gradient(top, #eeeeee 50%, #ffffff 100%);
background-image: -o-linear-gradient(top, #eeeeee 50%, #ffffff 100%);
background-image: linear-gradient(to bottom, #eeeeee 50%, #ffffff 100%);
background-repeat: repeat-x;
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#eeeeee', endColorstr='#ffffff', GradientType=0);
}
.select2-container--classic .select2-selection--multiple {
background-color: white;
border: 1px solid #aaa;
border-radius: 4px;
cursor: text;
outline: 0;
}
.select2-container--classic .select2-selection--multiple:focus {
border: 1px solid #5897fb;
}
.select2-container--classic .select2-selection--multiple .select2-selection__rendered {
list-style: none;
margin: 0;
padding: 0 5px;
}
.select2-container--classic .select2-selection--multiple .select2-selection__clear {
display: none;
}
.select2-container--classic .select2-selection--multiple .select2-selection__choice {
background-color: #e4e4e4;
border: 1px solid #aaa;
border-radius: 4px;
cursor: default;
float: left;
margin-right: 5px;
margin-top: 5px;
padding: 0 5px;
}
.select2-container--classic .select2-selection--multiple .select2-selection__choice__remove {
color: #888;
cursor: pointer;
display: inline-block;
font-weight: bold;
margin-right: 2px;
}
.select2-container--classic .select2-selection--multiple .select2-selection__choice__remove:hover {
color: #555;
}
.select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice {
float: right;
}
.select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice {
margin-left: 5px;
margin-right: auto;
}
.select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove {
margin-left: 2px;
margin-right: auto;
}
.select2-container--classic.select2-container--open .select2-selection--multiple {
border: 1px solid #5897fb;
}
.select2-container--classic.select2-container--open.select2-container--above .select2-selection--multiple {
border-top: none;
border-top-left-radius: 0;
border-top-right-radius: 0;
}
.select2-container--classic.select2-container--open.select2-container--below .select2-selection--multiple {
border-bottom: none;
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
}
.select2-container--classic .select2-search--dropdown .select2-search__field {
border: 1px solid #aaa;
outline: 0;
}
.select2-container--classic .select2-search--inline .select2-search__field {
outline: 0;
}
.select2-container--classic .select2-dropdown {
background-color: white;
border: 1px solid transparent;
}
.select2-container--classic .select2-dropdown--above {
border-bottom: none;
}
.select2-container--classic .select2-dropdown--below {
border-top: none;
}
.select2-container--classic .select2-results>.select2-results__options {
max-height: 200px;
overflow-y: auto;
}
.select2-container--classic .select2-results__option[role=group] {
padding: 0;
}
.select2-container--classic .select2-results__option[aria-disabled=true] {
color: grey;
}
.select2-container--classic .select2-results__option--highlighted[aria-selected] {
background-color: #3875d7;
color: white;
}
.select2-container--classic .select2-results__group {
cursor: default;
display: block;
padding: 6px;
}
.select2-container--classic.select2-container--open .select2-dropdown {
border-color: #5897fb;
}
.bottom-bar a{ color:#afafaf}
#maximg img{ max-width:100% !important; height:auto !important}
.dede_pages{padding:20px 0;font-size:14px;text-align:center; overflow:hidden}
.dede_pages ul{display:inline-block;margin:0 auto;padding:0}
.dede_pages ul li{float:left;font-family:'microsoft yahei';margin:0 2px;padding:0 10px;line-height:25px;}
.dede_pages ul li a{float:left;color:#555;display:block}
.dede_pages ul li:hover{text-decoration:none;}
.dede_pages ul li:hover a{background-color: #337ab7}
.dede_pages ul li:hover a{color:#fff}
.dede_pages ul li:hover a:hover{color:#fff;text-decoration:none}
.dede_pages ul li.thisclass{background-color:#333;color:#fff;border:1px #333 solid}
.dede_pages ul li.thisclass a{color:#fff}
.dede_pages .pageinfo{line-height:30px;padding-left:5px}
.dede_pages strong{font-weight:400}
.dede_pages .show_page_info{
padding: 0 10px;
line-height: 25px;
background: #fff;
border: 1px solid #d8dadf;
}