@charset "utf-8";
/* CSS Document */
.hidden { display:none!important; visibility:hidden!important }

body { font-family: 'Roboto', Arial, Helvetica, sans-serif; color: #333; font-size:18px; line-height:30px; font-weight:400; }
img { max-width: 100%; }

.social { font-size:22px; font-weight:600; color:#666; text-align:right; margin-top:45px; }
.social img { margin-left:10px; margin-top:5px; }

.catchline { text-align:left; margin-top:20px; font-size:22px; font-weight:600; line-height:35px; }
.catchline .blue { color:#0ea7eb; }
.catchline .green { color:#8cc656; }
.catchline .orange { color:#f4ab44; }
.catchline .purple { color:#9c75b6; }

.container-fluid { padding:0; }
.container { max-width:1200px; padding:0; }
.margin10 { margin-bottom:10px; }
.margin20 { margin-bottom:20px; }
.margin30 { margin-bottom:30px; }
.margin40 { margin-bottom:40px; }
.margin50 { margin-bottom:50px; }
a:hover, :hover { -webkit-transition: ease-out 0.2s; -moz-transition: ease-out 0.2s; -o-transition: ease-out 0.2s; transition: ease-out 0.2s; text-decoration:none; }

.header { padding:20px 0 20px 0; }
.logo { margin:0; text-align:left; }

.carousel-indicators { display:none; }
.carousel-inner img { width: 100%; height: 100%; }

.points ul { margin-top:25px; padding: 0 0 0 20px; }
.points ul li::before {  content: "\2022"; color: #00a3ff; font-weight: bold; display: inline-block; width: 20px; margin-left: -20px; }
.points ul li { list-style-type:none; color: #666; line-height:26px; margin-bottom:8px; font-weight:600; }
.points ul li span { color: #00a3ff; }

.red-sign { margin:0 0 0 30px; }
.red-sign ul { list-style: none; padding:0; margin-top:10px; }
.red-sign ul li:before { content: '✓'; color:#ed5167; font-weight: bold; width:30px; display: inline-block; margin-left:-30px; }
.red-sign ul li { list-style-type:none; color: #666; line-height:26px; margin-bottom:8px; font-weight:500; }
.red-sign ul li span { color: #00a3ff; }

h2.blue { font-size:40px; color:#0ea7eb; text-decoration:none; margin:20px 0 10px 0; font-weight:500; line-height:50px; text-align:center;  }
h2.green { font-size:40px; color:#8cc656; text-decoration:none; margin:20px 0 10px 0; font-weight:500; line-height:50px; text-align:center;  }
h2.orange { font-size:40px; color:#f4ab44; text-decoration:none; margin:20px 0 10px 0; font-weight:500; line-height:50px; text-align:center;  }
h2.purple { font-size:40px; color:#d762ab; text-decoration:none; margin:20px 0 10px 0; font-weight:500; line-height:50px; text-align:center;  }
h2.red { font-size:40px; color:#ed5167; text-decoration:none; margin:20px 0 10px 0; font-weight:500; line-height:50px; text-align:center;  }
h3.blue { font-size:30px; color:#0ea7eb; text-decoration:none; margin:10px 0 0px 0; font-weight:500; line-height:40px; text-align:center;  }
h3.green { font-size:30px; color:#8cc656; text-decoration:none; margin:10px 0 0px 0; font-weight:500; line-height:40px; text-align:center;  }
h3.orange { font-size:30px; color:#f4ab44; text-decoration:none; margin:10px 0 0px 0; font-weight:500; line-height:40px; text-align:center;  }
h6.blue { font-size:22px; color:#0ea7eb; text-decoration:none; margin:0px 0 0px 0; font-weight:500; text-align:center;  }
h6.green { font-size:22px; color:#8cc656; text-decoration:none; margin:0px 0 0px 0; font-weight:500; text-align:center;  }
h6.orange { font-size:22px; color:#f4ab44; text-decoration:none; margin:0px 0 0px 0; font-weight:500; text-align:center;  }
h6.red { font-size:22px; color:#ed5167; text-decoration:none; margin:20px 0 0px 0; font-weight:500; text-align:center;  }
h6.purple { font-size:22px; color:#d762ab; text-decoration:none; margin:0px 0 0px 0; font-weight:500; text-align:center;  }
h4 { font-size:34px; color:#00A3FF; text-decoration:none; font-weight:500; }
h5 { font-size:26px; color:#00A3FF; text-decoration:none; font-weight:500; margin-top:10px; }
p { font-size:18px; text-decoration:none; margin:10px 0; }

.home { text-align:center; padding:0 0 50px 0; }
.home .image-box { border:1px solid #CCC; }
.home .image-box .content { padding:20px; }
.home .image-box h3 { font-size:30px; color:#f4ab44; text-decoration:none; margin:0px 0 5px 0; font-weight:500; }
.home .image-box h6 { font-size:18px; color:#666; text-decoration:none; margin:0 0 10px 0; line-height:28px; font-weight:400; }

.education-img { background-image:url(../image/education-img.jpg); background-repeat:no-repeat; height:309px; background-position:top right; text-align:left; margin-top:40px; }
.education-img h2 { text-align:left; padding-top:10px; } 

.community-img { background-image:url(../image/community-img.jpg); background-repeat:no-repeat; background-color:#ececec; height:390px; background-position:top left; text-align:left; margin-top:40px; padding:0 50px 0 0; }
.community-img h2 { text-align:left; padding-top:20px; } 
.community-img-mobile { display:none; }

.l3-img { background-image:url(../image/livelovelife-img.jpg); background-repeat:no-repeat; background-color:#efeff1; height:449px; background-position:top right; text-align:left; margin-top:40px;  padding:0 0 0 30px; }
.l3-img h2 { text-align:left; padding-top:30px; } 

.how-we-help { text-align:center; padding:30px 0 50px 0; }
.step001 { background-color:#8cc656; color:#FFF; }
.step002 { background-color:#f4ab44; color:#FFF; }
.step003 { background-color:#d761aa; color:#FFF; }
.step001 h3, .step002 h3, .step003 h3 { font-size:40px; padding-top:10px; color:#FFF !important; }
.step001 h6, .step002 h6, .step003 h6 { font-size:25px; font-weight:400; padding:0 20px 5px; }

.steppoint001 ul { list-style: none; padding:10px 10px 0 30px; margin-top:10px; text-align:left; }
.steppoint001 ul li:before { content:"\A"; width:10px; height:10px; border-radius:50%; background: #8cc656; display:inline-block; margin-left:-20px; margin-right:10px; }
.steppoint001 ul li { list-style-type:none; color: #333; line-height:26px; margin-bottom:8px; font-weight:500; }

.steppoint002 ul { list-style: none; padding:10px 10px 0 30px; margin-top:10px; text-align:left; }
.steppoint002 ul li:before { content:"\A"; width:10px; height:10px; border-radius:50%; background: #f4ab44; display:inline-block; margin-left:-20px; margin-right:10px;}
.steppoint002 ul li { list-style-type:none; color: #333; line-height:26px; margin-bottom:8px; font-weight:500; }

.steppoint003 ul { list-style: none; padding:10px 10px 0 30px; margin-top:10px; text-align:left; }
.steppoint003 ul li:before { content:"\A"; width:10px; height:10px; border-radius:50%; background: #d761aa; display:inline-block ;margin-left:-20px; margin-right:10px;}
.steppoint003 ul li { list-style-type:none; color: #333; line-height:26px; margin-bottom:8px; font-weight:500; }

.how-we-help-bgimg001 { background-image:url(../image/how-we-help-img001.jpg); background-repeat:no-repeat; height:451px; background-position:top right; text-align:left; margin-top:40px; }
.how-we-help-bgimg001 h2 { text-align:left; padding-top:0px; }

.how-we-help-bgimg002 { background-image:url(../image/how-we-help-img002.jpg); background-repeat:no-repeat; background-color:#f3f5f4; min-height:556px; height:auto; background-position:bottom left; text-align:left; margin-top:40px; margin-bottom:40px; padding:10px 30px 30px 0; }
.how-we-help-bgimg002 h2 { text-align: center; padding-top:0px; }

.the-problem { text-align:center; padding:30px 0 50px 0; }
.the-problem h4 { font-size:28px; color:#666; font-weight:400; text-align:left; }
.the-problem .chart { text-align:left; }
.the-problem .text-small { font-size:14px; color:#000; font-weight:500; text-align:right; line-height:20px; }
.the-problem .text-small12 { font-size:12px; color:#000; font-weight:500; text-align:left; line-height:17px; }
.the-problem .grey-title { background-color:#999; color:#FFF; height:60px; text-align:center; font-size:40px; line-height:60px; margin-bottom:20px; margin-top:20px; }

.the-problem .bluepoint ul { list-style: none; padding:10px 10px 0 30px; margin-top:10px; text-align:left; }
.the-problem .bluepoint ul li:before { content:"\A"; width:10px; height:10px; border-radius:50%; background: #00a3ff; display:inline-block ;margin-left:-20px; margin-right:10px;}
.the-problem .bluepoint ul li { list-style-type:none; color: #333; line-height:32px; margin-bottom:10px; font-weight:500; }

.the-problem .grey-box { background-color:#f3f3f3; padding:20px 30px 20px 30px; text-align:left; margin-bottom:20px; }

.the-problem .grey-box ul { list-style: none; padding:10px 10px 0 30px; margin-top:10px; text-align:left; }
.the-problem .grey-box ul li:before { content:"\A"; width:10px; height:10px; border-radius:50%; background: #00a3ff; display:inline-block ;margin-left:-20px; margin-right:10px;}
.the-problem .grey-box ul li { list-style-type:none; color: #333; line-height:26px; margin-bottom:5px; font-weight:500; }

.the-problem strong { color:#000; }

.button { background-color:transparent; }
.button span { cursor: pointer; display: inline-block; position: relative; transition: 0.3s; }
.button span:after {  content:'»'; position: absolute;  opacity: 0;  top: 0;  right: -20px;  transition: 0.5s; }
.button:hover span {  padding-right: 25px; }
.button:hover span:after { opacity: 1; right:0; }

.btn-orange { background-color:#f4ab44; padding:10px 50px; color:#FFF; font-size:18px; text-decoration:none; font-weight:600; border-radius:25px; border:0; margin:15px 0 10px 0; }
.btn-orange:hover { background-color:#333; color:#FFF; }

.btn-green { background-color:#8dc756; padding:10px 50px; color:#FFF; font-size:18px; text-decoration:none; font-weight:600; border-radius:25px; border:0; margin:15px 0 10px 0; }
.btn-green:hover { background-color:#333; color:#FFF; }

.btn-blue { background-color:#0ea7eb; padding:10px 50px; color:#FFF; font-size:18px; text-decoration:none; font-weight:600; border-radius:25px; border:0; margin:15px 0 10px 0; }
.btn-blue:hover { background-color:#333; color:#FFF; }

.btn-purple { background-color:#d762ab; padding:10px 50px; color:#FFF; font-size:18px; text-decoration:none; font-weight:600; border-radius:25px; border:0; margin:15px 0 10px 0; }
.btn-purple:hover { background-color:#333; color:#FFF; }

.btn-red { background-color:#ed5167; padding:10px 50px; color:#FFF; font-size:18px; text-decoration:none; font-weight:600; border-radius:25px; border:0; margin:15px 0 10px 0; }
.btn-red:hover { background-color:#333; color:#FFF; }

.footer { background-color:#333; font-size:12px; color:#FFF; text-decoration:none; padding:50px 0; text-align:center; margin-top:50px; }
.footer ul { padding:0; margin:0; }
.footer ul li {  display:inline; list-style-type:none; margin:0 20px; }
.footer ul li a { font-size:18px; color:#FFF; text-decoration:none; line-height:28px; }
.footer ul li a:hover { color:#f4ab44; text-decoration:none; }

.copytext { line-height:20px; margin:10px 0; }
.f-address { color:#999; text-decoration:none; line-height:18px; margin-top:10px; }

.fixed-bottom-container {  position: fixed; /* left: 0; */ /* right: 0; */ bottom: 0; /* width: -webkit-fill-available; */ /* margin: 0 auto; */ width: 100%; text-align: center; }
a.fixed-bottom-button, a.fixed-bottom-button.book-a-live-tour, a.fixed-bottom-button.free-trial { width:35%; margin: auto 1%; font-size:20px; line-height:60px; padding:20px 40px; color: #fff; background: rgba(0,163,173,.83); background: linear-gradient(rgba(0,163,173,.85),rgba(0,163,173,.95)); background:#EB2125; border-radius: 10px 10px 0 0; border: solid #09abb5; border-width:0px 0px 0; vertical-align: bottom; transition: padding-bottom .3s ease-out; }

.hide { display: none; }

.btn-darkblue { background-color:#00A3FF; padding:14px 40px; color:#FFF; font-size:16px; text-decoration:none; font-weight:600; border-radius:0px; border:0; margin:0; }
.btn-darkblue:hover { background-color:#00A3FF; color:#FFF; }

.home-mobile, .howwedoit-mobile, .threesixfive-mobile, .hotels-mobile, .aviation-mobile, .marine-mobile, .retail-pharmacy-mobile, .employee-safety-mobile, .certification-mobile, .science-mobile, .about-mobile { display: none;}

.progressbar { counter-reset: step; }
ul.progressbar { margin:0; padding:0; }
.progressbar li { list-style-type: none; width: 20%; float: left; font-size: 12px; position: relative; text-align: center; text-transform: uppercase; color: #999; }
.progressbar li:before { width: 40px; height: 40px; content: ""; line-height: 40px; border: 2px solid #999; display: block; text-align: center; margin: 0 auto 3px auto;
    border-radius: 50%; position: relative; z-index: 2; background-color: #fff; }
.progressbar li:after { width: 100%; height: 2px; content: ''; position: absolute; background-color: #999; top: 21px; left: -50%; z-index: 0; }
.progressbar li:first-child:after { content: none; }
.progressbar li.active { color: #fff; font-weight: bold; }
.progressbar li.active:before { border-color: #8cc656; background: green; }
.progressbar li.active + li:after { background-color: #8cc656; }
.progressbar li.active:before { background: #8cc656  url(user.svg) no-repeat center center; background-size: 60%; }
.progressbar li::before { background: #fff url(user.svg) no-repeat center center; background-size: 60%; }
.progressbar li:before { content: counter(step); counter-increment: step; }

.registration-form { color:#333; font-size:16px; }
.registration-form h3 { font-size:22px !important; color:#0EA6F1; text-align:center; margin-top:10px; }
.registration-form h4 { font-size:20px !important; color:#0EA6F1; text-align:center; margin-top:10px; font-weight:normal; }
.registration-form p { font-size:18px; text-align:center; }
.registration-form p.small { font-size:16px;}
.registration-form p.small a { text-decoration:underline; }
.registration-form .form-control { height:40px; margin:0px 0 0 0; }
.registration-form select { height:40px;}
.registration-form .checkbox { margin:0; }
.registration-form label { margin-bottom:0; }

.club-card { margin-bottom:50px; }
.club-card .purplepoint ul { list-style: none; padding:10px 10px 0 30px; margin-top:10px; text-align:left; }
.club-card .purplepoint ul li:before { content:"\A"; width:10px; height:10px; border-radius:50%; background: #c669a9; display:inline-block ;margin-left:-20px; margin-right:10px;}
.club-card .purplepoint ul li { list-style-type:none; color: #c669a9; line-height:32px; margin-bottom:10px; font-weight:500; }
.club-card .darkgrey-head-italic { font-size:22px; color:#333; font-style:italic; text-decoration:none; margin:10px 0; font-weight:500; text-align:center; }
.club-card .darkgrey-head { font-size:22px; color:#333; text-decoration:none; margin:10px 0 0 0; font-weight:500; }
.club-card h4.green { color:#8cc656; font-size:22px; text-align:center; font-weight:normal; margin:10px 0; } 

.donation-subscription { margin-bottom:50px; text-align:center; }
.donation-subscription .greenpoint ul { list-style: none; padding:10px 10px 0 30px; margin-top:10px; text-align:left; }
.donation-subscription .greenpoint ul li:before { content:"\A"; width:10px; height:10px; border-radius:50%; background: #8cc656; display:inline-block ;margin-left:-20px; margin-right:10px;}
.donation-subscription .greenpoint ul li { list-style-type:none; color: #8cc656; line-height:28px; margin-bottom:10px; font-weight:500; }
.donation-subscription .darkgrey-head-italic { font-size:22px; color:#333; font-style:italic; text-decoration:none; margin:10px 0; font-weight:500; text-align:center; }
.donation-subscription .darkgrey-head { font-size:20px; color:#333; text-decoration:none; margin:0 0 10px 0; font-weight:500; }
.donation-subscription h4.blue { color:#00a3ff; font-size:22px; text-align:center; font-weight:normal; margin:10px 0; } 

input[type=checkbox], input[type=radio] { margin-left:20px; }

@media screen and (max-width: 767px) and (min-width: 320px) {
	.home { padding: 0 15px 30px 15px; }
	.footer { padding:20px 0; }
	.footer ul li {  display:block; margin:5px 5px;  }
	.logo { text-align:center; width:60%; margin:0 auto; }
	.header { padding: 10px 0; }
	.catchline { text-align:center; }
	.social { text-align: center;  margin-top:15px; }
	
	.education-img { height: auto; background-position: top right; margin-top: 20px; padding-top:270px; text-align:center; }
	.education-img h2 { text-align: center; }
	
	.community-img { background-image: none; height: auto; background-position: top left; margin-top: 10px; padding: 0px 0px 0 0px; text-align:center; }
	.community-img-mobile { display:block; text-align:center; }
	.community-img h2 { text-align: center; padding:0; }
	
	.l3-img { height: auto; background-position: top right; margin-top: 10px; padding: 410px 0 0 10px; text-align:center; }	
	.l3-img h2 { text-align: center; }
	
	.how-we-help-bgimg001 { height: auto; background-position: top center; margin-top: 40px; padding-top: 200px; background-size: contain; text-align:center; }
	.how-we-help-bgimg001 h2 { text-align: center; }
	.how-we-help-bgimg002 { min-height: 556px; height: auto; background-position: bottom right; text-align: center; margin-bottom: 40px;  padding: 10px 10px 30px 10px; }
	.btn-red { white-space: normal; }
	
	
}

@media screen and (max-width: 991px) and (min-width: 768px) {
	.logo { text-align:center; width:60%; margin:0 auto; }
	.catchline { text-align:center; }
	.social { text-align: center;  margin-top:15px; }
	
	.education-img { height: auto; background-position: top right; margin-top: 20px; padding-top:270px; text-align:center; }
	.education-img h2 { text-align: center; padding-top:20px;  }
	.community-img { height: auto; background-position: top left; margin-top: 10px; padding: 350px 0px 0 10px; text-align:center; }
	.community-img-mobile { display:none; }
	.community-img h2 { text-align: center; }
	.l3-img { height: auto; background-position: bottom right; padding: 0 0 30px 30px; margin-top:0; }
	
	.how-we-help-bgimg001 { height: auto; background-position: top center; margin-top: 40px; padding-top: 530px; background-size: contain; text-align:center; }
	.how-we-help-bgimg001 h2 { text-align: center; }
	.how-we-help-bgimg002 { min-height: 556px; height: auto; background-position: bottom right; text-align: center; margin-bottom: 40px;  padding: 10px 10px 30px 10px; }
	
	}

@media screen and (max-width: 1170px) and (min-width: 992px) {
	.education-img { height: auto; background-position: top right; margin-top: 20px; padding-top:0px; text-align:left; }
	.education-img h2 { text-align: left; padding-top:0px;  }
	.community-img { height: auto; background-position: top left; margin-top: 10px; padding: 0px 0px 0 10px; text-align:left; }
	.community-img-mobile { display:none; }
	.community-img h2 { text-align: left; margin-top:0; }
	
	.l3-img { height: auto; background-position: bottom right; padding: 0 0 30px 30px; margin-top:0; }
	}