* { touch-action: pan-y; }
html,body {
    -webkit-touch-callout: none;                /* prevent callout to copy image, etc when tap to hold */
    -webkit-text-size-adjust: none;             /* prevent webkit from resizing text to fit */
    /*-webkit-user-select: none; */                 /* prevent copy paste, to allow, change 'none' to 'text' */
}
#header{border-bottom: 1px solid #ededed}
.site-brand a.mr{display: inline-block;margin-right: 10px;}
nav.main-menu2 ul li:first-child{margin-left: 10px;}
p{line-height: 1.8rem}
.back-top {
    position: fixed;
    bottom: 25px;
    right: 20px;
    z-index: 99;
    width: 45px;
    height: 45px;
    text-align: center;
    background: #242C33;
    color: #fff;
    font-size: 17px;
    line-height: 45px;
    border-radius: 50%;
    cursor: pointer;
    display: none;
    transition: all .4s ease;
}
.back-top:hover{
    -webkit-transform: translate3d(0,-5px,0);
    -moz-transform: translate3d(0,-5px,0);
    transform: translate3d(0,-5px,0);
    -webkit-box-shadow: 0px 23px 42px rgba(0, 0, 0, 0.2);
    box-shadow: 0px 23px 42px rgba(0, 0, 0, 0.2);
    color: #fff;
}
.mainslider .item{
    padding-bottom: 55%;
    background-position: center;
    background-size: cover;
    position: relative;
}
.mainslider .item .data{
    position: absolute;
    top: 30%;
}
.owl-carousel.owl-theme .owl-prev ,.owl-carousel.owl-theme .owl-next{
    width: auto;
    height: 40px;
    margin-top: -20px;
    position: absolute;
    top: 50%;
    color: #fff;
    text-shadow: 0 0 10px #999;
    background: transparent!important
}
.owl-carousel.owl-theme .owl-prev{left:15px;}
.owl-carousel.owl-theme .owl-next{right:15px;}
.home .owl-item {
  display: table;
}
.owl-carousel.owl-theme .item {
  height: 60vh;
  background-position: center;
  background-size: cover;
  display: table-cell;
  vertical-align: middle;
  text-align: center;
  cursor: pointer;
}
#owl-campaign.owl-theme .item{display: block;height: 45vh}
.owl-carousel.owl-theme .item h2{
    width: 80%;
    margin: 0 auto;
    margin-bottom: 20px;
}
.owl-carousel.owl-theme .item p {
  width: 50%;
  text-align: center;
  margin: 0 auto 20px;
}
.owl-carousel.owl-theme .item p,.owl-carousel.owl-theme .item h2{color: #fff;}
.footer-menu .copyright:hover{opacity: .5!important}
.home .text-shadow{text-shadow: 0px 0px 10px #683814;}
.signin-left,.signin-right{padding: 8rem 4rem;min-height: calc(100vh - 200px)}
.signin-left{background-image: linear-gradient(-60deg, #a1c4fd 0%, #c2e9fb 100%);
    position: relative;
    box-shadow: 5px 0px 13px 0px rgba(96, 150, 185, 0.25);
    z-index: 2;}
.signin-right{background-color: #fdfdfd}
.signin-left:before{
    content: "";
    position: absolute;
    top: 35%;
    right:-40px;
    width: 80px;
    height: 80px;
    background-image: linear-gradient(-60deg, #a5c8fd 0%, #a7cbfd 100%);
    box-shadow: 5px 0px 13px 0px rgba(96, 150, 185, 0.25);
    border-radius: 50px;
    z-index: 99;

}
.signin-left:after{
    content: "\f121";
    position: absolute;
    top: 35%;
    right: -20px;
    font-family: "LineAwesome";
    font-weight: 600;
    color: #fff;
    z-index: 100;
    font-size: 28px;
    line-height: 80px;
}
.signin-left .big-s-font{font-size: 5vw}
.btn-primary.btn-outline{border:1px solid #00a6eb; color: #00a6eb;background-color: transparent;}
.btn-outline{box-shadow: 0 0 0 1px #e1e1e1 inset;}
.btn-sm {
    line-height: 1.5;
    border-radius: 2px;
}
#editcode{display: none}
.btn-primary.btn-outline:hover{color: #fff;background-color:#00a6eb}
label~input{margin-top: 10px;}
.footer-menu img.logo{width: 150px; opacity: .8}
.footer-menu a:hover img.logo{opacity: 1}
.big-s-font.b-line{color:#4785da;font-weight: 700;}
.big-s-font.b-line:after{content:"";padding-bottom: 20px; border-bottom: 5px solid #4785da;max-width: 150px;display: block;}
.big-s-font.b-line ~ p a,a.inline{display: inline-block;}
.b-line.white{content:"";padding-bottom: 10px; border-bottom: 2px solid #fff;display: inline-block;}
.big-s-font~ p{color: #4785da}
[type=reset], [type=submit], button, html [type=button]{-webkit-appearance: none}
.logo.blue{width: 30px; margin-right: 10px;}
.site-brand img{width: 150px}
.modal-footer *{margin: 0 auto}
.modal-footer,.modal-header{border:none;}
.modal-body{padding: 20px}
.close-btn{
    width: 30px;
    height: 30px;
    line-height: 30px;
    display: block;
}
.service-box{background: #fff;padding: 30px;border-radius: 10px;position: relative;z-index: 3;}
.service-box:before{
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: -2;
    -webkit-transform: translate3d(-5px, -5px, 0);
    -moz-transform: translate3d(-5px, -5px, 0);
    -ms-transform: translate3d(-5px, -5px, 0);
    -o-transform: translate3d(-5px, -5px, 0);
    transform: translate3d(-5px, -5px, 0);
    border:1px solid #dadce0;
}
.service-box a{display: inline-block;color: #0056b3}
.service-box:after{
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: -1;
    -webkit-transform: translate3d(5px, 5px, 0);
    -moz-transform: translate3d(5px, 5px, 0);
    -ms-transform: translate3d(5px, 5px, 0);
    -o-transform: translate3d(5px, 5px, 0);
    transform: translate3d(5px, 5px, 0);
    border: 1px solid #dadce0;
}
.service-box ul{padding-left: 40px;}
.service-box h3{margin-bottom: 20px;margin-top: 35px;}
.about .video-wrapper .bg-blue{padding-top: 80px;}
.about .top-site {background-image: url(../images/about-bg.jpg);}
.about .statics-item .tbl .td{min-height: 210px;}
.about .data .tbl{background-color: #f5f6f6;}
.about .statics-content{line-height: 1.8}
.partners-about li img{max-height: 62px}
#contactForm{
    padding: 30px;
    border-radius: 10px;
    -webkit-box-shadow: 0px 23px 42px rgba(0, 0, 0, 0.2);
    box-shadow: 0px 23px 42px rgba(0, 0, 0, 0.2);
}
#contactForm input,#contactForm textarea{
    background-color: #f3f8ff !important;
}
.js .author-avatar{
    width: 250px;
    height: 250px;
    margin: 0 auto;
    border-radius: 100%;
    background-position: center;
    background-size: cover;
}
.avatar-sq.samll{
    margin: 20px;
    width: 40px;
    height: 40px;
    border-radius: 100%;
    background-position: center;
    background-size: cover;
}
.main-menu ul li.active a,.main-menu2 ul li.active a{color: #00a6eb}
.process-time{text-align: right;}
.campaign-content .campaign-box .process .process-info span{margin-right: 5px}
.campaign-content .campaign-box .process .process-info .process-time span{margin-right: 0!important;margin-left: 5px}
.process .process-info .process-time{float: right}
.campaign-item a.overlay .itemMain{
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    padding-bottom: 60%;
}
.campaign-item a.overlay:hover .itemMain{
    opacity: 0.3;
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
}
.home .campaign-tabs{border-bottom: 1px solid #eee;line-height: 2;margin-top: 20px;}
.author-img{
    width: 100px;
    height: 100px;
    margin:15px auto;
    border-radius: 500px;
    display: block;
    /*float: right;*/
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
.time-img{
    width: 55px;
    height: 55px;
    margin-top: -10px;
    margin-left: 15px;
    border-radius: 20px;
    float: right;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
.social-btn{
    display: inline-block;
    border: 1px solid;
    padding: 1px 6px;
    border-radius: 5px;
    font-size: 12px;
    cursor: pointer;
}
.social-btn.fb{border-color: #3b5998;color: #3b5998}
.social-btn.fb:hover,.social-btn.fb:focus,.social-btn.fb:active{background-color: #3b5998;color: #fff}
.social-btn.copy:hover,.social-btn.copy:focus,.social-btn.copy:active{background-color:#222222;color: #fff!important }
.page3 .social-btn.fb,.page3 .social-btn.copy{border-color: #fff;color: #fff}
.copy-alert{color: #fff;background-color: #2d2a2f;padding: 4px 5px;font-size: 12px;border-radius: 5px;opacity: .9;display: none}
#campaign h3{margin-bottom: 20px;margin-top: 35px;font-weight: 600}
#campaign .support-campaign .plan a:focus h4,.support-campaign .plan a:focus h4{color: #222222}
#faq h4{font-weight: 600;line-height: 1.6;color: #182f57}
#faq .ans{padding: 10px;background-color: #fdffff;margin-top: 15px;border-radius: 10px;}
#faq .q{background-color:#ebf1f2; padding: 10px;border-radius: 10px;margin-bottom: 20px;}
.divider {
    color: #727272;
    line-height: 20px;
    margin: 30px auto;
    overflow: hidden;
    text-align: center;
    width: 100%;
}
.divider::before, .divider::after {
    width: 50%;
    content: "";
    display: inline-block;
    height: 10px;
    margin: 0 0 0 -100%;
    vertical-align: top;
    border-bottom: 1px solid #e4e4e4;
}
.divider::after, .divider::after {
    margin: 0 -100% 0 0;
}
.notice{padding-left: 15px;position: relative;list-style-type: circle;line-height: 1.8}
.plan-s-d{    
    padding: 5px;
    display: block;
    border: 1px solid #707070;
    border-radius: 5px;
    text-align: center;
    margin-top: 8px;
}
.plan h2.plan-date{font-weight: 600;margin-bottom: 20px;}
.support-campaign .plan:hover{border:2px solid #447fb3;
    transition: all 0.3s ease-in-out 0s;
    -moz-transition: all 0.3s ease-in-out 0s;
    -o-transition: all 0.3s ease-in-out 0s;
    -webkit-transition: all 0.3s ease-in-out 0s;
    -ms-transition: all 0.3s ease-in-out 0s;}
.support-campaign .plan h4{line-height: 1.6}
.support-campaign .plan a:focus:hover,.support-campaign .plan a:focus{background-color: #fff !important;color: #555555}
.statics-content .statics-item.round{padding: 35% 20px;border-radius: 100%;border:1px solid #ddd;}
.team .tabs-controls {
  padding-top: 10px;
  text-align: center;
  position: sticky;
  position: -webkit-sticky;
  top: 0;
  z-index: 9;
}
.team .tabs-controls li {margin: 0 30px;}
.parallax {
  /* background-image: url("../images/index-bg.jpg"); */
  background-image: url("../images/index-bg2.jpeg");
  height: 500px;
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
}
.sideshow-content.page3{visibility: hidden;}
.sideshow-content.page3 .sideshow-description{margin-bottom: 15px;}
.page3 hr{border-top: 1px solid rgba(255, 255, 255, 0.6);}
.btn-play {
    width: 35px;
    height: 35px;
    background-color: #182f57;
    line-height: 35px;
    margin:0 auto;
    color: #fff !important;
    border-radius: 50px;
    text-align: center;
}
a.btn-play:hover{
    background-color: #139cd5;
    color: #fff!important;

}
#campaign tr td:last-child,#campaign tr th:last-child{text-align: center;}
#campaign .cart-totals ul li p{margin-bottom: 0!important}
.cart-totals ul li p:first-child{font-weight: 600;width: 40%;margin-right: 5px;vertical-align: top;}
.page1 .parallax{height: 80vh;}
.page1 .parallax:before{ 
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,0.25);
}
.page1 .parallax .container{position: relative;top: 35%;}
.page1 .parallax h1{line-height: 1.6;font-weight: 600}
.page1 .support-campaign .plan,.page3 .support-campaign .plan{margin: 10px;}
.page1 .campaign-box{float: none;width: 60%; margin: 0px auto;}
.reverse{-ms-flex-direction: row-reverse;-webkit-flex-direction: row-reverse;flex-direction: row-reverse;}
.page1 .how-it-work h4{line-height: 1.8}
.page1 iframe.fullvideo {width: 100%;min-height: 500px;}
.page1 .staff-picks{background-color: #faf9f6;margin-top: 50px;padding-bottom: 50px;}
.page1 .staff-picks h3{line-height: 2;margin-bottom: 15px;font-size: 18px}
.page1 .staff-picks .staff-picks-description{line-height: 1.6;font-size: 14px;}
.page1 .staff-picks .staff-picks-box{max-width: 55%;margin: 20px auto 40px;}
.page1 .owl-carousel.owl-theme .owl-prev,.page1 .owl-carousel.owl-theme .owl-next,.page3 .owl-carousel.owl-theme .owl-prev,.page3 .owl-carousel.owl-theme .owl-next{color: #182f57 !important;border-radius: 5px;top: 40%;}
.page1 .story-slider .owl-prev,.page3 .story-slider .owl-prev{left: -50px;}
.page1 .story-slider .owl-next,.page3 .story-slider .owl-next{right: -50px;}
form .field.mb-xsm{margin-bottom: 10px;}
#uploadfilename{display: none;position: relative;padding-right: 40px;margin-top: 5px;}
.clearfile{
    padding:2px 5px;
    top: 8px;
    right: 8px;
    position: absolute;
}
#updates li:last-child{border-left: none}
#campaign iframe{
    width: 100%;
    height: 350px
}













::-webkit-scrollbar {
    -webkit-appearance: none;
}

::-webkit-scrollbar:vertical {
    width: 12px;
}

::-webkit-scrollbar:horizontal {
    height: 12px;
}

::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, .5);
    border-radius: 10px;
    border: 2px solid #ffffff;
}

::-webkit-scrollbar-track {
    border-radius: 10px;  
    background-color: #ffffff; 
}

/*
| ----------------------------------------------------
| responsive
| ----------------------------------------------------
*/
@media (min-width: 1025px) {
    .video-wrapper .bg-blue .row{max-width: 80%;margin: 0 auto;}
}
@media (max-width: 1367px) {
    .owl-carousel.owl-theme .item{height: 75vh ;}
}


@media (max-width: 1025px) {
    .project-data.statics-content .statics-item.round {padding: 32% 20px 0;}    
    .project-data.statics-content .statics-item h3 {font-size: 20px;}
    .signin-left, .signin-right{min-height: calc(50vh - 200px);}
    .campaign-content .campaign-box .process .process-info .process-time span{margin-left: 20px;}    
    #campaign iframe{height: 550px}
}
@media (max-width: 812px) {
    .page1 .parallax {    background-attachment: unset;}
    .page1 .campaign-box {
	    width: 100%;
	    padding: 30px 30px 60px;
	}

}

@media (max-width: 769px) {        
    .signin-left, .signin-right{min-height: calc(100vh - 200px);}
    .site-header .site-brand{line-height: 70px;}
    .owl-carousel.owl-theme .item{height: 40vh ;}
    .parallax{height: 300px;}
    .c-hamburger{right: 100px;top: 20%;}
    .team .tabs-controls ,.main-menu ul{top:70px;}
    .main-menu .avatar-sq.samll{display: none;}
    .main-menu ul li > .sub-menu{display: block}
    .project-data.statics-content .statics-item.round {padding: 35% 20px;}
    .page1 .staff-picks .staff-picks-box{max-width: 70%;margin: 20px auto 40px;}
    #campaign iframe{height: 450px}
}


 /*iphone plus*/
@media (max-width: 415px) {
    .site-header .site-brand,.site-header .login{line-height: 60px;}
    .c-hamburger{top: 10px;right: 20px;}
    .team .tabs-controls, .main-menu ul{top: 60px;}
    .site-brand a.mr{margin-right: 10px;}
    .main-menu2 ul li{margin-left: 20px;}
    .owl-carousel.owl-theme .item {
      height: 40vh;
    }
    .owl-carousel.owl-theme .item h2{
        font-size: 16px;
        line-height: 1.4rem;
    }
    .owl-carousel.owl-theme .owl-prev ,.owl-carousel.owl-theme .owl-next{
        font-size: 12px;
    }
    .owl-carousel.owl-theme .owl-prev {left: 0}
    .owl-carousel.owl-theme .owl-next {right: -3px;}
    .page1 .story-slider.owl-carousel.owl-theme .owl-prev,.page1 .story-slider.owl-carousel.owl-theme .owl-next{top:-50px !important;background-color: #182f57 !important;
    border-radius: 2px;color: #fff !important;opacity: 1;}
    .page1 .story-slider.owl-carousel.owl-theme .owl-prev{left: calc(100vw - 130px)}
    .page1 .story-slider.owl-carousel.owl-theme .owl-next{right: 10px;}
    .page1 .story-slider.owl-carousel.owl-theme .owl-prev i,.page1 .story-slider.owl-carousel.owl-theme .owl-next i{font-size: 16px;}
    .page3 .story-slider .owl-prev,.page3 .story-slider .owl-next{display: none !important;}
    .page3 .support-campaign .plan{margin: 5px;}
    .page3 .support-campaign .plan a{padding:18px 15px;}
    .campaign-slider .owl-controls .owl-page{height: 40px}
    #owl-campaign.owl-theme .item{height: 200px}
    .parallax{height: 300px;}
    .unlogin .c-hamburger{right: 80px;}
    .signin-left,.signin-right{min-height: 200px;padding: 2rem}
    .signin-left .big-s-font{font-size: 8vw;}
    .signin-left{z-index: 99}
    .signin-left:before{
        content: "";
        position: absolute;
        top: calc(100% - 45px);
        right:calc(50% - 40px);
        width: 80px;
        height: 80px;
        background-image: linear-gradient(-60deg, #a8c9fb 0%, #b6d5ff 100%);
        box-shadow: 0px 4px 13px 0px rgba(96, 150, 185, 0.25);
        border-radius: 50px;
        z-index: 98;

    }
    .signin-left:after{
        content: "\f11f";
        top: calc(100% - 40px);
        right: calc(50% - 17px);
        font-weight: 600;
        color: #fff;
        z-index: 100;
        font-size: 28px;
        line-height: 80px;
    }
    .account-table table{min-width: 800px}
    .about .statics-content .col-lg-3{margin-bottom: 15px;} 
    .about .statics-item{margin-bottom: 0}
    .about .partners-about li{width: calc((100% - 40px) / 4);margin: 0 5px;}
    .table-responsive{margin-bottom: 30px}
    .project-data.statics-content .col-6{width: 50%}
    .project-data.statics-content .statics-item.round{padding: 27% 20px 0;}
    .project-data.statics-content .statics-item h3 {margin: 18px 0;font-size: 16px;}
    .team .tabs-controls li {margin:0 15px;}
    .project-data.statics-content .statics-item {min-height: 175px;}
    .campaign-history .tabs-controls li{display: inline-block;}
    .site-main .sideshow{height: 600px;}
    .top-site.page2{height: 250px;}
    .video .video-wrapper{margin-top: -45px;}  
    .page1 .campaign-box{width: 100%;} 
    .page1 iframe.fullvideo{min-height: 300px;}
    .video iframe{height: 200px;}
    .page1 .parallax{background-attachment: unset;height:55vh;}
    #campaign iframe{height: 200px}
    .page1 .parallax .container{top:30%;}
    .page1 .parallax h1{letter-spacing: 3px;font-size: 24px;}

}


/*iphone: 7px*/
@media (max-width: 376px) {
    .campaign-item .campaign-box{padding: 16px 15px 21px;}
    .campaign-content .campaign-box .process .process-info span{margin-right: 30px !important;}
    .campaign-content .campaign-box .process .process-info .process-time span{  margin-left: 30px;}
    .project-data.statics-content .statics-item {min-height: 155px;}
    .project-data.statics-content .statics-item h3 {margin: 18px 0;font-size: 14px;}
    .campaign-history .tabs-controls li{margin-right: 15px}
    .site-main .sideshow .sideshow-content.page3 h1{font-size: 28px;}
}



/*iphone 5*/
@media (max-width: 321px) {
    .site-brand img{width: 120px;}
    .project-data.statics-content .statics-item.round {padding: 30% 20px;}
    .project-data.statics-content .col-6{width: 100%}
    .project-data.statics-content .statics-item h3 {margin: 18px 0;font-size: 26px;}
    .project-data.statics-content .statics-item {min-height: 290px;}    
    .campaign-history .tabs-controls li{margin-right: 5px}
    .campaign-history .tabs-controls li a{font-size: 13px;} 
    .page1 .parallax .container{top: 20%;}
}