@charset "UTF-8";
@import url(reset.css);
@import "https://fonts.googleapis.com/css?family=Lato:300,400";
body, html {
  width: 100%;
  height: 100%;
  color: #fff;
  font-size: 19px;
  background-color: #EFEFEF; }

body, a {
  line-height: 1.3em;
  font-weight: 300; }

strong {
  font-weight: bold; }

body, a, table {
  font-family: 'Lato', sans-serif !important; }

h2 {
  font-size: 26px;
  display: block;
  margin-bottom: 5px;
  letter-spacing: 1px; }

table td,
table th {
  vertical-align: middle; }

p {
  letter-spacing: 1px; }

.bg {
  background: no-repeat; }

.bg.center {
  background-position: center; }

.bg.cover {
  background-size: cover; }

a {
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
  font-weight: 300 !important;
  font-style: normal; }

a:hover, a:visited, a:link, a:hover *, a.on:hover * {
  text-decoration: none !important;
  color: #fff !important; }

.al-center {
  text-align: center; }

.al-left {
  text-align: left; }

.al-right {
  text-align: right; }

.pos-ab {
  position: absolute; }

.pos-ab.btm {
  bottom: 0; }

.pos-ab.top {
  top: 0; }

.mobi-visible, .tablet-visible {
  display: none; }

.btn-default {
  padding: 8px 15px;
  display: inline-block;
  line-height: 0.3em;
  width: 320px;
  text-align: center; }

.btn-share-fb {
  background-color: #3C5A95 !important; }
  .btn-share-fb table th {
    padding-right: 20px;
    padding-left: 22px; }
  .btn-share-fb:hover {
    background-color: #2b4e91 !important; }

.btn-link {
  color: #fff;
  display: inline-block;
  background-color: #EF4132 !important; }
  .btn-link:hover {
    background-color: #e31c0a !important; }
  .btn-link table th {
    padding-right: 20px; }

.btn-tweet {
  background-color: #55ABED !important; }
  .btn-tweet:hover {
    background-color: #2a8cd7 !important; }

.btn-fb {
  background-color: #3a63b7 !important; }
  .btn-fb:hover {
    background-color: #006dfa !important; }

.btn-ig {
  background-color: #d10087 !important; }
  .btn-ig:hover {
    background-color: #8e10bb !important; }

.btn-youtube {
  background-color: #DB2832 !important; }
  .btn-youtube:hover {
    background-color: #cc0914 !important; }

.btn-donate {
  color: #ef4131;
  background-color: #fff !important; }
  .btn-donate:hover {
    background-color: #ef4131 !important;
    color: #fff !important; }

.btn-about-asf {
  padding: 18px 0;
  background-color: #ef4131; }
  .btn-about-asf:hover {
    color: #ef4131 !important;
    background-color: #fff !important; }

.header {
  padding: 10px 0;
  width: 100%;
  text-align: center; }

.bg-red {
  background-color: #EF4132; }

.full-wid {
  width: 100%;
  float: left; }

.rps-container {
  max-width: 960px;
  margin: 0 auto; }

.top-msg {
  padding: 5px 0; }

.top-action {
  padding: 15px 0; }
  .top-action .rps-container > div {
    padding-left: 0;
    padding-right: 0; }
  .top-action .col-rt {
    text-align: right; }

.footer {
  text-align: center;
  color: #EF4132;
  font-size: 14px;
  padding: 10px 0; }
  .footer span {
    display: inline-block;
    margin-left: 10px; }

.top-box {
  width: 100%;
  background: url(../images/top-box-bg.jpg) no-repeat left top;
  background-size: cover;
  position: relative;
  text-align: center;
  padding: 36px 0;
  overflow: hidden; }
  .top-box .box-video {
    max-width: 960px;
    width: 100%;
    margin: 0 auto;
    -webkit-box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.6);
    box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.6); }

.main {
  background-size: cover;
  line-height: 1.5em; }
  .main .row {
    margin-right: 0;
    margin-left: 0; }
  .main div, .main dl {
    padding-left: 0;
    padding-right: 0;
    overflow: hidden; }
  .main dl {
    margin-top: 20px; }

.module-tog dt {
  display: none; }
.module-tog dd {
  display: block; }

.btm-bar {
  text-align: center;
  margin-top: 25px;
  margin-bottom: 25px; }

.module-like-fbpg {
  height: 302px;
  background: url(../images/like-fbpg-bg.jpg) no-repeat left center;
  margin-top: 0 !important; }
  .module-like-fbpg dd {
    width: 420px;
    height: 302px;
    background-color: #fff;
    float: right;
    padding: 102px 30px; }
    .module-like-fbpg dd h2 {
      color: #3C5A95; }
    .module-like-fbpg dd p {
      width: 70%;
      color: #646464; }
  .module-like-fbpg .list-box {
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.9);
    padding: 20px;
    width: 410px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    position: absolute;
    left: 65px;
    top: 60px; }
  .module-like-fbpg iframe {
    width: 100%;
    background-color: transparent;
    margin: -2px;
    border: 1px solid #e9ebee !important; }
  .module-like-fbpg .first {
    margin-bottom: 5px; }

.module-subscribe {
  height: 500px;
  background: url(../images/subscribe-bg.jpg) no-repeat center;
  background-size: cover; }
  .module-subscribe dd {
    width: 380px;
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.8);
    padding: 30px;
    margin: 0 auto;
    margin-top: 145px; }
    .module-subscribe dd p {
      width: 80%; }
  .module-subscribe h2 {
    color: #F48B64; }
  .module-subscribe p {
    color: #646464; }
  .module-subscribe a {
    margin-top: 16px; }

.module-start-donation {
  height: 282px;
  background: url(../images/start-donation-bg.jpg) no-repeat center;
  background-size: cover;
  position: relative;
  margin-top: 20px;
  float: none; }
  .module-start-donation dl {
    background: #EF4132;
    background: rgba(239, 65, 59, 0.9);
    margin: 50px 0;
    display: inline-block;
    width: 100%; }
  .module-start-donation dd {
    height: 182px;
    padding: 35px 30px; }
    .module-start-donation dd p {
      width: 50%; }
    .module-start-donation dd .icon {
      float: left;
      margin-right: 50px;
      margin-left: 10px;
      margin-top: 15px; }
  .module-start-donation h2 {
    color: #fff;
    margin-top: 15px; }
  .module-start-donation p {
    color: #fff; }
  .module-start-donation a {
    background-color: #fff;
    position: absolute;
    right: 40px;
    top: 40px;
    padding: 30px 70px;
    font-weight: 400 !important;
    color: #F04132 !important;
    line-height: 1.4em; }

.module-support {
  height: 500px;
  background: url(../images/support-bg.jpg) no-repeat center top; }
  .module-support dd {
    width: 100%;
    height: 240px;
    background-color: #fff;
    position: absolute;
    left: 0;
    bottom: 0;
    padding: 40px 30px; }
    .module-support dd p {
      width: 74%; }
  .module-support h2 {
    color: #F9B346; }
  .module-support p {
    color: #646464; }
  .module-support a {
    margin-top: 26px; }

.module-engage {
  height: 302px;
  background: url("../images/makeachoice-bg.jpg") no-repeat center right; }
  .module-engage dd {
    width: 420px;
    height: 302px;
    background-color: #fff;
    padding: 60px 30px; }
    .module-engage dd p {
      width: 70%; }
  .module-engage h2 {
    color: #ff4046; }
  .module-engage p {
    color: #646464; }
  .module-engage a {
    margin-top: 26px; }

.module-engage2 {
  height: 500px;
  background: url("../images/animation-bg.jpg") no-repeat center top; }
  .module-engage2 dd {
    width: 100%;
    height: 240px;
    background-color: #fff;
    position: absolute;
    left: 0;
    bottom: 0;
    padding: 40px 30px; }
    .module-engage2 dd p {
      width: 74%; }
  .module-engage2 h2 {
    color: #ff4046; }
  .module-engage2 p {
    color: #646464; }
  .module-engage2 a {
    margin-top: 26px; }

.module-engage3 {
  height: 500px;
  background: url(../images/click2enlarge-bg.jpg) no-repeat center;
  background-size: cover; }
  .module-engage3 dd {
    width: 380px;
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.8);
    padding: 30px;
    margin: 0 auto;
    margin-top: 145px; }
    .module-engage3 dd p {
      width: 80%; }
  .module-engage3 h2 {
    color: #ff4046; }
  .module-engage3 p {
    color: #646464; }
  .module-engage3 a {
    margin-top: 16px; }

.module-learn {
  height: 302px;
  background: url(../images/learn-bg.jpg) no-repeat center right; }
  .module-learn dd {
    width: 420px;
    height: 302px;
    background-color: #fff;
    padding: 60px 30px; }
    .module-learn dd p {
      width: 70%; }
  .module-learn h2 {
    color: #959595; }
  .module-learn p {
    color: #646464; }
  .module-learn a {
    margin-top: 26px; }

.module-follow {
  height: 343px;
  background: url(../images/follow-bg.jpg) no-repeat center left; }
  .module-follow dd {
    width: 420px;
    height: 343px;
    background-color: #fff;
    padding: 60px 30px;
    float: right; }
    .module-follow dd p {
      width: 75%; }
  .module-follow h2 {
    color: #6EBDBD; }
  .module-follow p {
    color: #646464; }
  .module-follow a {
    margin-top: 16px;
    text-align: left; }
  .module-follow a table th {
      width: 50px; }

.lg-pull-right {
  float: right; }

.desktop-ver, .desktop-visible {
  display: block; }

.desktop-br {
  display: block; }

.mobi-ver {
  display: none; }

/*==================================
=            popup form            =
==================================*/
.comp-dropdown {
  text-align: left;
  position: relative;
  z-index: 100; }
  .comp-dropdown .field-selected {
    position: relative;
    padding: 3px 5%;
    width: 100%;
    color: #666;
    float: left;
    border: 2px solid #F48B64;
    background-color: #fff; }
    .comp-dropdown .field-selected.activated {
      color: #000; }
    .comp-dropdown .field-selected:before {
      display: inline-block;
      content: "▲";
      position: absolute;
      right: 5px;
      top: 4px;
      color: #F48B64;
      font-size: 12px;
      -webkit-transform: rotate(180deg);
      -moz-transform: rotate(180deg);
      -ms-transform: rotate(180deg);
      -o-transform: rotate(180deg);
      transform: rotate(180deg);
      -webkit-transition: all 0.5s ease;
      -moz-transition: all 0.5s ease;
      transition: all 0.5s ease; }
  .comp-dropdown ul {
    position: absolute;
    left: 0;
    top: 34px;
    display: none;
    width: 100%;
    background-color: #fff;
    border: 2px solid #F48B64;
    border-top: 0;
    padding: 3px 0;
    /* padding: 10px 0; */ }
    .comp-dropdown ul li {
      width: 90%;
      margin: 0 5%;
      padding: 3px;
      display: block;
      color: #969696; }
      .comp-dropdown ul li.current {
        color: #000 !important; }
  .comp-dropdown.on .field-selected:before {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg); }

[type="checkbox"] {
  width: 20px;
  height: 20px;
  margin-top: 0px !important;
  -webkit-appearance: none;
  background-color: #fff;
  border: 1px solid #ccc;
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  border-radius: 0px;
  position: relative; }

.checkbox span {
  display: inline-block;
  margin-left: 10px; }

[type="checkbox"]:before {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  content: ""; }

[type="checkbox"]:after {
  position: relative;
  display: block; }

[type="checkbox"]:checked:after {
  display: block;
  content: "✓";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 2px;
  top: -3px;
  color: #F48B64;
  font-size: 18px; }

[type="checkbox"]:disabled:after {
  -webkit-filter: opacity(0.4); }

.form-check table th {
  padding-top: 3px;
  padding-right: 5px; }
.form-check td {
  line-height: 1.3em; }

.remarks {
  line-height: 1.3em; }
  .remarks p {
    margin-top: 10px;
    margin-bottom: 5px; }

.popup-on, .popup-on body {
  overflow: hidden; }

.popup-layer {
  position: fixed;
  width: 100vw;
  height: 100vh;
  left: 0;
  top: 0;
  color: #646464;
  font-size: 16px;
  overflow: hidden;
  overflow-y: auto;
  display: none; }
  .popup-layer:before {
    content: '';
    display: block;
    width: 100vw;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.6);
    position: fixed;
    left: 0;
    top: 0; }
  .popup-layer a {
    color: #F48B64 !important; }
  .popup-layer a:hover {
    color: #e16030 !important;
    text-decoration: underline !important; }
  .popup-layer .comp-form {
    width: 98%;
    max-width: 540px;
    min-height: 300px;
    background-color: #fff;
    margin: 0 auto;
    padding: 20px;
    padding-bottom: 0;
    position: relative;
    z-index: 100; }
  .popup-layer h3 {
    color: #F48B64;
    font-size: 26px;
    display: block;
    margin-bottom: 10px; }
  .popup-layer .fz-sm {
    font-size: 14px; }
  .popup-layer input {
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius: 0px;
    border: 2px solid #F48B64; }
  .popup-layer .form-el {
    margin-top: 15px;
    margin-bottom: 5px; }
  .popup-layer .tnc {
    margin-top: 10px; }
  .popup-layer .btn-submit {
    color: #fff !important;
    display: block;
    margin: 20px -20px 0 !important;
    padding: 20px !important;
    width: 98vw !important;
    max-width: 540px !important; }
    .popup-layer .btn-submit:hover {
      text-decoration: none !important;
      color: #F48B64 !important;
      background-color: #efefef !important; }
  .popup-layer .btn-close {
    display: inline-block;
    width: 20px;
    height: 20px;
    background: url(../images/popup-close.png) no-repeat center;
    background-size: cover;
    position: absolute;
    right: 15px;
    top: 15px;
    cursor: pointer; }

/*=====  End of popup form  ======*/
@media (min-width: 1024px) {
  ::-webkit-input-placeholder {
    color: #fff !important; }

  :-moz-placeholder {
    /* Firefox 18- */
    color: #fff !important; }

  ::-moz-placeholder {
    /* Firefox 19+ */
    color: #fff !important; }

  :-ms-input-placeholder {
    color: #fff !important; } }
@media (max-width: 1366px) {
  .mobi-visible, .tablet-visible {
    display: block !important; } }
@media (max-width: 1024px) {
  .top-box {
    background-position: right top;
    height: 560px;
    background-size: auto 100%; }
    .top-box .box-video {
      right: inherit;
      top: inherit;
      position: relative;
      text-align: center;
      width: 80%;
      max-width: inherit;
      margin: 5% auto 0; } }
@media (max-width: 980px) {
  .wrapper {
    overflow: hidden;
    width: 100%; }

  .rps-container {
    padding-left: 15px;
    padding-right: 15px; }

  .btn-default {
    width: 100%;
    /* img {
        width: 80%;
        height: auto;
    } */ }

  .btn-about-asf {
    padding-top: 24px;
    padding-bottom: 24px;
    font-size: 20px; }

  .btm-bar {
    width: 96%;
    max-width: 540px;
    height: auto;
    margin-left: auto;
    margin-right: auto;
    margin-top: 20px; }

  a table {
    margin: 10px auto; }

  dl {
    position: relative; }
    dl dt {
      display: block !important;
      padding: 26px 27px 22px;
      line-height: 0.3em;
      background: no-repeat 22px bottom;
      background-size: auto 82%;
      padding-left: 100px;
      font-weight: bold;
      font-size: 22px; }
      dl dt p {
        color: #fff !important; }
      dl dt:before {
        display: inline-block;
        content: '';
        width: 30px;
        height: 17px;
        background: url(../images/mobi-arrow.png) no-repeat center;
        background-size: cover;
        position: absolute;
        right: 20px;
        top: 18px;
        -webkit-transform: rotate(-90deg) scale(0.5);
        -moz-transform: rotate(-90deg) scale(0.5);
        -o-transform: rotate(-90deg) scale(0.5);
        -ms-transform: rotate(-90deg) scale(0.5);
        transform: rotate(-90deg) scale(0.5);
        -webkit-transition: all 0.5s ease;
        -moz-transition: all 0.5s ease;
        -o-transition: all 0.5s ease;
        transition: all 0.5s ease; }
      dl dt.on:before {
        -webkit-transform: rotate(0deg) scale(0.5);
        -moz-transform: rotate(0deg) scale(0.5);
        -o-transform: rotate(0deg) scale(0.5);
        -ms-transform: rotate(0deg) scale(0.5);
        transform: rotate(0deg) scale(0.5); }
    dl dd {
      padding-top: 20px !important; }
      dl dd h2 {
        display: none; }
      dl dd p {
        padding-left: 15px;
        padding-right: 15px; }
    dl p {
      width: 100% !important; }

  .header .logo {
    width: 96% !important;
    height: auto !important; }

  .top-box {
    background-position: right top;
    background-size: auto 100%;
    padding: 0;
    height: auto; }
    .top-box .box-video {
      margin: 20px auto; }

  .lg-pull-right {
    float: none; }

  .top-action .btn-share-fb {
    margin-top: 10px; }
    .top-action .btn-share-fb table {
      margin-top: 4px;
      margin-bottom: 4px; }

  .module-like-fbpg,
  .module-subscribe,
  .module-support,
  .module-engage,
  .module-engage2,
  .module-engage3,	
  .module-learn,
  .module-follow,
  .module-start-donation {
    width: 96%;
    max-width: 540px;
    height: auto;
    margin-left: auto;
    margin-right: auto;
    float: none;
    background-position: center 53px; }
    .module-like-fbpg dd,
    .module-subscribe dd,
    .module-support dd,
    .module-engage dd,
	.module-engage2 dd,
	.module-engage3 dd,
    .module-learn dd,
    .module-follow dd,
    .module-start-donation dd {
      width: 100%;
      text-align: center;
      margin: 20px auto;
      padding-bottom: 0;
      padding-top: 0 !important;
      position: relative;
      left: inherit;
      top: inherit; }

  .module-subscribe dd,
  .module-support dd,
  .module-engage dd,	
  .module-engage2 dd,	
  .module-engage3 dd,	
  .module-learn dd,
  .module-follow dd,
  .module-start-donation dd {
    width: 86%;
    height: auto;
    float: none;
    margin-top: 90px;
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 20px;
    padding-top: 20px !important;
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.8); }
    .module-subscribe dd a,
    .module-support dd a,
	.module-engage dd a,
	.module-engage2 dd a,
	.module-engage3 dd a,
    .module-learn dd a,
    .module-follow dd a,
    .module-start-donation dd a {
      margin-top: 10px; }

  .module-like-fbpg {
    margin-top: 20px !important;
    background-image: url(../images/like-fbpg-bg-mobi.jpg);
    background-position: center -30px; }
    .module-like-fbpg dt {
      background-color: #5082B4;
      background-image: url(../images/tog-icon-like-fbpg.png); }
    .module-like-fbpg dd {
      background-color: transparent; }
      .module-like-fbpg dd p {
        color: #fff; }
    .module-like-fbpg .list-box {
      margin-top: 16px;
      padding: 20px 10px;
      position: relative;
      left: inherit;
      top: inherit;
      width: 100%; }

  .module-subscribe {
    background-image: url(../images/subscribe-bg-mobi.jpg);
    background-size: auto; }
    .module-subscribe dt {
      background-color: #F58C64;
      background-image: url(../images/tog-icon-subscribe.png); }

  .module-support dt {
    background-color: #F9B346;
    background-image: url(../images/tog-icon-support.png); }

  .module-engage {
    margin-top: 20px !important; }
    .module-engage dt {
      background-color: #ff4046;
      background-image: url(../images/tog-icon-engage.png); }
  
  .module-engage2 {
    margin-top: 20px !important; }
    .module-engage2 dt {
      background-color: #ff4046;
      background-image: url(../images/tog-icon-engage.png); }

  .module-engage3 {
    margin-top: 20px !important; }
    .module-engage3 dt {
      background-color: #ff4046;
      background-image: url(../images/tog-icon-engage.png); }	
	
  .module-learn {
	background-image: url(../images/learn-bg-mobi.jpg);
    background-size: auto; }  
    /*margin-top: 20px !important; }*/
    .module-learn dt {
      background-color: #959595;
      background-image: url(../images/tog-icon-learn.png); }

  .module-follow dt {
    background-color: #6EBEBE;
    background-image: url(../images/tog-icon-follow.png); }
  .module-follow dd {
    margin-top: 20px; }

  .module-start-donation {
    background-size: auto; }
    .module-start-donation dl {
      background-color: transparent;
      margin-bottom: 0;
      margin-top: 0; }
    .module-start-donation dt {
      background-color: #F04132;
      background-image: url(../images/tog-icon-donate.png); }
    .module-start-donation dd {
      background: #EF4132;
      background: rgba(239, 65, 59, 0.9);
      margin-top: 20px !important; }
      .module-start-donation dd a {
        position: relative;
        right: inherit;
        top: inherit;
        padding: 10px; }
    .module-start-donation .icon {
      display: none; }

  .module-tog dd {
    display: none; }

  .footer {
    line-height: 1.3em;
    margin-top: 10px; }
    .footer span {
      display: block; }

  .comp-dropdown .field-selected {
    padding-right: 10px;
    padding-left: 10px; }
  .comp-dropdown ul li {
    margin: 0 7px; } }
@media (max-width: 780px) {
  .desktop-visible {
    display: none; } }
@media (max-width: 640px) {
  .desktop-ver {
    display: none; }

  .desktop-br {
    display: inline; }

  .mobi-ver {
    display: block; }

  .header .logo {
    width: auto;
    height: 50px; }

  .top-msg .caption {
    display: block; }

  .top-box {
    background-position: right top;
    height: auto; }
    .top-box .box-video {
      position: relative;
      margin: 30px auto; }

  .main .row {
    margin-left: 0;
    margin-right: 0; }

  .popup-layer h3 {
    margin-top: 10px; }
  .popup-layer .btn-submit {
    font-size: 21px;
    padding-top: 25px !important;
    padding-bottom: 25px !important; }
  .popup-layer .remarks {
    height: 220px;
    overflow: hidden;
    overflow-y: auto; }
  .popup-layer .btn-close {
    top: 31px; } }
@media (max-device-width: 980px) {
  .mobi-visible, .tablet-visible {
    display: block !important; } }
@media only screen and (max-device-width: 768px) and (orientation: portrait) {
  .module-like-fbpg iframe {
    /* -webkit-transform: scale(0.5);
    -moz-transform: scale(0.5);
    -o-transform: scale(0.5);
    -ms-transform: scale(0.5);
    transform: scale(0.5); */
    width: 100%; } }
/* iPads (landscape) ----------- */
/* @media only screen and (max-device-width: 768px) and (orientation: landscape) {
    .wrapper {
        display: none;
    }

    body {
        text-align: center;
        padding-top: 25%;

        &:before {
            display: inline-block;
            content: "Please use portrait~";
        }
    }
} */

/*# sourceMappingURL=interface.css.map */