/* COLOR

	Biru : #26ade3
	Hijau : #81cb37
#41a3a6
#25ada6
*/

@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;600;700&display=swap');


/* CSS RESET */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:10px;font:inherit;vertical-align:baseline;text-decoration:none;color:rgba(0,0,0,.7);line-height:20px}

* {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	vertical-align: baseline;
	outline: none;
	font-size-adjust: none;
	-webkit-text-size-adjust: none;
	-moz-text-size-adjust: none;
	-ms-text-size-adjust: none;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
    -webkit-font-smoothing: antialiased;
    -webkit-transform: translate3d(1,1,1);
    transform:translate3d(1,1,1);    
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

a { text-decoration: none;}
a:hover{text-decoration: none;background-color: none;}

@font-face {
  font-family: "FontAwesome";
  font-weight: normal;
   font-display: swap;
  font-style: normal;
  src: url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/fonts/fontawesome-webfont.woff2") format("woff2");
}


@font-face {
font-family: "FontAwesome";
font-weight: normal;
font-display: swap;
font-style : normal;
       src : url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/fonts/fontawesome-webfont.eot");
       src : url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/fonts/fontawesome-webfont.eot") format("embedded-opentype"),
             url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/fonts/fontawesome-webfont.woff2") format("woff2"),
             url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/fonts/fontawesome-webfont.woff") format("woff"),
             url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/fonts/fontawesome-webfont.ttf") format("truetype"),
             url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/fonts/fontawesome-webfont.svg") format("svg");
}



.fa {font-family:'FontAwesome';font-style: normal;}
.fa-clock-o:before{content: "\f017";}
.fa-imdb:before{content: "\f2d8";}
.fa-calendar:before{content: "\f073";}
.fa-star:before{content: "\f005";}
.fa-star-o:before{content: "";}
.fa-star-half-o:before{content: "";}
.fa-thumbs-up:before{content: "";}
.fa-thumbs-down:before{content: "\f165";}
.fa-search:before{content: "";}
.fa-home:before{content: "";}
.fa-close:before{content: "";}
.fa-star{font-size:15px;color:#ff6f00;}
.fa-star-half-o {font-size:15px;color:#ff6f00;}
.fa-star-o {font-size:15px;color:#ff6f00;}
.fa-imdb:before{content: "";}
.fa-imdb{font-size:20px;color:#f3ce13;}

.fa-home:before{content: "";}
.fa-building:before{content: ""}
.fa-map-marker:before{content: ""}
.fa-phone:before{content: ""}
.fa-clock-o:before{content: ""}
.fa-ticket:before{content: ""}
.fa-instagram:before{content: ""}
.fa-twitter:before{content: ""}
.fa-youtube:before{content: ""}
.fa-handshake-o:before{content: ""}
.fa-user:before{content: ""}
.fa-check-square:before{content: ""}
.fa-angle-right:before{content: ""}
.fa-close:before{content: ""}
.fa-check:before{content: ""}
.fa-newspaper-o:before{content: ""}

/*  ELEMENT  */

html, body {min-height:100%;}

body{font-family: 'Open Sans', sans-serif;background-color:#e5e5e5;}
input,textarea{font-family: 'Open Sans', sans-serif;font-size:90%;border:1px solid rgb(232, 233, 235);width:90%;padding:10px 15px;}

h1,p, h2, h3, h4, h5, h6 a{font-family: 'Open Sans', sans-serif !important;-webkit-font-smoothing: subpixel-antialiased !important;}

h1{font-size:130%;font-weight:600;margin:0px;line-height:130%;}
h2{font-size:115%;font-weight:600;margin-bottom:30px;}


.button_green{display:inline-block;background-color:#25ada6;margin:8px 0px;padding:5px 10px;border-radius:7px;color:#fff;font-size:90%;font-weight:600; }


.link_readmore_green{color:#25ada6;}
.link_readmore_blue{color:#26ade3;}



/*  CANVAS  */

.canvas{width:100%;max-width:500px;margin:0 auto;border:0px solid gold;}

.wrap{background-color:#fff;margin-bottom:60px;}

.verfied{font-size:70%;margin-left:5px;color:#25ada6;}


.top-menu{background-color:#25ada6;padding:10px;margin:0px 0px;box-shadow: rgba(49, 53, 59, 0.12) 0px 1px 9px 0px;text-align:left;}
.top-menu img{width:40%;height: auto;margin-left:10px;}

.navbar_bottom{background-color:#fff;padding:10px;margin:0px 0px;box-shadow: rgba(49, 53, 59, 0.12) 0px 1px 9px 0px;text-align:center;position:fixed;bottom:0;width:99%;max-width:480px;border-top:1px solid #e5e5e5;z-index:999;}

.navbar_bottom .navbar_item{float:left;text-align:center;}
.navbar_bottom .navbar_item .fa{font-size:140%;color:#25ada6;}
.navbar_bottom .navbar_item h4{font-size:70%;color:#25ada6;font-weight:600;}


.content{background-color:#fff;padding:10px;margin:5px 0px;box-shadow: rgba(49, 53, 59, 0.12) 0px 1px 9px 0px;max-width:500px;}

.content-min-padding{background-color:#fff;padding:0px;margin:5px 0px;box-shadow: rgba(49, 53, 59, 0.12) 0px 1px 9px 0px;}

.content-min-height{background-color: #e5e5e5;padding:2px 0px;margin:5px 0px;box-shadow: rgba(49, 53, 59, 0.12) 0px 1px 9px 0px;}

.content-no-height{padding:0px;margin:0px;}

.basic_progress_bar_wrap {
    width: 100%;
    float: left;
    margin-top: 5px;
}

.basic_progress_bar {
    background-color: #f1f1f1;
    height: 6px;
    border-radius: 10px;
}
.basic_progress_bar_orange {
    background-color: #25ada6;
    height: 6px;
    border-radius: 10px;
}



/* HOME PAGE */

.banner{padding:0px;}


.icon_favorit_wrap{background-color:#fff;margin:0px;min-height:80px;padding-top:30px;}

.icon_favorit_wrap .col_33{width:33.333333%;float:left;text-align:center;}

.icon_favorit_wrap .col_33 p{color:#25ada6;font-weight:600;font-size:92%}
.icon_favorit_wrap .col_33 img{width:50%;height:auto;}


.section_1{} 

.program_list{margin:20px 0px;border-bottom:1px solid #e5e5e5;padding-bottom:20px;}
.program_list h3{font-size:90%;font-weight:600;margin-top:-3px;}
.program_list span{font-size:70%;font-weight:400;}
.program_list .program_list_left{float:left;width:40%;margin-right:10px;}
.program_list .program_list_right{float:left;width:54%}
.program_list .program_list_right p{font-size:70%;margin-top:5px;font-weight:500;}
.program_list .program_list_right .basic_progress_bar_wrap{margin-top:10px;}
.program_list .program_list_right .basic_progress_bar_wrap{margin-top:10px;}

.program_slider{}
.program_slider h3{font-size:100%;font-weight:600;margin-top:10px;}
.program_slider span{font-size:70%;font-weight:400;margin-top:10px;margin-bottom:15px;}
.program_slider p{font-size:80%;margin-top:5px;font-weight:500;}
.program_slider .basic_progress_bar_wrap{margin-top:10px;}

.section_slider_1 .bx-wrapper .bx-pager, .section_slider_1 .bx-wrapper .bx-controls-auto {
  position: absolute;
  
  width: 100%;
}



.campaign-container {
  display: flex;
  flex-wrap: nowrap;
  
  align-content: flex-start;
  
  background-color: #fff;
  overflow-x: auto; overflow-y: hidden;
  width:100%;


 height: 345px;
  margin-bottom: 0px;
  
  -webkit-overflow-scrolling: touch;
  &::-webkit-scrollbar {
   
  }

}

.campaign-container .campaign-list-item {
  background-color: #fff;
  min-width: 180px;  height: 300px;
  margin: 10px 5px 10px 5px;
  font-size: 30px;
  display: inline-block;
  box-shadow: 0 0 10px rgba(0,0,0,.1);
  border: 0.5px solid rgba(0, 0, 0, 0.1);
  border-radius:8px;
}

.campaign-container .campaign-list-item .campaign-item-content{
	padding:0px 10px;
}

.campaign-container .campaign-list-item img {
	width:180px;height:100px;
}

.campaign-container .campaign-list-item h3{
	font-size:0.45em; font-weight:600;
	text-align:left;
	margin: 10px 0px 0px 0px;
	line-height:135%;
	height:60px;
	
	--max-lines: 3;
  max-height: 55px;
  overflow: hidden;
  margin-bottom:15px;
}





.campaign-item-content .campaign-item-owner{
	font-size:0.35em; font-weight:600;
	text-align:left;
	color:#777;
}



.homepage_header{
	padding:15px 0px 15px 5px;
}

.homepage_header h2{
	float:left;margin:0px;font-size:120%;font-weight:800;
}
.homepage_header a{
	float:right;
	font-size:85%;
	font-weight:600;
	background-color:#25ada6;
	padding:5px 15px;
	color:#fff;
	border-radius:20px;
}





/* CONTENT SLIDER SMALL */

.section_slider_1 .slider_small{width:90%;margin: 0 auto;}

.section_slider_1 .slider_small_item{box-shadow: 0 0 10px rgba(0,0,0,.1);border:0.5px solid rgba(0, 0, 0, 0.1);border-radius:8px;width:40%; margin:10px 0px 10px 10px;}


.section_slider_1 .slider_small_item img{width:100%;border-top-left-radius:8px;border-top-right-radius:8px;}

.slick-slide {margin: 0 5px;}

.slick-list {margin: 0 -5px;}

.slick-next::before, .slick-prev::before{color:#000;z-index:999;}





/* PROGRAM PAGE */

.program-detail{}

.program-detail h1{margin-bottom:10px;}

.buttonDonasiWrapper{width:100%;margin-top:40px;margin-bottom:20px;text-align:center;}
 .buttonDonasi{background-color:#ffa600;color:#fff;width:100%;display:block;margin:0 auto;padding:15px 0px;text-align:center;border-radius:7px;font-weight:500;font-size:120%}

.program-detail-info p{margin-bottom:15px;font-size:98%;line-height:180%;width:100%;overflow-wrap: break-word;white-space:pre-wrap}

.program-detail-info img{width:100% !important; height:auto !important;}


/* PROGRAM MENU */

.subMenuProgramDetail{text-align:center;width:100%;margin-bottom:5px;margin-top:5px;font-weight:bold;}
.subMenuProgramDetail a{text-align:center;color:#ff6f00;float:left;color:rgba(0,0,0,.7);font-size:0.9em;}
.subMenuProgramDetail .borderRight {border-right: 1px solid rgba(0,0,0,0.1);}


/* DONATE PAGE */



.donateList{}
.donateList .donateListItem{padding:5px 10px;margin-bottom:15px;margin-top:10px;border-bottom:1px solid #f1f1f1;}
.donateList .donateListItem p{margin-bottom:5px;}
.donateList .donateListItem .name{font-weight:500;font-size:80%;}
.donateList .donateListItem .tgl{font-weight:400;font-size:70%;}
.donateList .donateListItem .komen{font-weight:500;font-size:80%;margin-top:10px;margin-bottom:10px;}

.donateList .donateListItem .donate{font-weight:normal;font-size:92%;}
.donateList .donateListItem .donate strong{font-weight:600;font-size:99%;}
.donateList .donateListItem img{border-radius:50%;width:40px;float:left;margin-right:10px;}




.updateList{}
.updateList .updateListItem{padding:5px 10px;margin-bottom:15px;margin-top:10px;}
.updateList .updateListItem p{margin-bottom:5px;}
.updateList .updateListItem .title{font-weight:600;font-size:110%;line-height:120%;}
.updateList .updateListItem .tgl{font-weight:400;font-size:80%;}
.updateList .updateListItem .komen{font-weight:500;font-size:72%;}

.updateList .updateListItem .donate{font-weight:normal;font-size:92%;}
.updateList .updateListItem .donate strong{font-weight:600;font-size:97%;}
.updateList .updateListItem img{width:100%;margin-right:10px;}
.updateList .updateListItem .updateListKonten p{margin :15px 10px;width:98%;line-height:170%;}






/* DONATE PAGE */



.content .pecahan_donasi{width:90%;box-shadow: rgba(49,53,59,.12) 0 1px 9px 0;margin:20px auto;padding:22px 10px 22px 30px;border-radius:8px;}

.content .pecahan_donasi .pecahan_donasi_kiri{float:left;width:94%;font-weight:700;font-size:120%;}
.content .pecahan_donasi .pecahan_donasi_kanan{float:right;width:6%;font-size:150%;font-weight:600;}







/* PAYMENT PAGE */

.program-payment-info{text-align:center;}

.program-payment-info input{border-radius:7px;}
.program-payment-info textarea{margin-bottom:15px;border-radius:7px;}

.program-payment-info .payment_item p{float:left;width:70%;text-align:left;font-size:90%;}
.program-payment-info .payment_item span{float:right;font-size:90%;width:30%;text-align:right;}


.program-payment-info .payment_item_total {margin-top:20px;}
.program-payment-info .payment_item_total p{float:left;width:65%;text-align:left;font-size:110%;font-weight:600;}
.program-payment-info .payment_item_total span{float:right;font-size:110%;font-weight:600;width:35%;text-align:right;}


.form_error{line-height:100%;margin:5px 0px 8px 18px;text-align:left;font-size:80%;color:red;font-weight:400;min-height:15px;}


/* PLUGIN : SLIDER CSS  */


.feature-items {
  
  box-sizing: border-box;
  width: 100%;
  padding: 0px;
  display: flex;
  flex-wrap: wrap;
}

.feature-item--wrapper {
 
  flex-direction: row;
  box-sizing: border-box;
  width: 100%;
  align-items: center;
  justify-content: left;
  display: flex;
}

.img-wrapper {
  box-sizing: border-box;
  width: 65px;
  padding-right: 5px;
  
}

.feature-item--wrapper .img-wrapper img {
  width: 50px !important;
 
}

.text {
  box-sizing: border-box;
  padding-top: 0px;
  padding-bottom: 5px;
  flex: 1 1 auto;
  font-weight:bold;font-size:14px;
}