/**
 * Public users related arabic compatible styling stylesheet.
 * styles/styles.css
 *
 * @copyright (c) 2021 Naua for sustainable development and UNICEF Jordan
 * @link https://www.nahno-volunteers.com
 * @since 2017-04-04
 *
 * @author Haya Salti <haya@insalat.com>
 * @author Yazan Daradkeh <yazan@naua.org>
 * @author Mazen Khatib <mazen.khatib@gmail.com>
 * @author nada_momani
 * @author Saad Shmaisani <saad@insalat.com>
 * @author Hamzeh Oweis <hamzeh@insalat.com>
 * @author Mohammad Khashashneh <khashashneh@insalat.com>
 * @author Tareq Tahboub <tareq@insalat.com>
 * @author Duaa Alsaleh <duaa@insalat.com>
 *
 */

 @import 'theme.css';
 @import 'styles-en.css';
  
 /****************************** fonts */
 
 @font-face {
	 font-family: 'Helvetica Neue LT Arabic';
	 font-style: normal;
	 font-weight: 400;
	 src: url('fonts/helvetica-neue-lt-arabic-regular.ttf') format('truetype'), url('fonts/helvetica-neue-lt-arabic-75-bold.ttf') format('truetype');
 }
 
 @font-face {
	 font-family: 'Univers LT Pro';
	 font-style: normal;
	 font-weight: 500;
	 src: url('fonts/UniversLTPro55Roman.ttf') format('truetype'), url('fonts/UniversLTPro65Bold.ttf') format('truetype'), url('fonts/UniversLTPro75Black.ttf') format('truetype');
 }
 
 /****************************** general */ 

 html {
	 margin: 0;
	 width: 100%;
 }
 
 * {
	 font-family: 'Univers LT Pro', 'Helvetica Neue LT Arabic', sans-serif;
 }
 
 body {
	 margin: 0;
	 font-family: 'Univers LT Pro', 'Helvetica Neue LT Arabic', sans-serif;
	 font: normal 16px 'Univers LT Pro', 'Helvetica Neue LT Arabic', sans-serif;
	 overflow-x: auto;
	 overflow-y: scroll;
 }
 
 html.device-mobile-optimized.blockSiteScrolling>body {
	 position: fixed;
	 width: 100%;
 }
 
 html.device-phone body {
	 overflow-y: auto;
 }
 
 body.device-mobile-optimized {
	 overflow-x: hidden;
	 overflow-y: scroll;
 }
 
 * {
	 -webkit-box-sizing: border-box;
	 -moz-box-sizing: border-box;
	 box-sizing: border-box;
 }
 
 input, textarea, select {
	 font: normal 16px;
	 box-sizing: border-box;
	 -webkit-box-shadow: none !important;
	 -moz-box-shadow: none !important;
	 box-shadow: none !important;
 }
 
 img {
	 border: none;
 }
 
 a {
	 color: #000;
 }
 
 .bold {
	 font-weight: bold;
 }
 
 .black {
	 color: #000;
 }
 
 a:hover, div a:hover, .user-menu a:hover {
	 color: var(--primary-color);
 }
 
 .link {
	 cursor: pointer;
 }
 
 .link:hover {
	 color: var(--primary-color);
 }
 
 .img-circle {
	 border-radius: 50%;
 }
 
 .left {
	 float: right;
 }
 
 .right {
	 float: left;
 }
 
 strong, .strong {
	 font-weight: 600;
 }
 
 .clearfix {
	 clear: both;
 }
 
 .center {
	 margin: 0 auto 0 auto;
	 display: table;
 }
 
 .right {
	 float: right;
	 margin: 0 20px 0 0;
 }
 
 .noscroll {
	 overflow: hidden;
	 padding-right: 17px;
 }
 
 .center-text {
	 text-align: center;
 }
 
 .no-border {
	 border: none;
 }
 
 .hidden, .check {
	 display: none;
 }
 
 .required {
	 border-bottom: solid 1px #992e2d !important;
 }
 
 .underline {
	 border-bottom: solid 1px #ddd;
 }
 
 .inline-block {
	 display: inline-block;
 }
 
 .separator-line1 {
	 height: 1.3px;
	 background: #dedee6;
 }
 
 .separator-line2 {
	 height: 1.3px;
	 background: #e9e9f1;
 }
 
 .instructions {
	 font-size: 16px;
	 margin: 0;
	 position: relative;
	 line-height: 1;
 }
 
 .instructions > span {
	 color: red;
 }
 
 .margin-top {
	 margin-top: 20px;
 }
 
 div[class*="-invalid"] {
	 color: #992e2d;
 }
 
 .loading {
	 margin: 75px auto;
 }
 
 .loading img {
	 width: 85px;
	 height: 85px;
 }
 
 #cards-container .loading {
	 margin: 25px auto;
 }
 
 #cards-container .loading img {
	 width: 25px;
	 height: 25px;
 }
 
 .ar {
	 font-family: 'Helvetica Neue LT Arabic';
 }
 
 .flex-center {
	 display: flex;
	 align-items: center;
	 justify-content: center;
 }
 
 .flex-between {
	 display: flex;
	 align-items: center;
	 justify-content: space-between;
 }
 
 .flex-start {
	 display: flex;
	 align-items: center;
	 gap: 5px;
 }
 
 h1.main-title {
	 font-size: 0;
	 width: 1px;
	 height: 1px;
	 display: inline-block;
	 overflow: hidden;
	 position: absolute!important;
	 border: 0!important;
	 padding: 0!important;
	 margin: 0!important;
	 clip: rect(1px, 1px, 1px, 1px);
 }
 
 .hidden{
	 display:none;
 }
 /****************************** titles, buttons */
 
 .main {
	 width: 1170px;
	 margin: 0 auto 0 auto;
	 direction: rtl;
 }
 
 .text-xsmall {
	 font-size: 13px;
 }
 
 .text-small {
	 font-size: 16px;
 }
 
 .text-normal {
	 font-size: 16px;
 }
 
 .text-xnormal {
	 font-size: 16px;
 }
 
 .text-medium {
	 font-size: 20px;
 }
 
 .text-xmedium {
	 font-size: 22px;
 }
 
 .text-large {
	 font-size: 26px;
 }
 
 .text-xl {
	 font-size: 34px;
 }
 
 .text-xxl {
	 font-size: 40px;
 }
 
 .text-align-center {
	 text-align: center;
 }
 
 .grey {
	 color: #a9a9a9;
 }
 
 .grey-dark {
	 color: #a3a3ab;
 }
 
 .cpf-logo-about-page {
	 width: 100%;
 }
 
 .orange {
	 color: var(--primary-color);
 }
 
 .title {
	 font-size: 23px;
 }
 
 .title-grey {
	 font-size: 23px;
	 color: #bbbbc2;
 }
 
 .subtitle {
	 font-size: 18px;
 }
 
 .small-subtitle {
	 font-size: 14px;
 }
 
 .block-third .signin-button {
	 font-size: 15px;
 }
 
 .title-medium {
	 font-size: 28px;
 }
 
 .title-large {
	 font-size: 30px;
 }
 
 .title-small {
	 font-size: 20px;
 }
 
 input:focus, textarea:focus, select:focus {
	 outline: none;
 }
 
 .primary-text{
	 color: var(--primary-color);
 }
 
 .primary-bg{
	 background: var(--primary-color);
 }
 
 .primary-filter{
	 filter: var(--primary-filter);
 }
 
 .button, .button-xsmall, .button-small, .button-large, .button-edit, input[type=submit] .button-small {
	 background: var(--primary-color);
	 color: #fff;
	 font-weight: 600;
	 padding: 12px 25px;
	 cursor: pointer;
	 border: none;
	 -moz-border-radius: 5px;
	 -webkit-border-radius: 5px;
	 border-radius: 5px;
	 /* line-height: 1.5; */
 }
 .button-large{
	display: table!important;
 }
 .button-xlarge {
	 background: var(--primary-color);
	 color: #fff;
	 text-transform: uppercase;
	 font-weight: 600;
	 /*letter-spacing:1px; (en)*/
	 padding: 12px 25px;
	 display: table;
	 cursor: pointer;
	 border: none;
	 -moz-border-radius: 5px;
	 -webkit-border-radius: 5px;
	 border-radius: 5px;
	 font-size: 20px;
	 padding: 24px 34px;
 }
 
 .button-mid-large {
	 background: var(--primary-color);
	 color: #fff;
	 text-transform: uppercase;
	 font-weight: 600;
	 /*letter-spacing:1px; (en)*/
	 padding: 20px 45px;
	 display: table;
	 cursor: pointer;
	 border: none;
	 -moz-border-radius: 5px;
	 -webkit-border-radius: 5px;
	 border-radius: 5px;
	 font-size: 16px;
 }
 .en .button-mid-large {
    background: var(--primary-color);
    color: #fff;
    text-transform: unset;
    font-weight: 600;
    padding: 10px;
    display: table;
    cursor: pointer;
    border: none;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    font-size: 16px;
 }
 
 .button-mid {
	 background: var(--primary-color);
	 color: #fff;
	 text-transform: uppercase;
	 font-weight: 300;
	 /*letter-spacing:1px; (en)*/
	 padding: 10px 30px;
	 display: table;
	 cursor: pointer;
	 border: none;
	 -moz-border-radius: 5px;
	 -webkit-border-radius: 5px;
	 border-radius: 5px;
	 font-size: 14px;
 }
 
 .button-xsmall {
	 font-size: 12px;
	 padding: 8px 15px;
 }
 
 .button-small, input[type=submit] .button-small {
	 min-width: 120px;
	 font-size: 13px;
	 text-align: center;
	 padding: 5px;
 }
 .en .button-small {
	min-width: 120px;
	font-size: 13px;
	text-align: center;
	padding: 10px;
}
 .button-large {
	 font-size: 16px;
	 padding: 20px 30px;
 }
 
 .button-edit {
	 margin: 20px 20px 0 0;
	 position: absolute;
 }
 
 .button:hover, .button-small:hover, .button-large:hover {
	 background: var(--primary-color);
 }
 
 input[type=submit].disabled, .button-xsmall.disabled, .button-small.disabled, .button-large.disabled, .button-mid-large .button-mid .disabled {
	 background: #dedede !important;
	 cursor: default;
 }
 
 .small-text {
	 font-size: 14px;
 }
 
 /****************************** tooltips */
 
 .tooltip {
	 position: relative;
	 display: inline-block;
 }
 
 .tooltip.translate-y {
	 transform: translateY(24%)
 }
 
 .user-notification .tooltip, .user-notification-page .tooltip {
	 position: unset;
	 display: unset;
 }
 
 .user-notification .tooltip .tooltiptext, .user-notification-page .tooltip .tooltiptext {
	 background-color: #39ccd2;
	 left: 20px;
	 width: 100%;
	 visibility: hidden;
	 color: #fff;
	 text-align: center;
	 font-size: 8px;
	 padding: 5px 5px;
	 border-radius: 6px;
	 position: absolute;
	 z-index: 1;
 }
 
 .user-notification .tooltip:hover .tooltiptext, .user-notification-page .tooltip:hover .tooltiptext {
	 visibility: visible;
	 font-size: 8px;
 }
 
 #cards-container .tooltip .tooltiptext {
	 visibility: hidden;
	 width: 150px;
	 background-color: #39ccd2;
	 color: #fff;
	 text-align: center;
	 font-size: 9pt;
	 padding: 5px 5px;
	 border-radius: 6px;
	 position: absolute;
	 z-index: 1;
 }
 
 #cards-container .tooltip:hover .tooltiptext {
	 visibility: visible;
 }
 
 .tooltip.pulled {
	 margin-right: -20px;
 }
 
 .tooltip .tooltiptext {
	 visibility: hidden;
	 width: 150px;
	 background-color: black;
	 color: #fff;
	 text-align: center;
	 font-size: 9pt;
	 padding: 5px 5px;
	 border-radius: 6px;
	 position: absolute;
	 z-index: 1;
 }
 
 .tooltip:hover .tooltiptext {
	 visibility: visible;
 }
 
 /****************************** popup edge */
 
 .popup-fade {
	 background: rgba(0, 0, 0, 0.65);
	 position: fixed;
	 top: 0;
	 right: 0;
	 bottom: 0;
	 left: 0;
	 outline: 0;
	 z-index: 1001;
	 display: none;
	 overflow-x: hidden;
	 overflow-y: auto;
 }
 
 .popup-dialog {
	 position: relative;
	 margin: 350px auto 0;
	 width: 75%;
	 display: none;
	 -webkit-transform: translate(0, -25%);
	 -ms-transform: translate(0, -25%);
	 -o-transform: translate(0, -25%);
	 transform: translate(0, -25%);
	 transition: transform 0.3s ease-out;
 }
 
 .popup-dialog.in {
	 -webkit-transform: translate(0, 0);
	 -ms-transform: translate(0, 0);
	 -o-transform: translate(0, 0);
	 transform: translate(0, 0);
 }
 
 .popup-content {
	 position: relative;
	 background-color: #f0f0f0;
	 padding: 10px;
	 box-shadow: 0 1px 10px rgba(0, 0, 0, 0.20);
	 -moz-border-radius: 10px;
	 -webkit-border-radius: 10px;
	 border-radius: 10px;
 }
 
 .popup-title {
	 text-align: center;
	 margin-top: 10px;
	 padding: 10px 0;
	 font-size: 18px;
	 font-weight: 400;
 }
 
 .popup-logo {
	 text-align: center;
	 margin: 8px 0;
 }
 
 .popup-logo img {
	 width: 65px;
 }
 
 .popup-details {
	 text-align: center;
	 padding: 10px 0;
	 font-size: 18px;
	 font-weight: 400;
 }
 
 /****************************** audio */
 
 #player {
	 width: 100px;
	 margin-top: -5px;
 }
 
 .speaker {
	 background-color: #6c6c70;
	 opacity: 1;
	 border-radius: 60%;
	 background-image: url('../images/speaker.png');
	 background-repeat: no-repeat;
	 background-size: 200%;
	 background-position: 100% 0;
	 height: 38px;
	 width: 40.5px;
	 cursor: pointer;
	 display: block;
	 position: absolute;
	 bottom: 0px;
	 right: 15px;
	 margin-bottom: 10px;
	 margin-right: -5px;
	 display: block;
	 z-index: 5;
 }
 
 .speaker.flixel {
	 margin-bottom: 25px;
 }
 
 .speakerplay {
	 background-position: 0 0;
 }
 
 /****************************** edit mode */
 
 .ngo-edit {
	 align-self: flex-end;
	 background: var(--primary-color);
	 color: #fff;
	 text-transform: uppercase;
	 font-size: 25px !important;
	 cursor: pointer;
	 border: none;
	 -moz-border-radius: 5px;
	 -webkit-border-radius: 5px;
	 border-radius: 5px;
	 padding: 9px;
	 line-height: 1;
 }
 
 .ngo-website-edit {
	 width: 215px;
	 font-size: 16px;
	 background: none;
	 border: solid 2px #d8d8e0;
	 direction: ltr;
 }
 
 .ngo-url-linkedin-edit, .user-url-linkedin-edit, .ngo-url-instagram-edit, .user-url-instagram-edit, .ngo-url-twitter-edit, .user-url-twitter-edit, .ngo-url-facebook-edit, .user-url-facebook-edit {
	 width: 215px;
	 font-size: 16px;
	 text-align: left;
	 background: none;
	 border: solid 2px #d8d8e0;
	 direction: ltr;
 }
 
 .ngo-city-edit, .project-city-edit {
	 width: 125px;
	 font-size: 16px;
	 color: #000;
	 background: none;
	 border: solid 2px #d8d8e0;
	 padding: 0 3px;
 }
 
 .project-city-edit {
	 color: #000;
 }
 
 select.ngo-country-edit, select.user-country-edit, select.project-country-edit {
	 font-size: 16px;
	 background: none;
	 color: #000;
	 border: solid 2px #d8d8e0;
 }
 
 select.project-country-edit {
	 color: #000;
 }
 
 select.ngo-country-edit option, select.user-country-edit option, select.project-country-edit option {
	 color: #333333;
 }
 
 .ngo-description-edit, .user-bio-edit, .project-description-edit, .project-challenge-edit, .project-impact-edit, .project_workplan-edit {
	 width: 100%;
	 font-size: 16px;
	 background: none;
	 border: solid 2px #d8d8e0;
	 padding: 10px;
	 box-sizing: border-box;
 }
 
 .project-update-title-edit, .project-update-content-edit {
	 width: 100%;
	 font-size: 15px;
	 background: none;
	 border: solid 2px #d8d8e0;
	 padding: 10px;
	 margin-bottom: 5px;
	 box-sizing: border-box;
 }
 
 .ngo-board-firstname-edit, .ngo-board-lastname-edit, .ngo-board-post-edit {
	 width: 100px;
	 background: none;
	 border: solid 2px #d8d8e0;
	 padding: 3px 5px;
 }
 
 .project-video-edit {
	 width: 125px;
	 height: 30px;
	 font-size: 16px;
	 background: #fff;
	 border: solid 1px #fff;
	 padding: 3px 4px;
 }
 
 /****************************** icons */
 
 .icon-contact {
	 width: 20px;
	 height: 16px;
	 background: url('../images/sprite.png') 0 -88px no-repeat;
	 margin: 4px 5px 0 0;
	 float: right;
 }
 
 .icon-time {
	 width: 17px;
	 height: 17px;
	 background: url('../images/sprite.png') -134px -86px no-repeat;
	 margin: 8px 0 0 4px;
	 float: right;
 }
 
 .icon-search {
	 width: 18px;
	 height: 18px;
	 background: url('../images/sprite.png') -154px -116px no-repeat;
	 margin-top: 7px;
	 margin-left: 12px;
 }
 
 .icon-location {
	 width: 21px;
	 height: 20px;
	 background: url('../images/sprite.png') -86px -86px no-repeat;
 }
 
 .icon-location-light {
	 width: 14px;
	 height: 20px;
	 background: url('../images/sprite.png') -110px -86px no-repeat;
 }
 
 .icon-verify {
	 width: 68px;
	 height: 68px;
	 background: url('../images/sprite.png') 0px -116px no-repeat;
 }
 
 .icon-check-email {
	 width: 68px;
	 height: 68px;
	 background: url('../images/sprite.png') -78px -116px no-repeat;
 }
 
 .icon-edit-mode {
	 width: 20px;
	 height: 18px;
	 background: url('../images/sprite.png') -123px -1px no-repeat;
	 position: absolute;
 }
 
 .icon-edit-mode {
	 right: 0px;
	 top: -25px;
 }
 
 .icon-follow {
	 width: 25px;
	 height: 23px;
	 background: url('../images/sprite.png') -153px -139px no-repeat;
 }
 
 .icon-follow.dark {
	 width: 25px;
	 height: 23px;
	 background: url('../images/sprite.png') -223px -139px no-repeat;
 }
 
 .icon-follow.on {
	 width: 25px;
	 height: 23px;
	 background: url('../images/sprite.png') -188px -139px no-repeat;
	 filter: var(--primary-filter);
 }
 
 .icon-pledge {
	 width: 50px;
	 height: 50px;
	 border: 2px solid #fff;
 }
 
 /****************************** parsley */
 
 #ngo-form .parsley-error, #settings-form .parsley-error, #deactivate-form .parsley-error, #login-form .parsley-error, #contact-ngo-form .parsley-error, #password-request-form .parsley-error, #password-reset-form .parsley-error, #register-user-form .parsley-error, #register-ngo-form .parsley-error, #project-new-form .parsley-error, #project-edit-form .parsley-error, #payment-form .parsley-error, #flag-form .parsley-error, #flag-comment-form .parsley-error, #comment-form .parsley-error, #update-form .parsley-error {
	 border-bottom: solid 1px red !important;
 }
 
 #ngo-form .parsley-error, .project-update-cell .parsley-error, .impact-cell2 .parsley-error, .impact-cell .parsley-error, ul.ngo-board-info .parsley-error, #update-form .parsley-error, .report-cell .parsley-error {
	 border-bottom: solid 2px red !important;
 }
 
 ul.parsley-errors-list {
	 list-style: none;
	 margin: 3px 0 0 0;
	 padding: 0;
	 font-size: 13px;
	 color: red;
	 /*display:none !important;*/
 }
 
 /*#ngo-form ul.parsley-errors-list li.parsley-required,*/
 /* #contact-form ul.parsley-errors-list,  */
 #settings-form ul.parsley-errors-list li.parsley-required, #deactivate-form ul.parsley-errors-list li.parsley-required, #login-form ul.parsley-errors-list li.parsley-required, #contact-ngo-form ul.parsley-errors-list li.parsley-required, #password-request-form ul.parsley-errors-list li.parsley-required, #password-reset-form ul.parsley-errors-list li.parsley-required, #register-user-form ul.parsley-errors-list li.parsley-required, #register-ngo-form ul.parsley-errors-list li.parsley-required, #project-new-form ul.parsley-errors-list, #project-edit-form ul.parsley-errors-list, #payment-form ul.parsley-errors-list, #flag-form ul.parsley-errors-list, #flag-comment-form ul.parsley-errors-list, #comment-form ul.parsley-errors-list, #update-form ul.parsley-errors-list,
 /*#project-form ul.parsley-errors-list,*/
 
 .impact-cell ul.parsley-errors-list, .impact-cell2 ul.parsley-errors-list, ul.ngo-board-info ul.parsley-errors-list, .report-cell ul.parsley-errors-list {
	 display: none !important;
 }
 
 ul.parsley-errors-list li.parsley-required {
	 font-weight: normal;
 }
 
 .parsley-custom-error-message, .invalid-form-error-message {
	 color: red;
 }
 
 .pic-error {
	 border: solid 2px red;
 }
 
 /****************************** header */
 
 .header-container {
	 display: flex;
	 flex-direction: column;
	 width: 1170px;
	 position: fixed;
	 top: 0;
	 z-index: 100;
 }
 
 .header {
	 min-height: 70px;
	 background: #fff;
	 border-bottom: solid 1px #dedee6;
	 padding-inline: 20px;
 }
 
 .header-margin {
	 height: 60px;
 } 
 
 .header-logo {
	 width: 9%;
 }
 
 .header-menu {
	 font-size: 16px;
	 font-weight: bold;
	 gap: 35px;
 }
 
 .header-left {
	 font-size: 16px;
	 font-weight: bold;
	 gap: 20px;
 }
 
 .header-project {
	 float: right;
	 margin-left: 5px;
 }
 
 .header-project a {
	 text-transform: uppercase;
	 color: var(--primary-color) !important;
 }
 
 .header-search {
	 width: 40px;
	 height: 40px;
	 position: relative;
	 margin-top: 3px;
 }
 
 .header-search-icon, .uni-search-icon {
	 width: 40px;
	 height: 100%;
	 background: url('../images/sprite.png') -125px -35px no-repeat;
	 cursor: pointer;
	 position: absolute;
	 z-index: 10;
 }
 
 .banner-container {
	 display: none;
	 flex-direction: row;
	 top: 0px;
	 right: 0px;
	 width: 100%;
	 padding: 10px;
	 z-index: 150;
 }
 
 .banner-close {
	 flex-basis: 8%;
	 display: flex;
	 justify-content: center;
	 flex-direction: column;
 }
 
 .banner-visit {
	 flex-basis: 8%;
	 display: flex;
	 justify-content: center;
	 flex-direction: column;
 }
 
 .banner-visit button {
	 width: 100%;
	 padding: 6px;
	 cursor: pointer;
	 font-size: 16px;
	 font-weight: bold;
	 text-align: center;
	 border-radius: 10px;
	 border-width: 0px;
 }
 
 .banner-close button {
	 width: 100%;
	 padding: 6px;
	 cursor: pointer;
	 font-size: 16px;
	 font-weight: bold;
	 text-align: center;
	 background-color: white;
	 width: 100%;
	 border-radius: 10px;
	 border-width: 0px;
	 color: rgb(17, 17, 17);
 }
 
 .banner-content {
	 padding-right: 20px;
	 font-size: 16px;
 }
 
 .banner-margin {
	 height: 63px;
 }
 
 .read-icon {
	 width: 10px;
	 height: 10px;
	 background: url('../images/read.png') no-repeat;
	 cursor: pointer;
	 background-size: contain;
 }
 
 .loading-gif {
	 width: 15px;
	 height: 15px;
	 background: url('../images/loader.gif') no-repeat;
	 cursor: pointer;
	 background-size: contain;
	 background-position: center;
 }
 
 
 .loading-gif-no-dimensions {
	 background: url('../images/loader.gif') no-repeat;
	 cursor: pointer;
	 background-size: contain;
	 background-position: center;
 }
 
 .loading-gif-h-100px {
	 height: 100px;
	 background: url('../images/loader.gif') no-repeat;
	 cursor: pointer;
	 background-size: contain;
	 background-position: center;
 }
 
 .read-icon:hover {
	 width: 10px;
	 height: 10px;
	 background: url('../images/unread.png') no-repeat;
	 cursor: pointer;
	 background-size: contain;
 }
 
 .unread-icon {
	 width: 10px;
	 height: 10px;
	 background: url('../images/unread.png') no-repeat;
	 cursor: pointer;
	 background-size: contain;
 }
 
 .unread-icon:hover {
	 width: 10px;
	 height: 10px;
	 background: url('../images/read.png') no-repeat;
	 cursor: pointer;
	 background-size: contain;
 }
 
 .notification-icon {
	 width: 35px;
	 height: 30px;
	 background: url('../images/notification_icon.png') no-repeat;
	 cursor: pointer;
	 background-size: cover;
 }
 
 .flex-volunteer-list-toolbar {
	 width: 100%;
	 display: flex;
	 justify-content: flex-end;
 }
 
 .flex-search-icon {
	 width: 39px;
	 height: 39px;
	 background: url('../images/sprite.png') -125px -35px no-repeat;
 }
 
 .flex-search-container {
	 border-radius: 20px;
	 border: 1px solid #c2c2c2;
	 display: flex;
	 height: 41px;
 }
 
 .flex-students-list-toolbar-items {
	 margin: 0px 15px 15px 0px;
 }
 
 .header-search input#search-text{
	 width: 100px;
	 height: 27px;
	 padding-right: 35px !important;
	 border: solid 1px #ededed;
	 margin-right: 10px;
	 display: none;
	 z-index: 9;
	 -moz-border-radius: 2px;
	 -webkit-border-radius: 2px;
	 border-radius: 2px;
 }
 
 .header-search input:focus {
	 outline: none;
 }
 
 .header-menu a {
	 color: #000;
	 text-decoration: none;
 }
 
 .header-mobile-a {
	 margin-right: 15% !important;
	 margin-left: 20% !important;
 }
 
 .header-left a {
	 color: #000;
	 text-decoration: none;
 }
 
 #explore-menu {
	 height: 0;
	 overflow: hidden;
	 background: #fff;
	 margin-top: 60px;
 }
 
 #explore_vip-menu {
	 height: 0;
	 overflow: hidden;
	 background: #fff;
 }
 
 .header-profilepic {
	 width: 39px;
	 height: 39px;
	 background: #ddd;
	 cursor: pointer;
	 order: 3;
 }
 
 .header-profilepic img {
	 width: 40px;
	 height: 40px;}
 
 .header-editmode {
	 float: right;
	 margin-left: 20px;
 }
 
 .editmode-button {
	 float: right;
	 margin-right: 15px;
	 min-width: 110px;
	 /* margin-top: -6px; */
 }
 
 .editmode-button.pending {
	 min-width: 84px;
	 /* fix */
	 background: #dedede;
	 cursor: default;
 }
 
 /* user menu, project menu */
 
 .project-menu {
	 position: absolute;
	 left: 33px;
	 top: 75px;
	 display: none;
	 z-index: 25;
 }
 
 .user-menu {
	 position: absolute;
	 left: 9px;
	 top: 75px;
	 display: none;
	 z-index: 25;
 }
 
 .user-notification {
	 position: absolute;
	 left: 71px;
	 top: 75px;
	 display: none;
	 z-index: 200;
 }
 
 .user-menu ul, .user-notification ul, .project-menu ul {
	 list-style: none;
	 font-size: 15px;
	 margin: 0;
	 padding: 0;
	 position: absolute;
	 top: 0;
	 left: 0;
	 z-index: 2;
	 width: 150px;
	 background: #fff;
	 padding: 16px 18px 7px;
	 box-shadow: 0 1px 10px rgba(0, 0, 0, 0.20);
 }
 
 .project-menu ul {
	 left: 125px;
 }
 
 .user-menu ul li, .user-notification ul li, .project-menu ul li {
	 padding: 0 0 10px 0;
 }
 
 .user-menu ul li a, .user-notification ul li a, .project-menu ul li a {
	 text-decoration: none;
 }
 
 .user-menu-tip, .user-menu-tip-top, .user-notification-tip, .user-notification-tip-top, .project-menu-tip, .project-menu-tip-top {
	 width: 14px;
	 height: 14px;
	 background: #fff;
	 position: absolute;
	 top: -7px;
	 left: 25px;
	 box-shadow: 0 1px 10px rgba(0, 0, 0, 0.20);
	 z-index: 1;
	 -moz-transform: rotate(45deg);
	 -o-transform: rotate(45deg);
	 -webkit-transform: rotate(45deg);
	 transform: rotate(45deg);
 }
 
 .user-menu-tip-top, .project-menu-tip-top {
	 width: 14px;
	 height: 14px;
	 background: #fff;
	 position: absolute;
	 top: -7px;
	 left: 25px;
	 box-shadow: none;
	 z-index: 3;
 }
 
 .user-notification-tip-top, .user-notification-tip {
	 width: 14px;
	 height: 14px;
	 background: #fff;
	 position: absolute;
	 top: -7px;
	 left: 20px;
	 box-shadow: none;
	 z-index: 150;
 }
 
 .project-menu-tip, .project-menu-tip-top {
	 left: 150px;
 }
 
 .project-new-menu {
	 position: absolute;
	 right: 800px;
	 top: 60px;
	 display: none;
	 z-index: 25;
 }
 
 .project-new-menu ul {
	 list-style: none;
	 font-size: 15px;
	 margin: 0;
	 padding: 0;
	 position: absolute;
	 top: 0;
	 right: 0;
	 z-index: 2;
	 width: 150px;
	 background: #fff;
	 padding: 16px 18px 7px;
	 box-shadow: 0 1px 10px rgba(0, 0, 0, 0.20);
 }
 
 .project-new-menu ul {
	 right: 125px;
 }
 
 .project-new-menu ul li {
	 padding: 0 0 10px 0;
 }
 
 .project-new-menu ul li a {
	 text-decoration: none;
 }
 
 .project-new-menu-tip, .project-new-menu-tip-top {
	 width: 14px;
	 height: 14px;
	 background: #fff;
	 position: absolute;
	 top: -7px;
	 right: 25px;
	 box-shadow: 0 1px 10px rgba(0, 0, 0, 0.20);
	 z-index: 1;
	 -moz-transform: rotate(45deg);
	 -o-transform: rotate(45deg);
	 -webkit-transform: rotate(45deg);
	 transform: rotate(45deg);
 }
 
 .project-new-menu-tip-top {
	 width: 14px;
	 height: 14px;
	 background: #fff;
	 position: absolute;
	 top: -7px;
	 right: 25px;
	 box-shadow: none;
	 z-index: 3;
 }
 
 .project-new-menu-tip, .project-new-menu-tip-top {
	 right: 150px;
 }
 
 /****************************** account settings */
 
 .settings-fade {
	 background: rgba(0, 0, 0, 0.65);
	 position: fixed;
	 top: 0;
	 right: 0;
	 bottom: 0;
	 left: 0;
	 outline: 0;
	 z-index: 1001;
	 display: none;
	 overflow-x: hidden;
	 overflow-y: auto;
 }
 
 .settings-dialog {
	 position: relative;
	 margin: 50px auto 0;
	 width: 800px;
	 display: none;
	 -webkit-transform: translate(0, -25%);
	 -ms-transform: translate(0, -25%);
	 -o-transform: translate(0, -25%);
	 transform: translate(0, -25%);
	 transition: transform 0.3s ease-out;
 }
 
 .settings-dialog.in {
	 -webkit-transform: translate(0, 0);
	 -ms-transform: translate(0, 0);
	 -o-transform: translate(0, 0);
	 transform: translate(0, 0);
 }
 
 .settings-close {
	 width: 20px;
	 height: 20px;
	 background: url('../images/sprite.png') -56px -86px no-repeat;
	 left: 19px;
	 top: 26px;
	 cursor: pointer;
	 position: absolute;
 }
 
 .settings-content {
	 min-height: 300px;
	 position: relative;
	 background-color: #fff;
	 box-shadow: 0 1px 10px rgba(0, 0, 0, 0.20);
	 -moz-border-radius: 1px;
	 -webkit-border-radius: 1px;
	 border-radius: 1px;
 }
 
 .settings-header {
	 height: 65px;
	 background: #f0f0f0;
	 padding: 20px;
	 font-size: 28px;
 }
 
 .settings-title {
	 /*    margin:15px 30px 0 0;*/
	 position: relative;
	 top: 50%;
	 transform: translateY(-50%);
 }
 
 .settings-details, .settings-deactivate {
	 padding: 36px 50px 50px;
 }
 
 .settings-field {
	 margin: 15px 0;
 }
 
 .settings-button {
	 margin: 10px auto 0 auto;
 }
 
 .settings-field input[type=text], .settings-field input[type=password] {
	 width: 150px;
	 border: none;
	 border-bottom: solid 1px #cccccc;
	 padding: 5px 0;
	 margin-right: 15px;
	 padding-right: 15px;
	 font-size: 15px;
 }
 
 .r-margin {
	 margin-right: 10px;
 }
 
 .settings-field.space {
	 padding-left: 50px;
 }
 
 .settings-confirm {
	 width: 350px;
	 padding: 46px 0 50px 50px;
	 margin: 0 auto 0 auto;
	 text-align: center;
	 display: none;
 }
 
 .settings-deactivate {
	 display: none;
 }
 
 .settings-deactivate-button {
	 position: absolute;
	 background: #dedede;
	 left: 50px;
	 bottom: 50px;
 }
 
 /****************************** show transaction */
 
 .notification-fade {
	 background: rgba(0, 0, 0, 0.65);
	 position: fixed;
	 top: 0;
	 right: 0;
	 bottom: 0;
	 left: 0;
	 outline: 0;
	 z-index: 1001;
	 display: none;
	 overflow-x: hidden;
	 overflow-y: auto;
 }
 
 .notification-dialog {
	 position: relative;
	 margin: 50px auto 0;
	 width: 800px;
	 display: none;
	 -webkit-transform: translate(0, -25%);
	 -ms-transform: translate(0, -25%);
	 -o-transform: translate(0, -25%);
	 transform: translate(0, -25%);
	 transition: transform 0.3s ease-out;
 }
 
 .notification-dialog.in {
	 -webkit-transform: translate(0, 0);
	 -ms-transform: translate(0, 0);
	 -o-transform: translate(0, 0);
	 transform: translate(0, 0);
 }
 
 .notification-close {
	 width: 20px;
	 height: 20px;
	 background: url('../images/sprite.png') -56px -86px no-repeat;
	 left: 19px;
	 top: 26px;
	 cursor: pointer;
	 position: absolute;
 }
 
 .notification-content {
	 min-height: 300px;
	 position: relative;
	 background-color: #fff;
	 box-shadow: 0 1px 10px rgba(0, 0, 0, 0.20);
	 -moz-border-radius: 1px;
	 -webkit-border-radius: 1px;
	 border-radius: 1px;
 }
 
 .notification-header {
	 height: 65px;
	 background: #f0f0f0;
	 padding: 20px;
	 font-size: 28px;
 }
 
 .notification-title {
	 position: relative;
	 top: 50%;
	 transform: translateY(-50%);
	 /*    margin:15px 30px 0 0;*/
 }
 
 .notification-details, .notification-deactivate {
	 padding: 36px 50px 50px;
 }
 
 .notification-field {
	 margin: 15px 0;
 }
 
 .notification-button {
	 margin: 10px auto 0 auto;
 }
 
 .notification-field input[type=text], .notification-field input[type=password] {
	 width: 325px;
	 border: none;
	 border-bottom: solid 1px #cccccc;
	 padding: 5px 0;
	 font-size: 15px;
 }
 
 .notification-field.space {
	 padding-left: 50px;
 }
 
 .notification-confirm {
	 width: 350px;
	 padding: 46px 0 50px 50px;
	 margin: 0 auto 0 auto;
	 text-align: center;
	 display: none;
 }
 
 .notification-deactivate {
	 display: none;
 }
 
 .notification-deactivate-button {
	 position: absolute;
	 background: #dedede;
	 left: 50px;
	 bottom: 50px;
 }
 
 .transaction-box {
	 width: 100%;
	 background-color: #f0f0f0;
	 padding: 15px;
	 margin-bottom: 15px;
 }
 
 .transaction-box .row {
	 width: 100%;
 }
 
 .transaction-box .right {
	 display: inline-block;
	 float: right;
 }
 
 .transaction-box .left {
	 display: inline-block;
	 float: left;
 }
 
 .transaction-box .block {
	 display: inline-block;
 }
 
 .transaction-box .box-underline {
	 border-bottom: solid 1px #dedee6;
 }
 
 .transaction-box img {
	 width: 45px;
	 height: 45px;
 }
 
 .transaction-box .subtitle {
	 font-weight: bold;
 }
 
 .transaction-box a {
	 text-decoration: none;
 }
 
 /****************************** show user donation popup */
 
 .donation-fade {
	 background: rgba(0, 0, 0, 0.65);
	 position: fixed;
	 top: 0;
	 right: 0;
	 bottom: 0;
	 left: 0;
	 outline: 0;
	 z-index: 1001;
	 display: none;
	 overflow-x: hidden;
	 overflow-y: auto;
 }
 
 .donation-dialog {
	 position: relative;
	 margin: 50px auto 0;
	 width: 400px;
	 display: none;
	 -webkit-transform: translate(0, -25%);
	 -ms-transform: translate(0, -25%);
	 -o-transform: translate(0, -25%);
	 transform: translate(0, -25%);
	 transition: transform 0.3s ease-out;
 }
 
 .donation-dialog.in {
	 -webkit-transform: translate(0, 0);
	 -ms-transform: translate(0, 0);
	 -o-transform: translate(0, 0);
	 transform: translate(0, 0);
 }
 
 .donation-close {
	 width: 20px;
	 height: 20px;
	 background: url('../images/sprite.png') -56px -86px no-repeat;
	 left: 19px;
	 top: 26px;
	 cursor: pointer;
	 position: absolute;
 }
 
 .donation-content {
	 min-height: 300px;
	 position: relative;
	 background-color: #fff;
	 box-shadow: 0 1px 10px rgba(0, 0, 0, 0.20);
	 -moz-border-radius: 1px;
	 -webkit-border-radius: 1px;
	 border-radius: 1px;
 }
 
 .donation-header {
	 height: 65px;
	 background: #f0f0f0;
	 padding: 20px;
	 font-size: 28px;
 }
 
 .donation-title {
	 position: relative;
	 top: 50%;
	 transform: translateY(-50%);
	 /*    margin:15px 30px 0 0;*/
 }
 
 /****************************** show friend donation popup */
 
 .donation-friend-fade {
	 background: rgba(0, 0, 0, 0.65);
	 position: fixed;
	 top: 0;
	 right: 0;
	 bottom: 0;
	 left: 0;
	 outline: 0;
	 z-index: 1001;
	 display: none;
	 overflow-x: hidden;
	 overflow-y: auto;
 }
 
 .donation-friend-dialog {
	 position: relative;
	 margin: 50px auto 0;
	 width: 400px;
	 display: none;
	 -webkit-transform: translate(0, -25%);
	 -ms-transform: translate(0, -25%);
	 -o-transform: translate(0, -25%);
	 transform: translate(0, -25%);
	 transition: transform 0.3s ease-out;
 }
 
 .donation-friend-dialog.in {
	 -webkit-transform: translate(0, 0);
	 -ms-transform: translate(0, 0);
	 -o-transform: translate(0, 0);
	 transform: translate(0, 0);
 }
 
 .donation-friend-close {
	 width: 20px;
	 height: 20px;
	 background: url('../images/sprite.png') -56px -86px no-repeat;
	 left: 19px;
	 top: 26px;
	 cursor: pointer;
	 position: absolute;
 }
 
 .donation-friend-content {
	 min-height: 300px;
	 position: relative;
	 background-color: #fff;
	 box-shadow: 0 1px 10px rgba(0, 0, 0, 0.20);
	 -moz-border-radius: 1px;
	 -webkit-border-radius: 1px;
	 border-radius: 1px;
 }
 
 .donation-friend-header {
	 height: 65px;
	 background: #f0f0f0;
	 padding: 20px;
	 font-size: 28px;
 }
 
 .donation-friend-title {
	 position: relative;
	 top: 50%;
	 transform: translateY(-50%);
	 /*    margin:15px 30px 0 0;*/
 }
 
 /****************************** user notify */
 
 .user-notify-list {
	 width: 200px;
	 position: fixed;
	 z-index: 200;
	 background: #fff;
	 bottom: 35px;
	 left: 35px;
	 padding: 10px 15px;
	 box-shadow: 0 1px 10px rgba(0, 0, 0, 0.20);
 }
 
 .user-notify-list ul {
	 list-style: none;
	 font-size: 13px;
	 width: 200px;
	 padding: 0;
	 margin: 0 0 0 0;
	 display: none;
 }
 
 .user-notify-list ul.open {
	 display: block;
 }
 
 .user-notify-list ul li {
	 border-bottom: solid 1px #ededed;
	 padding: 5px 0;
	 position: relative;
 }
 
 .user-notify-list ul li.last {
	 border-bottom: none;
 }
 
 .user-notify-list ul li a {
	 text-decoration: none;
 }
 
 .user-notify-list ul li a:hover {
	 color: var(--primary-color) !important;
 }
 
 .user-notification-switch {
	 margin-top: 5px;
	 cursor: pointer;
	 order: 2;
 }
 
 .user-notification-del {
	 color: #e5e5e5;
	 cursor: pointer;
 }
 
 .user-notification-del:hover {
	 color: #a9a9a9;
 }
 
 /****************************** footer */
 
 .footer {
	 width: 100%;
	 margin: 0 0 0 0;
	 padding: 30px 0 35px 0;
	 text-align: right;
	 background: #f0f0f0;
	 font-size: 16px;
	 display: table;
 }
 
 .footer-content {
	 width: 92%;
	 margin: 0 auto 0 auto;
 }
 
 .footer-menu-title {
	 color: #94999c;
	 text-transform: uppercase;
	 /*letter-spacing:2px; (en)*/
 }
 
 ul.footer-menu {
	 list-style: none;
	 margin: 0 auto 0 auto;
	 padding: 0;
	 display: table;
 }
 
 ul.footer-menu li {
	 float: right;
	 width: 20%;
	 padding: 10px;
 }
 
 .footer-list {
	 width: 33.33% !important;
 }
 
 ul.footer-menu li.edge {
	 margin: 0;
 }
 
 ul.footer-menu-sub {
	 list-style: none;
	 margin: 17px 0 0;
	 padding: 0;
 }
 
 ul.footer-menu-sub li {
	 width: 100%;
	 padding: 0 0 7px;
	 margin: 0;
 }
 
 ul.footer-menu-sub li a {
	 text-decoration: none;
	 color: #000;
 }
 
 .separator {
	 width: 100%;
	 margin: 25px 0;
 }
 
 .support {
	 float: left;
	 margin-top: -10px;
 }
 
 .support-2 {
	 width: 13%;
	 margin-left: auto;
	 text-align: center;
 }
 
 .copyright {
	 float: right;
 }
 
 ul.powered {
	 margin: 3px;
	 padding: 0;
	 list-style: none;
	 margin: 0 auto;
 }
 
 ul.powered li {
	 float: left;
 }
 
 ul.powered li.logo {
	 margin-top: -4px;
	 margin-left: 10px;
 }
 
 .footer-social {
	 margin-top: 16px;
	 display: flex;
	 align-items: center;
	 width: fit-content;
 }
 
 .footer-social-facebook {
	 width: 31px;
	 height: 30px;
	 background: url('../images/sprite.png') 0 0 no-repeat;
	 margin-right: 12px;
	 cursor: pointer;
 }
 
 .footer-social-twitter {
	 width: 31px;
	 height: 30px;
	 background: url('../images/sprite.png') -41px 0 no-repeat;
	 margin-right: 10px;
	 cursor: pointer;
 }
 
 .footer-social-instagram {
	 width: 32px;
	 height: 30px;
	 background: url('../images/sprite.png') -81px 0 no-repeat;
	 margin-right: 12px;
	 cursor: pointer;
 }
 
 /****************************** home */
 
 /* explore section */
 
 .explore-section, .explore-wrapper {
	 width: 100%;
	 margin: 10px 0;
	 padding: 30px 0;
	 display: inline-block;
 }
 
 .explore-wrapper {
	 margin: 0;
	 padding: 0 0 30px 0;
 }
 
 .explore-separator {
	 width: 92%;
	 height: 1px;
	 background: #e5e5e5;
	 margin: 0 auto 0 auto;
 }
 
 .explore-title {}
 
 ul.explore-categories {
	 list-style: none;
	 margin: 28px auto 0 auto;
	 padding: 0;
	 display: table;
 }
 
 .explore-wrapper ul.explore-categories {
	 margin: 15px auto 0 auto;
 }
 
 .explore-categories li {
	 width: 100px;
	 float: right;
	 text-transform: uppercase;
	 text-align: center;
	 font-size: 13px;
	 font-weight: bold;
	 /*letter-spacing:2px; (en)*/
 }
 
 .explore-categories li a {
	 text-decoration: none;
	 color: #000;
 }
 
 .explore-icon {
	 padding: 0 0 10px 0;
 }
 
 .explore-icon img {
	 border-radius: 50%;
 }
 
 ul.explore-filters {
	 list-style: none;
	 margin: 25px auto 0 auto;
	 padding: 0;
	 display: table;
 }
 
 ul.explore-filters:after {
	 clear: both;
 }
 
 ul.explore-filters li {
	 float: right;
	 text-transform: uppercase;
	 text-align: center;
	 font-size: 13px;
	 font-weight: bold;
	 /*letter-spacing:2px; (en)*/
	 padding: 0 35px;
 }
 
 .explore-filters li a {
	 text-decoration: none;
	 color: #000;
 }
 
 /* favorites section */
 
 #favs-section {
	 background: #f0f0f0;
	 padding: 40px 0 45px;
	 position: relative;
	 display: block;
	 direction: ltr;
	 overflow-x: hidden;
 }
 
 .favs-title {}
 
 .favs-area {
	 position: relative;
	 margin-top: 25px;
 }
 
 /* vip section */
 
 #vip-section {
	 background: #f0f0f0;
	 padding: 40px 0 45px;
	 position: relative;
	 display: block;
	 direction: ltr;
 }
 
 .vip-title {}
 
 .vip-area {
	 position: relative;
	 margin-top: 25px;
 }
 
 /* trending section */
 
 #trending-section {
	 background: #f0f0f0;
	 padding: 40px 0 45px;
	 direction: ltr;
 }
 
 .trending-section-titles {
	 margin: 0 auto 0 auto;
	 display: table;
 }
 
 .trending-title, .newest-title, .ending-title {
	 padding: 0 28px 0 28px;
	 cursor: pointer;
	 float: left;
 }
 
 .trending-title.current, .newest-title.current, .ending-title.current {
	 color: #000;
 }
 
 .trending-area, .newest-area, .ending-area {
	 position: relative;
	 margin-top: 25px;
 }
 
 .newest-area, .ending-area {
	 display: none;
 }
 
 /* project slider (favorites, trending, newest, ending) */
 
 .home-project-list, .home-news-list, .report-list-slider, .home-story-list {
	 width: 92%;
	 height: 370px;
	 position: relative;
	 margin: 0 auto 0 auto;
	 display: block;
 }
 
 .home-project-single {
	 width: 326px;
 }
 
 .home-project-double {
	 width: 702px;
 }
 
 .home-project-prev {
	 width: 15px;
	 height: 28px;
	 background: url('../images/sprite.png') -5px -40px no-repeat;
	 position: absolute;
	 left: 0;
	 top: 0;
	 margin-left: -30px;
	 margin-top: 150px;
	 cursor: pointer;
 }
 
 .home-project-next {
	 width: 15px;
	 height: 28px;
	 background: url('../images/sprite.png') -30px -40px no-repeat;
	 position: absolute;
	 right: 0;
	 top: 0;
	 margin-right: -30px;
	 margin-top: 150px;
	 cursor: pointer;
 }
 
 .home-project-slide, .home-news-slide, .report-cell-slide {
	 position: relative;
	 width: 326px;
	 height: 370px !important;
	 background: #fff;
	 margin-right: 30px;
	 overflow: hidden;
	 float: left;
	 cursor: pointer;
 }
 
 .home-project-slide-2 {
	 position: relative;
	 width: 326px;
	 height: 325px !important;
	 background: #fff;
	 margin-right: 49px;
	 overflow: hidden;
	 float: left;
	 cursor: pointer;
 }
 
 .home-news-slide {
	 background: transparent;
 }
 
 .home-project-more a, .home-news-more a {
	 color: #fff;
	 text-decoration: underline;
 }
 
 .home-project-cover, .home-news-cover {
	 height: 326px;
	 position: relative;
	 overflow: hidden;
 }
 
 .home-project-cover img, .home-news-cover img {
	 width: 326px;
 }
 
 .home-project-category {
	 position: absolute;
	 top: 0;
	 right: 0;
	 margin: 0 15px 0 0;
	 z-index: 20;
 }
 
 .home-project-category img {
	 width: 46px;
 }
 
 .home-project-pledge {
	 width: 100%;
	 height: 38px;
	 position: absolute;
	 top: 0;
	 left: 0;
	 margin-top: 196px;
	 z-index: 20;
 }
 
 .home-project-pledge .tooltip .tooltiptext {
	 background: #fff;
	 color: #000;
	 left: 0;
	 margin-top: 5px;
	 min-width: 215px;
 }
 
 .home-project-pledge .stripe {
	 background: #ceceea;
	 width: 100%;
	 text-align: center;
	 clear: both;
 }
 
 .home-project-pledge .stripe .stripe-text {
	 margin-right: 20px;
	 line-height: 32px;
	 height: 32px;
	 float: left;
 }
 
 .home-project-pledge .stripe .stripe-profilepic {
	 width: 34px;
	 height: 34px;
	 float: left;
	 overflow: hidden;
 }
 
 .home-project-pledge .stripe .stripe-profilepic img {
	 max-width: 34px;
 }
 
 .home-project-info, .home-news-info {
	 width: 100%;
	 height: 90px;
	 background: rgba(0, 172, 244, 0.45);
	 position: absolute;
	 bottom: 0;
	 left: 0;
	 color: #fff;
	 z-index: 10;
 }
 
 .home-project-info-title, .home-news-info-title {
	 font-size: 18px;
	 font-weight: bold;
	 text-align: center;
	 padding: 20px 15px;
	 margin: 0 auto 0 auto;
	 display: table;
 }
 
 .home-project-info-description, .home-news-info-description {
	 font-size: 15px;
	 text-align: center;
	 padding: 10px 15px;
	 margin: 0 auto 0 auto;
	 display: none;
 }
 
 .home-project-data {
	 height: 50px;
	 width: 100%;
	 background: #fff;
	 position: absolute;
	 bottom: 0;
	 z-index: 10;
 }
 
 .home-project-progress-stat1 {
	 font-size: 18px;
	 margin: 6px 25px 0 0;
	 float: right;
	 display: none;
	 direction: rtl;
 }
 
 .home-project-progress-stat2 {
	 font-size: 18px;
	 margin: 14px 0 0 35px;
	 float: left;
	 display: none;
	 direction: rtl;
 }
 
 .home-project-progress-stat2:after {
	 clear: both;
 }
 
 .home-project-progress {
	 width: 276px;
	 height: 6px;
	 background: #f0f0f0;
	 bottom: 32px;
	 margin-left: 25px;
	 position: absolute;
 }
 
 .home-project-progress-done {
	 height: 6px;
	 background: var(--primary-color);
	 float: right;
 }
 
 .home-project-progress-done:after {
	 clear: both;
 }
 
 /* sponsors section */
 
 #sponsors-section {
	 width: 90%;
	 margin: 20px auto 0 auto;
	 padding: 20px 0;
	 direction: ltr;
 }
 
 .sponsor {
	 float: left;
 }
 
 .sponsor img {
	 width: 246px;
	 height: 150px;
	 margin: 0 auto 0 auto;
 }
 
 #sponsors-section .slick-track {
	 height: 150px;
 }
 
 #sponsors-section .slick-slide {
	 text-align: center;
 }
 
 #sponsors-section .slick-slide::before {
	 content: '';
	 display: inline-block;
	 height: 100%;
	 vertical-align: middle;
 }
 
 #sponsors-section .slick-slide img {
	 vertical-align: middle;
	 display: inline-block;
 }
 
 .sponsor-prev {
	 width: 15px;
	 height: 28px;
	 background: url('../images/sprite.png') -5px -40px no-repeat;
	 position: absolute;
	 left: 0;
	 top: 0;
	 margin-left: -40px;
	 margin-top: 80px;
	 cursor: pointer;
 }
 
 .sponsor-next {
	 width: 15px;
	 height: 28px;
	 background: url('../images/sprite.png') -30px -40px no-repeat;
	 position: absolute;
	 right: 0;
	 top: 0;
	 margin-right: -40px;
	 margin-top: 80px;
	 cursor: pointer;
 }
 
 /* quotes section */
 
 #quotes-section {
	 width: 100%;
	 padding: 30px 0;
 }
 
 .quote {
	 display: none;
 }
 
 .quote-content {
	 max-width: 75%;
	 margin: 0 auto 20px auto;
	 font-size: 24px;
	 font-weight: 300;
	 line-height: 34px;
	 text-align: center;
 }
 
 .quote-author {
	 margin: 0 auto 0 auto;
	 font-weight: bold;
	 display: table;
 }
 
 .quote-author-org {
	 margin: 0 auto 0 auto;
	 display: table;
 }
 
 /* highlights section */
 
 #highlight-section {
	 margin: 0;
	 overflow: hidden;
	 height: 600px;
	 position: relative;
 }
 
 .highlight {
	 width: 1170px;
	 height: 600px;
	 overflow: hidden;
	 position: absolute;
	 display: none;
 }
 
 .highlight .stretch-width {
	 width: 1170px;
 }
 
 .highlight .stretch-height {
	 height: 600px;
 }
 
 .highlight-dark {
	 width: inherit;
	 height: 600px;
	 /*background:rgba(0, 0, 0, 0.40);*/
	 position: absolute;
	 z-index: 10;
 }
 
 .highlight-message {
	 width: 100%;
	 padding: 0 10px;
	 position: absolute;
	 text-align: center;
	 color: #fff;
	 font-weight: 300;
	 font-size: 36px;
	 top: 45%;
	 z-index: 20;
 }
 
 .highlight-message div {
	 width: 65%;
	 margin: 0 auto 0 auto;
 }
 
 .highlight-more {
	display:none;
	 /*background:var(--primary-color);
	 color:#fff;
	 text-transform:uppercase;
	 font-weight:600;
	 letter-spacing:1px;
	 padding:15px 25px;
	 display:table;
	 cursor:pointer;*/
	 position: relative;
	 bottom: 60px;
	 /* left: 50%; */
	 /* margin-left: -75px; */
	 text-align: center !important;
	 z-index: 20;
	 width: 250px;
	 margin: 0 auto;
	 align-items: center !important;
	 /*-moz-border-radius: 5px;
	 -webkit-border-radius: 5px;
	 border-radius: 5px;*/
 }
 
 .highlight-prev {
	 width: 25px;
	 height: 45px;
	 background: url('../images/sprite.png') -55px -35px no-repeat;
	 position: absolute;
	 color: #fff;
	 left: 50px;
	 top: 50%;
	 cursor: pointer;
	 z-index: 25;
 }
 
 .highlight-next {
	 width: 25px;
	 height: 45px;
	 background: url('../images/sprite.png') -90px -35px no-repeat;
	 position: absolute;
	 color: #fff;
	 right: 50px;
	 top: 50%;
	 cursor: pointer;
	 z-index: 25;
 }
 
 /* stories section */
 
 #stories-section {
	 width: 100%;
	 padding: 15px 0 0;
 }
 
 .home-story-slide {
	 position: relative;
	 width: 326px;
	 height: 370px !important;
	 background: #fff;
	 overflow: hidden;
	 float: right;
	 cursor: pointer;
 }
 
 .home-story-slide.wide-1 {
	 width: 690px;
 }
 
 .home-story-slide.wide {
	 width: 790px;
 }
 
 .home-story-slide.margin {
	 margin-left: 50px;
 }
 
 .home-story-more a {
	 color: #fff;
	 text-decoration: underline;
 }
 
 .home-story-cover {
	 height: 326px;
	 position: relative;
	 overflow: hidden;
 }
 
 .home-story-slide.wide .home-story-cover img {
	 width: 790px;
	 height: auto;
 }
 
 .home-story-cover img {
	 height: 400px;
	 margin: 0 0 0 -100px;
 }
 
 .home-story-category {
	 position: absolute;
	 top: 0;
	 right: 0;
	 margin: 0 15px 0 0;
	 z-index: 20;
 }
 
 .home-story-category img {
	 width: 46px;
 }
 
 .home-story-info {
	 width: 100%;
	 height: 90px;
	 background: rgba(0, 172, 244, 0.45);
	 position: absolute;
	 bottom: 0;
	 left: 0;
	 color: #fff;
	 z-index: 10;
 }
 
 .home-story-info-title {
	 font-size: 18px;
	 font-weight: bold;
	 text-align: center;
	 padding: 20px 15px;
	 margin: 0 auto 0 auto;
	 display: table;
 }
 
 .home-story-info-description {
	 font-size: 16px;
	 text-align: center;
	 padding: 10px 15px;
	 margin: 0 auto 0 auto;
	 display: none;
 }
 
 /****************************** NGO */
 
 .ngo-cover {
	 height: 414px;
	 background-color: #f0f0f0;
	 background-size: cover;
	 background-position: 50% 50%;
	 position: relative;
 }
 
 .ngo-cover-gradient {
	 width: 100%;
	 height: 100%;
	 background: url('../images/cover-gradient.png') 0 0 repeat-x;
	 position: absolute;
 }
 
 .ngo-info {
	 padding: 15px 35px;
	 position: absolute;
	 bottom: 7px;
	 /* margin-right: 46px; */
	 color: #fff;
	 display: flex;
	 justify-content: space-between;
	 align-items: center;
	 gap: 20px;
	 width: 100%;
 
 }
 
 .ngo-profilepic {
	 width: 100px;
	 height: 100%;
	 background: #ddd;
	 padding: 5px;
	 position: relative;
 }
 
 .ngo-profilepic img {
	 width: 100%;
	 height: 100%;
 }
 
 .ngo-tag {
	 margin-left: auto;
 }
 
 .ngo-name {
	 font-size: 34px;
	 font-weight: normal;
	 line-height: 1;
 }
 
 .ngo-location {
	 display: flex;
	 align-items: center;
	 font-size: 16px;
	 position: relative;
 }
 
 .ngo-location .icon-location-light {
	 margin-right: 4px;
 }
 
 /* description block */
 
 .ngo-block {
	 background: #f0f0f0;
	 padding: 35px 40px;
 }
 
 .ngo-desc-block {
	 width: 65%;
	 float: right;
 }
 
 .ngo-desc-title {
	 font-size: 21px;
 }
 
 .ngo-desc-text {
	 font-size: 16px;
	 line-height: 24px;
	 margin: 20px 0 0 0;
	 /* padding: 0 0 0 45px; */
	 position: relative;
 }
 
 .ngo-board-block {
	 width: 35%;
	 float: right;
 }
 
 .ngo-board-wrap {
	 width: 64px;
	 height: 64px;
	 background: #ddd;
	 /* border-radius:50%; */
	 float: right;
	 position: relative;
 }
 
 .ngo-board-wrap img {
	 width: 64px;
	 height: 64px;
	 background: #ddd;
	 /* border-radius:50%; */
 }
 
 ul.ngo-board-info {
	 list-style: none;
	 float: right;
	 margin: 0px 25px 0 0;
	 padding: 0;
 }
 
 ul.ngo-board-info li {
	 padding: 0 0 2px 0;
 }
 
 ul.ngo-board-info.edit {
	 margin: 2px 25px 0 0;
 }
 
 .ngo-contact {
	 display: flex;
	 align-items: center;
	 gap: 10px;
	 float: left;
 }
 
 .ngo-contact a {
	 font-size: 16px;
	 color: var(--primary-color);
	 text-decoration: none;
 }
 
 /* board edit mode */
 
 .ngo-board-cell {
	 margin-bottom: 15px;
	 position: relative;
 }
 
 .ngo-board-cell-extra {
	 text-align: center;
	 padding: 10px 0 0;
	 position: relative;
 }
  
.en .ngo-board-cell-extra {
	padding: 25px 0 0;
}
 .ngo-board-del {
	 position: absolute;
	 width: 21px;
	 height: 21px;
	 background: url('../images/sprite.png') -161px -86px no-repeat;
	 left: 10px;
	 top: 0;
	 cursor: pointer;
	 filter: var(--primary-filter);
 }
 
 .ngo-board-add {
	 text-align: center;
	 font-size: 45px;
	 font-weight: bold;
	 color: var(--primary-color);
	 margin: 0 auto;
	 display: table;
	 cursor: pointer;
 }
 
 .ngo-board-add span {
	 font-size: 16px;
	 font-weight: 600;
	 margin-top: -15px;
	 display: table;
 }
 
 /* section tabs */
 
 .ngo-tabs-block {
	 width: 91%;
 }
 
 ul.ngo-tabs {
	 list-style: none;
	 margin: 0;
	 padding: 0;
	 float: right;
 }
 
 ul.ngo-tabs li {
	 font-weight: bold;
	 /*letter-spacing:3px;*/
	 text-transform: uppercase;
	 float: right;
	 padding: 20px 0 17px 0;
	 margin: 0 0 0 40px;
	 cursor: pointer;
 }
 
 ul.ngo-tabs li.current {
	 color: var(--primary-color);
	 border-bottom: solid 3px var(--primary-color);
 }
 
 .ngo-social {
	 /*letter-spacing:1px;*/
	 padding: 20px 0 0;
	 float: left;
	 position: relative;
 }
 
 .ngo-social a {
	 text-decoration: none;
 }
 
 .ngo-links {
	 float: right;
	 margin: -3px 0 0 12px;
 }
 
 .ngo-facebook {
	 width: 32px;
	 height: 34px;
	 background: url('../images/sprite.png') 0 -195px no-repeat;
	 margin-right: 5px;
	 cursor: pointer;
 }
 
 .ngo-twitter {
	 width: 32px;
	 height: 34px;
	 background: url('../images/sprite.png') -40px -195px no-repeat;
	 margin-right: 5px;
	 cursor: pointer;
 }
 
 .ngo-instagram {
	 width: 32px;
	 height: 34px;
	 background: url('../images/sprite.png') -81px -195px no-repeat;
	 cursor: pointer;
 }
 
 .ngo-linkedin {
	 width: 39px;
	 height: 34px;
	 background: url('../images/sprite.png') -118px -195px no-repeat;
	 cursor: pointer;
 }
 
 .ngo-facebook a, .ngo-twitter a, .ngo-instagram a, .ngo-linkedin a {
	 display: block;
	 width: 31px;
	 height: 32px;
 }
 
 .ngo-details {
	 width: 100%;
	 margin: 0 0 0 0;
	 position: relative;
 }
 
 .ngo-details .no-results {
	 width: 100%;
	 background: var(--no-result-bg);
	 padding: 50px 0;
	 font-size: 18px;
	 text-align: center;
	 display: table;
 }
 
 /* ngo summary */
 
 /* ngo gallery */
 
 #ngo-detail-gallery {
	 padding: 15px 0 15px 0;
	 display: none;
	 position: relative;
 }
 
 .ngo-active-projects {
	 background-color: #f0f0f0;
	 padding: 40px 0 0 0;
	 margin: 10px 0 0 0;
 }
 
 .ngo-complete-projects {
	 background-color: #f0f0f0;
	 padding: 40px 0 0 0;
	 margin: 0 0 0 0;
	 direction: ltr;
 }
 
 .ngo-active-projects .search-project-progress {
	 background: #fff;
 }
 
 /* ngo followers */
 
 #ngo-detail-followers {
	 padding: 15px 0 15px 0;
	 display: none;
 }
 
 .ngo-followers {
	 width: 94%;
	 margin: 0 auto 0 auto;
	 position: relative;
 }
 
 .ngo-follower {
	 padding: 25px 25px;
 }
 
 .ngo-follower-slide {
	 position: relative;
 }
 
 .ngo-follower-pic {
	 width: 70px;
	 height: 70px;
	 margin: 5px 0 0 20px;
	 background: #f0f0fa;
	 border-radius: 50%;
	 float: right;
 }
 
 .ngo-follower-pic img {
	 width: 70px;
	 height: 70px;
	 /* border-radius: 50%; */
	 float: right;
 }
 
 .ngo-follower a {
	 color: #000;
	 text-decoration: none;
 }
 
 .ngo-follower-details {
	 width: 650px;
	 float: right;
 }
 
 .ngo-follower-title {
	 font-size: 16px;
	 font-weight: 600;
	 margin-bottom: 5px;
 }
 
 /* contact popup */
 
 .contact-fade {
	 background: rgba(0, 0, 0, 0.65);
	 position: fixed;
	 top: 0;
	 right: 0;
	 bottom: 0;
	 left: 0;
	 outline: 0;
	 z-index: 1001;
	 display: none;
	 overflow-x: hidden;
	 overflow-y: auto;
 }
 
 .contact-dialog {
	 position: relative;
	 margin: 50px auto 0;
	 width: 800px;
	 display: none;
	 -webkit-transform: translate(0, -25%);
	 -ms-transform: translate(0, -25%);
	 -o-transform: translate(0, -25%);
	 transform: translate(0, -25%);
	 transition: transform 0.3s ease-out;
 }
 
 .contact-dialog.in {
	 -webkit-transform: translate(0, 0);
	 -ms-transform: translate(0, 0);
	 -o-transform: translate(0, 0);
	 transform: translate(0, 0);
 }
 
 .contact-close {
	 width: 20px;
	 height: 20px;
	 background: url('../images/sprite.png') -56px -86px no-repeat;
	 left: 19px;
	 top: 26px;
	 cursor: pointer;
	 position: absolute;
 }
 
 .contact-content {
	 min-height: 300px;
	 position: relative;
	 background-color: #fff;
	 box-shadow: 0 1px 10px rgba(0, 0, 0, 0.20);
	 -moz-border-radius: 1px;
	 -webkit-border-radius: 1px;
	 border-radius: 1px;
 }
 
 .contact-header {
	 height: 65px;
	 background: #f0f0f0;
	 padding: 20px;
	 font-size: 28px;
 }
 
 .contact-title {
	 margin: 15px 30px 0 0;
 }
 
 .contact-details {
	 padding: 46px 50px 50px;
 }
 
 .contact-field {
	 margin: 5px 0;
 }
 
 .contact-button, .contact-back {
	 margin: 10px auto 0 auto;
 }
 
 .contact-field input[type=text], .contact-field select {
	 width: 325px;
	 border: none;
	 font-size: 15px;
	 border: solid 1px #cccccc;
	 padding: 10px;
	 border-radius: 3px;
 }
 
 .contact-field textarea {
	 width: 700px;
	 border: solid 1px #cccccc;
	 border-radius: 3px;
 }
 
 .contact-field.field-full input[type=text] {
	 width: 700px;
 }
 
 .contact-field.field-half input[type=text], .contact-field.field-half select {
	 width: 325px;
 }
 
 .contact-field.space {
	 padding-left: 50px;
 }
 
 .contact-confirm {
	 width: 450px;
	 margin: 0 auto 0 auto;
	 text-align: center;
	 display: none;
 }
 
 .contact-label {
	 color: black;
	 margin: 5px 0;
	 font-size: 15px;
 }
 
 /****************************** user */
 
 .user-cover {
	 height: 414px;
	 background-color: #f0f0f0;
	 background-size: cover;
	 background-position: 50% 50%;
	 position: relative;
 }
 
 .user-cover-gradient {
	 width: 100%;
	 height: 100%;
	 background: url('../images/cover-gradient.png') 0 0 repeat-x;
	 position: absolute;
 }
 
 .user-info {
	 padding: 10px 0 20px;
	 position: absolute;
	 bottom: 3px;
	 margin-right: 46px;
	 color: #fff;
 }
 
 .user-profilepic {
	 width: 90px;
	 height: 90px;
	 float: right;
	 background: #ddd;
	 /* border-radius:50%; */
	 position: relative;
 }
 
 .user-profilepic img {
	 width: 90px;
	 height: 90px;
	 /* border-radius:50%; */
 }
 
 .user-tag {
	 float: right;
	 margin-right: 20px;
 }
 
 .user-name {
	 font-size: 34px;
	 font-weight: normal;
	 padding: 6px 0;
 }
 
 .user-location {
	 display: flex;
	 align-items: center;
	 font-size: 16px;
 }
 
 .user-location .icon-location-light {
	 margin-right: 4px;
 }
 
 /* description block */
 
 .user-block {
	 background: #f0f0f0;
	 padding: 35px 40px;
 }
 
 .user-bio-block {
	 background: #f0f0f0;
	 padding: 35px 40px;
	 display: flex;
 }
 
 .user-followers-block {
	 width: 35%;
 }
 
 .user-desc-block {
	 width: 65%;
 }
 
 .user-desc-title {
	 font-size: 21px;
 }
 
 .user-desc-text {
	 font-size: 16px;
	 line-height: 24px;
	 margin: 20px 0 0 0;
	 padding: 0 0 0 45px;
	 position: relative;
 }
 
 /* section tabs */
 
 .user-tabs-block {
	 width: 91%;
 }
 
 ul.user-tabs {
	 list-style: none;
	 margin: 0;
	 padding: 0;
	 float: right;
 }
 
 ul.user-tabs li {
	 font-weight: bold;
	 letter-spacing: 0px;
	 text-transform: uppercase;
	 display: inline-block;
	 padding: 20px 0 17px 0;
	 margin: 0 0 0 40px;
	 cursor: pointer;
 }
 
 ul.user-tabs li.current {
	 color: var(--primary-color);
	 border-bottom: solid 3px var(--primary-color);
 }
 
 .user-social {
	 letter-spacing: 1px;
	 padding: 20px 0 0;
	 float: left;
	 position: relative;
 }
 
 .user-social a {
	 text-decoration: none;
 }
 
 .user-links {
	 float: right;
	 margin: -3px 0 0 12px;
 }
 
 .user-facebook {
	 width: 31px;
	 height: 34px;
	 background: url('../images/sprite.png') 0 -195px no-repeat;
	 margin-right: 5px;
	 cursor: pointer;
 }
 
 .user-twitter {
	 width: 32px;
	 height: 34px;
	 background: url('../images/sprite.png') -40px -195px no-repeat;
	 margin-right: 5px;
	 cursor: pointer;
 }
 
 .user-instagram {
	 width: 32px;
	 height: 34px;
	 background: url('../images/sprite.png') -81px -195px no-repeat;
	 cursor: pointer;
 }
 
 .user-linkedin {
	 width: 39px;
	 height: 34px;
	 background: url('../images/sprite.png') -118px -195px no-repeat;
	 cursor: pointer;
 }
 
 .user-facebook a, .user-twitter a, .user-instagram a, .user-linkedin a {
	 display: block;
	 width: 31px;
	 height: 32px;
 }
 
 .user-details {
	 width: 100%;
	 margin: 0 0 0 0;
	 position: relative;
 }
 
 .user-details .no-results {
	 width: 100%;
	 background: var(--no-result-bg);
	 padding: 50px 0;
	 font-size: 18px;
	 text-align: center;
	 display: table;
 }
 
 /* user summary */
 
 .user-social-graph {
	 width: 100%;
	 padding: 25px 0 20px;
	 font-size: 20px;
 }
 
 .user-social-graph .title-grey {
	 margin-right: 30px;
 }
 
 .user-social-graph .category {
	 padding: 10px 30px;
 }
 
 .user-social-graph .category-row {
	 cursor: pointer;
 }
 
 .user-social-graph .category-count {
	 width: 40px;
	 height: 40px;
	 float: right;
	 color: #000;
	 font-size: 22px;
	 text-align: center;
	 line-height: 40px;
	 /* border-radius:50%; */
	 margin: 0 0 0 15px;
 }
 
 .user-social-graph .category-details {
	 margin: 15px 65px 0;
	 display: none;
 }
 
 .user-social-graph .category-project {
	 padding: 15px 0 20px;
 }
 
 .user-social-graph .category-project-units {
	 font-weight: bold;
	 font-size: 30px;
	 margin: 0 4px;
 }
 
 .user-social-graph .category-project-ngo {
	 float: left;
	 margin-top: 10px;
	 font-size: 18px;
 }
 
 .user-social-graph .category-project-ngo-title {
	 float: left;
	 width: 200px;
	 margin-top: 18px;
 }
 
 .user-social-graph .category-project-ngo-title a {
	 text-decoration: none;
 }
 
 .user-social-graph .category-project-ngo-pic {
	 width: 75px;
	 height: 75px;
	 /* border-radius:50%; */
	 float: left;
	 margin-left: 25px;
 }
 
 .user-social-graph .category-project-more {
	 text-decoration: none;
	 border-bottom: solid 1px #ddd;
 }
 
 .user-social-graph .social-tabs {
	 display: inline-block;
 }
 
 .user-social-graph .social-tabs a {
	 text-decoration: none;
	 font-size: 16px;
 }
 
 .user-social-graph #social-tab-graph {
	 position: relative;
 }
 
 .user-social-graph #social-tab-list {
	 display: none;
	 min-height: 400px;
 }
 
 #social-tab-list-vip .category-project {
	 padding-right: 30px;
	 padding-left: 95px;
 }
 
 /* recent activity */
 
 .user-activity-list {
	 width: 90%;
	 position: relative;
	 margin: 15px auto 0;
	 display: block;
 }
 
 .user-activity {
	 width: 100px;
	 /* float: left; */
	 margin: 0 25px;
	 position: relative;
	 cursor: pointer;
	 display: inline-block;
 }
 
 .user-activity-pic {
	 /* width: 100px; */
	 /* border-radius:50%; */
	 overflow: hidden;
 }
 
 .user-activity-pic img {
	 height: 100px;
 }
 
 .user-activity-follow, .user-activity-donate, .user-activity-comment {
	 width: 52px;
	 height: 52px;
	 background: #fff;
	 /* border-radius:50%; */
	 border: solid 1px #cecece;
	 top: 0;
	 left: 0;
	 margin: 60px 0 0 -7px;
	 position: absolute;
	 cursor: pointer;
 }
 .en .user-activity-follow, .en .user-activity-donate, .en .user-activity-comment{
	left: unset;
 }
 
 .user-activity-follow .user-activity-icon {
	 width: 25px;
	 height: 25px;
	 background: url('../images/sprite.png') -223px -138px no-repeat;
	 margin: 13px auto;
 }
 
 .user-activity-follow:hover .user-activity-icon {
	 background: url('../images/sprite.png') -258px -138px no-repeat;
 }
 
 .user-activity-donate .user-activity-icon {
	 width: 13px;
	 height: 25px;
	 background: url('../images/sprite.png') -176px -170px no-repeat;
	 margin: 14px 0 0 19px;
 }
 
 .user-activity-donate:hover .user-activity-icon {
	 width: 13px;
	 height: 25px;
	 background: url('../images/sprite.png') -154px -170px no-repeat;
	 margin: 14px 0 0 19px;
 }
 
 .user-activity-comment .user-activity-icon {
	 width: 20px;
	 height: 20px;
	 background: url('../images/sprite.png') -228px -172px no-repeat;
	 margin: 17px 0 0 16px;
 }
 
 .user-activity-comment:hover .user-activity-icon {
	 width: 20px;
	 height: 20px;
	 background: url('../images/sprite.png') -198px -172px no-repeat;
	 margin: 17px 0 0 16px;
 }
 

 .user-activity-details {
    display: flex;
    flex-direction: column;
    justify-content: space-between; 
    margin-left: 15px;
	margin-top: 15px;
    flex-grow: 1;
    min-height: 70px;
	text-align: center;
}

.user-activity-name {
	font-weight: bold;
    margin-bottom: 5px;
	font-size: 16px;
	color: #000000;
	/* height:13px !important; */
}

.user-activity-date {
    font-size: 18px;
    color: #888;
    margin-top: auto;
}


 .user-activity-info {
	 width: 115px;
	 background: #fff;
	 font-size: 11px;
	 padding: 4px 5px;
	 bottom: -12px;
	 left: -10px;
	 border-radius: 6px;
	 position: absolute;
	 display: none;
	 z-index: 5;
	 -webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.35);
	 -moz-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.35);
	 box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.35);
 }
 
 .user-activity-follow:hover .user-activity-info, .user-activity-donate:hover .user-activity-info, .user-activity-comment:hover .user-activity-info {
	 display: block;
 }
 
 .user-activity-prev {
	 width: 15px;
	 height: 28px;
	 background: url('../images/sprite.png') -5px -40px no-repeat;
	 position: absolute;
	 left: 0;
	 top: 0;
	 margin-left: -40px;
	 margin-top: 40px;
	 cursor: pointer;
 }
 
 .user-activity-next {
	 width: 15px;
	 height: 28px;
	 background: url('../images/sprite.png') -30px -40px no-repeat;
	 position: absolute;
	 right: 0;
	 top: 0;
	 margin-right: -40px;
	 margin-top: 40px;
	 cursor: pointer;
 }
 
 .user-supported-projects {
	 background-color: #f0f0f0;
	 padding: 40px 0 0 0;
	 margin: 10px 0 0 0;
	 /*     direction:ltr; */
 }
 
 .user-supported-projects .home-project-progress {
	 margin-left: 0px;
	 margin-right: 25px;
 }
 
 /* user following */
 
 #user-detail-following {
	 padding: 10px 0 15px 0;
	 display: none;
	 position: relative;
 }
 
 ul.user-following-tabs {
	 list-style: none;
	 width: 91%;
	 padding: 0;
 }
 
 ul.user-following-tabs li {
	 font-weight: normal;
	 letter-spacing: 0px;
	 text-transform: uppercase;
	 float: right;
	 padding: 5px 0 10px 0;
	 margin: 0 0 0 40px;
	 cursor: pointer;
 }
 
 ul.user-following-tabs li.current {
	 color: var(--primary-color);
	 border-bottom: solid 2px var(--primary-color);
 }
 
 .user-following-usr, .user-following-cmp, .user-following-ngo {
	 display: none;
 }
 
 /* user followers */
 
 #user-detail-followers {
	 padding: 15px 0 15px 0;
	 display: none;
 }
 
 .user-followers {
	 width: 94%;
	 margin: 0 auto 0 auto;
	 position: relative;
 }
 
 .user-follower {
	 padding: 25px 25px;
 }
 
 .user-follower-slide {
	 position: relative;
 }
 
 .user-follower-pic {
	 width: 70px;
	 height: 70px;
	 margin: 5px 0 0 20px;
	 background: #f0f0fa;
	 /* border-radius: 50%; */
	 overflow: hidden;
	 float: right;
 }
 
 .user-follower-pic img {
	 height: 70px;
	 /*border-radius: 50%;*/
	 float: right;
 }
 
 .user-follower a {
	 color: #000;
	 text-decoration: none;
 }
 
 .user-follower-details {
	 width: 650px;
	 float: right;
 }
 
 .user-follower-title {
	 font-size: 16px;
	 font-weight: 600;
	 margin-bottom: 5px;
 }
 
 .user-follower-more {
	 margin-top: 10px;
 }
 
 .user-follower-more a {
	 border-bottom: solid 1px #ddd;
 }
 
 .user-edit {
	 position: absolute;
	 bottom: 0;
	 left: 0;
	 margin-bottom: 20px;
	 margin-left: 44px;
	 z-index: 20;
	 background: var(--primary-color);
	 color: #fff;
	 text-transform: uppercase;
	 font-size: 18px !important;
	 display: table;
	 cursor: pointer;
	 border: none;
	 -moz-border-radius: 5px;
	 -webkit-border-radius: 5px;
	 border-radius: 5px;
 }
 
 /****************************** project */
 
 .project-block {
	 background: #f0f0f0;
	 padding: 45px 40px 35px;
	 position: relative;
 }
 
 .project-block-left {
	 width: 695px;
	 float: right;
 }
 
 .project-block-right {
	 width: 350px;
	 float: left;
	 margin-right: 35px;
 }
 
 .project-block .separator-line1 {
	 margin: 17px 0;
 }
 
 .project-category {
	 position: absolute;
	 top: 0;
 }
 
 .project-category-icon {
	 float: right;
	 width: 100%;
 }
 
 .project-category-icon img {
	 width: 45px;
 }
 
 .project-cover-upload {
	 text-align: center;
	 bottom: 10px;
	 left: 50%;
	 margin-left: -100px;
	 padding: 4px;
	 position: absolute;
	 display: table;
 }
 
 .project-category-name {
	 float: right;
	 font-size: 16px;
	 margin: 11px 11px 0 0;
 }
 
 .project-cover {
	 width: 695px;
	 height: 400px;
	 background-size: cover;
	 background-position: 50% 50%;
	 margin: 0 0 15px 0;
	 /*    margin:-12px 0 20px 0;*/
	 position: relative;
	 display: inline-block;
 }
 
 .project-cover img {
	 width: 765px;
 }
 
 .project-name {
	 font-size: 24px;
	 font-weight: normal;
 }
 
 .project-location .icon-location-light {
	 margin-right: 4px;
 }
 
 .project-desc {
	 font-size: 16px;
	 line-height: 24px;
	 margin: 20px 0 0 0;
	 padding: 0 0 0 45px;
	 position: relative;
 }
 
 .project-ngo {
	 gap: 20px;
 }
 
 .project-ngo a:hover {
	 color: var(--primary-color);
 }
 
 .project-ngo-pic {
	 width: 52px;
	 height: 52px;
 }
 
 .project-progress {
	 width: 350px;
	 height: 6px;
	 background: #ffffff;
	 margin: 10px 0 0 0;
 }
 
 .project-progress-done {
	 height: 6px;
	 background: var(--primary-color);
	 float: right;
 }
 
 .project-donors ul {
	 list-style: none;
	 margin: 0;
	 padding: 0;
 }
 
 .project-donors ul li {
	 float: right;
	 text-align: center;
 }
 
 .project-company .project-company-pic {
	 margin-top: -13px;
	 float: left;
 }
 
 .project-pledge-contribute {
	 background-color: #f0f0f0;
	 padding: 5px;
	 margin: 0 auto;
	 width: 790px;
	 font-size: 15px;
 }
 
 #main-project .project-pledge-contribute {
	 padding: 10px 40px 10px;
	 width: 100%;
	 font-size: 18px;
 }
 
 .search-projects .project-pledge-contribute {
	 width: 655px;
	 margin-top: 10px;
 }
 
 .project-pledge-contribute .block {
	 width: 31%;
	 float: right;
	 text-align: center;
 }
 
 .project-pledge-contribute .separator {
	 background: #cccfd4;
	 width: 2px;
	 height: 45px;
	 margin: 5px;
	 float: right;
 }
 
 .project-pledge-contribute .project-pledge-company {
	 width: 75px;
 }
 
 .project-pledge {
	 background-color: #fff;
	 padding-top: 15px;
 }
 
 .project-pledge .project-pledge-company {
	 width: 65px;
	 float: right;
	 margin-left: 15px;
	 margin-right: 15px;
 }
 
 .project-pledge .project-pledge-company {
	 width: 65px;
 }
 
 /* section tabs */
 
 .project-tabs-block {
	 width: 91%;
 }
 
 ul.project-tabs {
	 list-style: none;
	 margin: 0;
	 padding: 0;
	 float: right;
 }
 
 ul.project-tabs li {
	 font-weight: bold;
	 /*letter-spacing:3px;*/
	 text-transform: uppercase;
	 padding: 20px 0 17px 0;
	 margin: 0 0 0 45px;
	 cursor: pointer;
	 display: inline-block;
 }
 
 ul.project-tabs li.current {
	 color: var(--primary-color);
	 border-bottom: solid 3px var(--primary-color);
 }
 
 .project-social {
	 letter-spacing: 1px;
	 padding: 20px 0 0;
	 float: right;
	 /**/
	 position: relative;
 }
 
 .project-details {
	 width: 100%;
	 margin: 0 0 0 0;
	 position: relative;
 }
 
 .project-details .no-results {
	 width: 100%;
	 background: var(--no-result-bg);
	 padding: 50px 0;
	 font-size: 18px;
	 text-align: center;
	 display: table;
 }
 
 .project-detail-block {
	 padding: 0 50px 0 0;
 }
 
 .project-detail-block-sdg {
	 padding: 0;
 }
 
 .project-detail-text {
	 font-size: 16px;
	 line-height: 24px;
	 margin: 5px 0;
 }
 
 /* project summary */
 
 #project-detail-summary {
	 /*    padding:25px 0 20px 0;   */
	 padding: 15px 0 15px 0;
	 width: 66%;
	 float: right;
 }
 
 /* project summary */
 
 #project-detail-summary-sdg {
	 padding: 25px 0 20px 0;
	 width: 66%;
	 float: right;
 }
 
 /* project updates */
 
 #project-detail-updates {
	 padding: 15px 0 15px 0;
	 width: 66%;
	 /*    width:100%;*/
	 float: right;
	 display: none;
 }
 
 .project-update-list {
	 padding: 0 50px 0 50px;
 }
 
 .project-update-cell .title {
	 margin: 6px 0;
 }
 
 .project-update-cell {
	 background: url('../images/bullet2.png') 0 0 no-repeat;
	 background-position: 0 3px;
	 background-position: 100% .4em;
	 padding: 0 50px 0 0;
	 position: relative;
 }
 
 .project-update-pic {
	 max-width: 670px !important;
	 margin-top: 5px;
	 width: 100%;
 }
 
 /* project comments */
 
 #project-detail-comments {
	 padding: 15px 50px 15px 50px;
	 width: 66%;
	 /*    width:100%;*/
	 float: right;
	 display: none;
 }
 
 .project-comment {
	 padding: 25px 25px;
 }
 
 .project-comment.reply {
	 background: #f0f0f0;
	 padding: 25px 25px;
	 margin-right: 110px;
	 display: flex;
 }
 
 .project-comment-pic {
	 width: 100px;
	 height: auto;
	 margin: 5px 0 0 20px;
	 background: #f0f0fa;
	 /* border-radius: 50%; */
	 float: right;
 }
 
 .project-comment-pic img {
	 width: 70px;
	 /* border-radius: 50%; */
	 float: right;
 }
 
 .project-comment-details {
	 width: auto;
	 float: right;
 }
 
 .project-comment-details.reply {
	 width: 520px;
	 float: right;
 }
 
 .project-comment-title {
	 font-size: 16px;
	 font-weight: 600;
	 margin-bottom: 5px;
	 margin-top: 25px;
 }
 
 .project-comment-entry {
	 background: #f0f0f0;
	 padding: 50px;
 }
 
 .project-comment-entry textarea {
	 width: 100%;
	 border: none;
 }
 
 .project-comment-reply {
	 margin-top: 5px;
 }
 
 .project-comment-reply textarea {
	 width: 100%;
	 padding: 5px;
	 border: solid 1px #dddddd;
	 margin-bottom: 5px;
 }
 
 .project-comment-footer {
	 margin-top: 5px;
 }
 
 .project-comment-footer .link {
	 margin-right: 10px;
 }
 
 /* project followers */
 
 #project-detail-followers {
	 padding: 15px 50px 15px 50px;
	 /*    width:100%;*/
	 width: 66%;
	 float: right;
	 display: none;
 }
 
 .project-followers {
	 width: 94%;
	 margin: 0 auto 0 auto;
	 position: relative;
 }
 
 .project-follower-slide {
	 position: relative;
 }
 
 .project-follower-pic {
	 width: 70px;
	 height: auto;
	 margin: 20px 0 5px 20px;
	 background: #f0f0fa;
	 float: right;
 }
 
 .project-follower-pic img {
	 width: 70px;
	 float: right;
 }
 
 .project-follower a {
	 color: #000;
	 text-decoration: none;
 }
 
 .project-follower-title {
	 font-size: 16px;
	 font-weight: 600;
	 margin-bottom: 5px;
 }
 
 .project-follower-more {
	 margin-top: 10px;
 }
 
 .project-follower-more a {
	 border-bottom: solid 1px #ddd;
 }
 
 /* project flag dialog */
 
 .project-flag {
	 margin: 20px 0 10px 0;
	 cursor: pointer;
 }
 
 .reporting-icon {
	 width: 20px !important;
	 height: 20px;
	 max-width: unset !important;
 }
 
 .project-flag-icon {
	 width: 20px;
	 height: 20px;
	 background: url('../images/sprite.png') -222px -86px no-repeat;
	 filter: var(--primary-filter);
 }
 
 .project-flag-label {
	 font-size: 13px;
	 color: var(--primary-color);
	 margin: 1px 14px 0 0;
 }
 
 /* project contribution options */
 
 #project-detail-options {
	 float: left;
	 /*    width:350px;*/
	 width: 33%;
	 margin-top: 25px;
 }
 
 .project-sim-option {
	 min-height: 50px;
	 padding: 10px 20px 20px;
	 border: solid 1px #dddddd;
	 font-size: 16px;
	 cursor: pointer;
 }
 
 .project-sim-option:hover {
	 border: solid 1px #ff993c;
 }
 
 .project-sim-option .option-cost {
	 font-size: 26px;
	 font-weight: bold;
	 margin-bottom: 4px;
	 float: right;
 }
 
 .project-sim-option .option-cost-category {
	 width: 25px;
	 margin: 10px 5px 0 0;
	 float: right;
 }
 
 .project-sim-option .option-cost-category img {
	 width: 25px;
	 border-radius: 50%;
 }
 
 /****************************** project new */
 
 .project-fade {
	 background: rgba(0, 0, 0, 0.65);
	 position: fixed;
	 top: 0;
	 right: 0;
	 bottom: 0;
	 left: 0;
	 outline: 0;
	 z-index: 1001;
	 display: none;
	 overflow-x: hidden;
	 overflow-y: auto;
 }
 
 .project-dialog {
	 position: relative;
	 margin: 50px auto 0;
	 width: 800px;
	 display: none;
	 -webkit-transform: translate(0, -25%);
	 -ms-transform: translate(0, -25%);
	 -o-transform: translate(0, -25%);
	 transform: translate(0, -25%);
	 transition: transform 0.3s ease-out;
 }
 
 .project-dialog.in {
	 -webkit-transform: translate(0, 0);
	 -ms-transform: translate(0, 0);
	 -o-transform: translate(0, 0);
	 transform: translate(0, 0);
 }
 
 .project-close {
	 width: 20px;
	 height: 20px;
	 background: url('../images/sprite.png') -56px -86px no-repeat;
	 left: 19px;
	 top: 26px;
	 cursor: pointer;
	 position: absolute;
 }
 
 .project-content {
	 min-height: 300px;
	 position: relative;
	 background-color: #fff;
	 box-shadow: 0 1px 10px rgba(0, 0, 0, 0.20);
	 -moz-border-radius: 1px;
	 -webkit-border-radius: 1px;
	 border-radius: 1px;
 }
 
 .project-header {
	 min-height: 65px;
	 background: #f0f0f0;
	 padding: 20px;
	 font-size: 28px;
 }
 
 .project-title {
	 margin: 15px 30px 0 0;
 }
 
 .project-new1, .project-new2, .project-edit {
	 padding: 36px 50px 50px;
 }
 
 .project-field {
	 margin: 15px 0;
	 font-size: 15px;
 }
 
 .project-button, .project-back {
	 margin: 10px auto 0 auto;
 }
 
 .project-field input[type=text], .project-field select {
	 border: none;
	 border-bottom: solid 1px #cccccc;
	 padding: 5px 0;
	 font-size: 15px;
 }
 
 .project-field.field-full input[type=text] {
	 width: 700px;
 }
 
 .project-field.field-half input[type=text], .project-field.field-half select {
	 /*    width:325px;*/
	 width: 150px;
 }
 
 .project-field.field-half-clipped input[type=text] {
	 /*    width:318px;*/
 }
 
 .project-field.field-third input[type=text], .project-field.field-fourth input[type=text] {
	 width: 150px;
 }
 
 .project-field select {
	 color: #a9a9a9;
 }
 
 .project-field option {
	 color: #000000;
 }
 
 .project-option-label {
	 margin-left: 25px;
 }
 
 .project-field.space {
	 padding-left: 50px;
 }
 
 .project-confirm {
	 width: 350px;
	 padding: 46px 50px 50px;
	 margin: 0 auto 0 auto;
	 text-align: center;
	 display: none;
 }
 
 .project-new2 {
	 display: none;
 }
 
 .project-guidelines {
	 margin: 25px 0 20px 0;
	 padding: 0;
	 list-style: none;
 }
 
 .project-guidelines li {
	 padding: 0 0 15px 0;
	 margin: 0 35px 0 0;
	 background: url('../images/bullet1.png') 0 3px no-repeat;
	 background-position: 100% .4em;
	 text-indent: 30px;
 }
 
 .project-terms {
	 width: 100%;
	 height: 225px;
	 background-color: #f0f0f0;
	 margin: 20px 0;
	 padding: 12px 15px;
	 border: none;
	 overflow-y: scroll;
 }
 
 /****************************** project_vip new */
 
 .project_vip-fade, .project_main-fade, .project_vip-stages-fade {
	 background: rgba(0, 0, 0, 0.65);
	 position: fixed;
	 top: 0;
	 right: 0;
	 bottom: 0;
	 left: 0;
	 outline: 0;
	 z-index: 1001;
	 display: none;
	 overflow-x: hidden;
	 overflow-y: auto;
 }
 
 .project_vip-dialog, .project_vip-main-dialog {
	 position: relative;
	 margin: 50px auto 0;
	 width: 800px;
	 display: none;
	 -webkit-transform: translate(0, -25%);
	 -ms-transform: translate(0, -25%);
	 -o-transform: translate(0, -25%);
	 transform: translate(0, -25%);
	 transition: transform 0.3s ease-out;
 }
 
 .project_vip-dialog.in, .project_vip-main-dialog.in {
	 -webkit-transform: translate(0, 0);
	 -ms-transform: translate(0, 0);
	 -o-transform: translate(0, 0);
	 transform: translate(0, 0);
 }
 
 .project_vip-close {
	 width: 20px;
	 height: 20px;
	 background: url('../images/sprite.png') -56px -86px no-repeat;
	 left: 19px;
	 top: 26px;
	 cursor: pointer;
	 position: absolute;
 }
 
 .project_vip-content {
	 min-height: 300px;
	 position: relative;
	 background-color: #fff;
	 box-shadow: 0 1px 10px rgba(0, 0, 0, 0.20);
	 -moz-border-radius: 1px;
	 -webkit-border-radius: 1px;
	 border-radius: 1px;
 }
 
 .project_vip-header {
	 min-height: 65px;
	 background: #f0f0f0;
	 padding: 20px;
	 font-size: 28px;
 }
 
 .project_vip-title {
	 margin: 15px 30px 0 0;
 }
 
 .project_vip-field {
	 margin: 15px 0;
	 font-size: 15px;
 }
 
 .project_vip-button, .project_vip-back {
	 margin: 10px auto 0 auto;
 }
 
 .project_vip-field input[type=text], .project_vip-field select {
	 border: none;
	 border-bottom: solid 1px #cccccc;
	 padding: 5px 0;
	 font-size: 15px;
 }
 
 .project_vip-field.field-full input[type=text] {
	 width: 700px;
 }
 
 .project_vip-field.field-half input[type=text], .project_vip-field.field-half select {
	 width: 150px;
 }
 
 .project_vip-field.field-half-clipped input[type=text] {
	 width: 318px;
 }
 
 .project_vip-field.field-third input[type=text], .project_vip-field.field-fourth input[type=text] {
	 /*    width:150px;*/
	 width: 50px;
 }
 
 .project_vip-field select {
	 color: #a9a9a9;
 }
 
 .project_vip-field option {
	 color: #000000;
 }
 
 .project_vip-option-label {
	 margin-left: 25px;
 }
 
 .project_vip-field.space {
	 padding-left: 50px;
 }

 .en .project_vip-field.space {
	padding-left: 0px !important;
 }

	.project_vip-field.field-third.description {
		padding-left: 0px !important;
	}
 
 .project_vip-confirm {
	 width: 350px;
	 padding: 46px 50px 50px;
	 margin: 0 auto 0 auto;
	 text-align: center;
	 display: none;
 }
 
 .project_vip-2 {
	 display: none;
 }
 
 .project_vip-guidelines {
	 margin: 25px 0 20px 0;
	 padding: 0;
	 list-style: none;
 }
 
 .project_vip-guidelines li {
	 padding: 0 0 15px 0;
	 margin: 0 35px 0 0;
	 background: url('../images/bullet1.png') 0 3px no-repeat;
	 background-position: 100% .4em;
	 text-indent: 30px;
 }
 
 .project_vip-terms {
	 width: 100%;
	 height: 225px;
	 background-color: #f0f0f0;
	 margin: 20px 0;
	 padding: 12px 15px;
	 border: none;
	 overflow-y: scroll;
 }
 
 /****************************** payment (popup) */
 
 .payment-fade {
	 background: rgba(0, 0, 0, 0.65);
	 position: fixed;
	 top: 0;
	 right: 0;
	 bottom: 0;
	 left: 0;
	 outline: 0;
	 z-index: 1001;
	 display: none;
	 overflow-x: hidden;
	 overflow-y: auto;
 }
 
 .payment-dialog {
	 position: relative;
	 margin: 50px auto 0;
	 width: 800px;
	 display: none;
	 -webkit-transform: translate(0, -25%);
	 -ms-transform: translate(0, -25%);
	 -o-transform: translate(0, -25%);
	 transform: translate(0, -25%);
	 transition: transform 0.3s ease-out;
 }
 
 .payment-dialog.in {
	 -webkit-transform: translate(0, 0);
	 -ms-transform: translate(0, 0);
	 -o-transform: translate(0, 0);
	 transform: translate(0, 0);
 }
 
 .payment-close {
	 width: 20px;
	 height: 20px;
	 background: url('../images/sprite.png') -56px -86px no-repeat;
	 left: 19px;
	 top: 26px;
	 cursor: pointer;
	 position: absolute;
 }
 
 .payment-content {
	 min-height: 300px;
	 position: relative;
	 background-color: #fff;
	 box-shadow: 0 1px 10px rgba(0, 0, 0, 0.20);
	 -moz-border-radius: 1px;
	 -webkit-border-radius: 1px;
	 border-radius: 1px;
 }
 
 .payment-header {
	 height: 65px;
	 background: #f0f0f0;
	 padding: 20px;
	 font-size: 28px;
 }
 
 .payment-title {
	 margin: 15px 30px 0 0;
 }
 
 .payment-details {
	 padding: 46px 50px 50px;
 }
 
 .payment-field {
	 margin: 15px 0;
 }
 
 .payment-button {
	 margin: 10px auto 0 auto;
 }
 
 .payment-field input[type=text] {
	 width: 325px;
	 border: none;
	 border-bottom: solid 1px #cccccc;
	 padding: 5px 0;
	 font-size: 15px;
 }
 
 .payment-field.field-full input[type=text] {
	 width: 700px;
 }
 
 .payment-field.field-half input[type=text], .payment-field.field-half select {
	 width: 325px;
 }
 
 .payment-field.space {
	 padding-left: 50px;
 }
 
 .payment-confirm {
	 width: 450px;
	 padding: 46px 50px 50px;
	 margin: 0 auto 0 auto;
	 text-align: center;
	 display: none;
 }
 
 .payment-label {
	 color: #a9a9a9;
	 margin: 5px 0;
	 font-size: 15px;
 }
 
 .wpwl-form {
	 direction: ltr !important;
 }
 
 /****************************** follow (ngo) */
 
 .follow-block {
	 position: absolute;
	 left: 4%;
	 bottom: 8%;
	 cursor: pointer;
	 color: #ffffff;
	 text-transform: uppercase;
	 font-size: 16px;
	 font-weight: bold;
 }
 
 .project-contribute .follow-block {
	 position: relative;
	 left: inherit;
	 bottom: inherit;
	 margin: 19px 45px 0 0;
	 color: #a1a1a8;
	 float: right;
 }
 
 .follow-block .follow-text {
	 float: right;
	 /*letter-spacing:1px; (en)*/
	 margin: 0 12px 0 0;
 }
 
 .follow-block .icon-follow {
	 float: right;
 }
 
 /****************************** impact (ngo) */
 
 .impact-list, .report-list {
	 width: 100%;
	 margin: 10px auto 0 auto;
	 padding: 15px 0;
	 display: table;
 }
 
 .impact-cell, .impact-cell2 {
	 width: 25%;
	 text-align: center;
	 padding: 15px 0;
	 position: relative;
	 display: inline-block;
 }
 
 .impact-figure, .report-year {
	 font-size: 20px;
	 font-weight: bold;
 }
 
 .impact-description {
	 font-size: 15px;
	 padding: 5px 50px;
 }
 
 .impact-separator {
	 position: absolute;
	 height: 100%;
	 width: 1px;
	 top: 0;
	 left: 0;
	 background: #e5e5e5;
 }
 
 /* edit mode */
 
 .impact-figure-edit {
	 width: 190px;
	 height: 47px;
	 font-size: 30px;
	 font-weight: bold;
	 text-align: center;
	 border: solid 2px #d8d8e0;
 }
 
 .impact-description-edit {
	 width: 190px;
	 height: 30px;
	 font-size: 18px;
	 border: solid 2px #d8d8e0;
 }
 
 .impact-cell-extra {
	 width: 25%;
	 text-align: center;
	 padding: 15px 0;
	 position: relative;
	 float: right;
 }
 
 .impact-del {
	 position: absolute;
	 width: 21px;
	 height: 21px;
	 background: url('../images/sprite.png') -161px -86px no-repeat;
	 left: 10px;
	 top: 0;
	 cursor: pointer;
 }
 
 .impact-add {
	 text-align: center;
	 font-size: 45px;
	 font-weight: bold;
	 color: var(--primary-color);
	 margin: 0 auto;
	 display: table;
	 cursor: pointer;
 }
 
 .impact-add span {
	 font-size: 16px;
	 font-weight: 600;
	 margin-top: -15px;
	 display: table;
 }
 
 /****************************** impact text section (ngo) */
 
 .impact-text-section {
	 width: 100%;
	 margin: 10px auto 0 auto;
	 padding: 15px 0;
	 display: table;
 }
 
 /****************************** graph (user) */
 
 .social-graph-canvas {
	 position: relative;
	 width: 450px;
	 margin: 0 auto;
 }
 
 .graph-project {
	 width: 98px;
	 height: 98px;
	 background: #fff;
	 border-radius: 40%;
	 position: absolute;
	 top: 0;
	 left: 0;
	 box-sizing: border-box;
	 color: #fff;
	 text-align: center;
	 font-size: 15px;
	 cursor: pointer;
	 display: block;
 }
 
 .graph-project.clicked {
	 border: solid 4px #333;
	 border-color: rgba(0, 0, 0, 0.20);
 }
 
 .graph-project.clicked div {
	 margin-top: -2px;
 }
 
 .graph-project .count {
	 font-size: 32px;
	 line-height: 20px;
	 padding-top: 4px;
 }
 
 .graph-project .graph-action {
	 width: 70px;
	 margin: 4px auto 3px;
	 line-height: 18px;
	 min-height: 28px;
 }
 
 .graph-project-details {
	 width: 350px;
	 position: absolute;
	 top: 50px;
	 right: 10px;
	 font-size: 18px;
 }
 
 .graph-instructions {
	 position: absolute;
	 left: 50%;
	 margin-top: 20px;
	 margin-left: -82px;
 }
 
 .graph-project-details a {
	 text-decoration: none;
 }
 
 .graph-ngo-pic {
	 width: 75px;
	 height: 75px;
	 /* border-radius:50%; */
	 float: right;
	 margin-left: 20px;
 }
 
 /****************************** gallery (ngo) */
 
 .sdg {
	 height: 150px;
	 margin: 10px 10px 10px 0;
	 position: relative;
	 float: right;
 }
 
 .sdg img {
	 height: 100px;
 }
 
 .photo-cell {
	 width: 250px;
	 height: 250px;
	 margin: 10px 10px;
	 position: relative;
	 float: right;
 }
 
 .project-details .photo-cell {
	 height: auto;
	 width: auto;
	 max-width: 670px;
	 margin: 10px 0 10px 20px;
 }
 
 .photo-wrap {
	 width: 250px;
	 height: 250px;
	 overflow: hidden;
	 position: relative;
 }
 
 .photo-wrap img {
	 max-height: 250px;
	 position: absolute;
 }
 
 .project-details img {
	 max-width: 670px;
	 width: 100%;
 }
 .project-follower-pic img{
	 width: 70px;
	 height: 70px;
 }
 
 .photo-cell .photo-del {
	 position: absolute;
	 width: 21px;
	 height: 21px;
	 background: url('../images/sprite.png') -161px -86px no-repeat;
	 left: -10px;
	 top: -10px;
	 cursor: pointer;
	 filter: var(--primary-filter);
 }
 
 /****************************** flag project */
 
 .flag-fade {
	 background: rgba(0, 0, 0, 0.65);
	 position: fixed;
	 top: 0;
	 right: 0;
	 bottom: 0;
	 left: 0;
	 outline: 0;
	 z-index: 1001;
	 display: none;
	 overflow-x: hidden;
	 overflow-y: auto;
 }
 
 .flag-dialog {
	 position: relative;
	 margin: 50px auto 0;
	 width: 800px;
	 display: none;
	 -webkit-transform: translate(0, -25%);
	 -ms-transform: translate(0, -25%);
	 -o-transform: translate(0, -25%);
	 transform: translate(0, -25%);
	 transition: transform 0.3s ease-out;
 }
 
 .flag-dialog.in {
	 -webkit-transform: translate(0, 0);
	 -ms-transform: translate(0, 0);
	 -o-transform: translate(0, 0);
	 transform: translate(0, 0);
 }
 
 .flag-close {
	 width: 20px;
	 height: 20px;
	 background: url('../images/sprite.png') -56px -86px no-repeat;
	 left: 19px;
	 top: 26px;
	 cursor: pointer;
	 position: absolute;
 }
 
 .flag-content {
	 min-height: 300px;
	 position: relative;
	 background-color: #fff;
	 box-shadow: 0 1px 10px rgba(0, 0, 0, 0.20);
	 -moz-border-radius: 1px;
	 -webkit-border-radius: 1px;
	 border-radius: 1px;
 }
 
 .flag-header {
	 min-height: 65px;
	 background: #f0f0f0;
	 padding: 20px;
	 font-size: 18px;
 }
 
 .flag-title {
	 margin: 0px;
	 width: 95%;
 }
 
 .flag-details {
	 padding: 36px 50px 50px;
 }
 
 .flag-field {
	 margin: 15px 0;
	 font-size: 15px;
 }
 
 .flag-button {
	 margin: 10px auto 0 auto;
 }
 
 .flag-field textarea {
	 border: none;
	 padding: 15px 15px;
	 font-size: 15px;
	 border: solid 1px #9e9c9c;
 }
 
 .flag-field.field-full textarea {
	 width: 670px;
 }
 
 .flag-field.space {
	 padding-left: 50px;
 }
 
 .flag-confirm {
	 width: 80%;
	 margin: 20px auto;
	 text-align: center;
	 display: none;
 }
 
 .flag-details input[type=radio] {
	 margin-right: 0;
 }
 
 #flag-other {
	 display: none;
 }
 
 /****************************** flag comment */
 
 .flag-comment-fade {
	 background: rgba(0, 0, 0, 0.65);
	 position: fixed;
	 top: 0;
	 right: 0;
	 bottom: 0;
	 left: 0;
	 outline: 0;
	 z-index: 1001;
	 display: none;
	 overflow-x: hidden;
	 overflow-y: auto;
 }
 
 .flag-comment-dialog {
	 position: relative;
	 margin: 50px auto 0;
	 width: 800px;
	 display: none;
	 -webkit-transform: translate(0, -25%);
	 -ms-transform: translate(0, -25%);
	 -o-transform: translate(0, -25%);
	 transform: translate(0, -25%);
	 transition: transform 0.3s ease-out;
 }
 
 .flag-comment-dialog.in {
	 -webkit-transform: translate(0, 0);
	 -ms-transform: translate(0, 0);
	 -o-transform: translate(0, 0);
	 transform: translate(0, 0);
 }
 
 .flag-comment-close {
	 width: 20px;
	 height: 20px;
	 background: url('../images/sprite.png') -56px -86px no-repeat;
	 left: 19px;
	 top: 26px;
	 cursor: pointer;
	 position: absolute;
 }
 
 .flag-comment-content {
	 min-height: 300px;
	 position: relative;
	 background-color: #fff;
	 box-shadow: 0 1px 10px rgba(0, 0, 0, 0.20);
	 -moz-border-radius: 1px;
	 -webkit-border-radius: 1px;
	 border-radius: 1px;
 }
 
 .flag-comment-header {
	 height: 65px;
	 background: #f0f0f0;
	 padding: 20px;
	 font-size: 28px;
 }
 
 .flag-comment-title {
	 margin: 15px 30px 0 0;
 }
 
 .flag-comment-details {
	 padding: 36px 50px 50px;
 }
 
 .flag-comment-field {
	 margin: 15px 0;
	 font-size: 15px;
 }
 
 .flag-comment-button {
	 margin: 10px auto 0 auto;
 }
 
 .flag-comment-field textarea {
	 background: #f0f0f0;
	 border: none;
	 padding: 15px 15px;
	 font-size: 15px;
 }
 
 .flag-comment-field.field-full textarea {
	 width: 670px;
 }
 
 .flag-comment-field.space {
	 padding-left: 50px;
 }
 
 .flag-comment-confirm {
	 width: 350px;
	 padding: 46px 50px 50px;
	 margin: 0 auto 0 auto;
	 text-align: center;
	 display: none;
 }
 
 .flag-comment-details input[type=radio] {
	 margin-right: 0;
 }
 
 #flag-comment-other {
	 display: none;
 }
 
 /****************************** login */
 
 .signup-link {
	 cursor: pointer;
	 color: var(--primary-color);
 }
 
 .main_login_back {
	 color: var(--primary-color);
	 text-decoration: none;
 }
 
 .signin-container {
	 width: 100%;
	 margin: 0 0 15px 0;
	 padding: 40px 0 45px 0;
	 background: #f0f0f0;
	 display: table;
 }
 
 .sigin-col {
	 width: 50%;
	 display: inline-block;
 }
 
 .signin-button {
	 margin: 10px auto 0 auto;
	 width: 100%;
	 /* padding: 0 0 4px; */
	 font-size: 20px;
	 -webkit-appearance: none;
	 text-decoration: none;
 }
 
 .signin-button:hover {
	 color: #fff !important;
 }
 
 .new-account-button {
	 width: 325.33px;
	 height: 33.33px;
 }
 
 .signin-facebook {
	 margin: 10px auto 0 auto;
	 width: 100%;
	 padding: 0 0 4px;
	 font-size: 20px;
	 background: #3b5998;
 }
 
 .signin-facebook:hover {
	 background: #3b5998;
 }
 
 .signin-field {
	 margin: 0 0 6px 0;
 }
 
 .signin-field input[type=text], .signin-field input[type=password] {
	 width: 325px;
	 background: none;
	 border: none;
	 padding: 6px;
	 margin: 0 0 0 0;
	 font-size: 15px;
	 text-indent: 25px;
	 color: #6c6c70;
 }
 
 .signin-field input[type=password] {
	 padding-right: 25px;
	 text-indent: 10px;
 }
 
 .backto_signup-user {
	 cursor: pointer;
 }
 
 .signin-field-group {
	 margin: 15px 0 0 0;
	 display: table;
 }
 
 .signin-field-group .signin-field {
	 float: left;
 }
 
 .signin-field-group:after {
	 clear: both;
 }
 
 .signin-forgot {
	 text-align: left;
	 font-size: 15px;
 }
 
 .signin-forgot a {
	 text-decoration: none;
	 color: var(--primary-color);
 }
 
 .signin-username-icon {
	 width: 20px;
	 height: 16px;
	 background: url('../images/sprite.png') 0 -88px no-repeat;
 }
 
 .signin-password-icon {
	 width: 17px;
	 height: 21px;
	 background: url('../images/sprite.png') -30px -85px no-repeat;
 }
 
 .signin-invalid, .password-request-invalid {
	 text-align: center;
	 color: #ee2e24;
	 margin: 10px 0 0 0;
 }
 
 .password-request-confirm, .password-reset-confirm {
	 text-align: center;
	 margin: 10px 0 0 0;
 }
 
 .block-third {
	 width: 45%;
	 padding: 0 0 0 0;
	 float: right;
	 margin-right: 3.5%;
 }
 
 .block-content {
	 padding: 0 25px;
 }
 
 /* main register popup */
 
 .register-main-fade {
	 background: rgba(0, 0, 0, 0.65);
	 position: fixed;
	 top: 0;
	 right: 0;
	 bottom: 0;
	 left: 0;
	 outline: 0;
	 z-index: 1001;
	 display: none;
	 overflow-x: hidden;
	 overflow-y: auto;
 }
 
 .register-main-dialog {
	 position: relative;
	 margin: 50px auto 0;
	 width: 800px;
	 display: none;
	 -webkit-transform: translate(0, -25%);
	 -ms-transform: translate(0, -25%);
	 -o-transform: translate(0, -25%);
	 transform: translate(0, -25%);
	 transition: transform 0.3s ease-out;
 }
 
 .register-main-dialog.in {
	 -webkit-transform: translate(0, 0);
	 -ms-transform: translate(0, 0);
	 -o-transform: translate(0, 0);
	 transform: translate(0, 0);
 }
 
 .register-main-close {
	 width: 20px;
	 height: 20px;
	 background: url('../images/sprite.png') -56px -86px no-repeat;
	 left: 19px;
	 top: 26px;
	 cursor: pointer;
	 position: absolute;
 }
 
 .register-main-content {
	 min-height: 500px;
	 position: relative;
	 background-color: #fff;
	 box-shadow: 0 1px 10px rgba(0, 0, 0, 0.20);
	 -moz-border-radius: 1px;
	 -webkit-border-radius: 1px;
	 border-radius: 1px;
 }
 
 .register-img {
	 width: 50px;
	 height: auto;
	 display: block;
	 margin: auto;
 }
 
 .dialog-footer {
	 width: 100%;
	 text-align: center;
	 direction: ltr;
	 display: block;
 }
 
 .register-main-header {
	 height: 65px;
	 background: #f0f0f0;
	 padding: 20px;
	 font-size: 28px;
 }
 
 .register-main-title {
	 margin: 15px 30px 0 0;
 }
 
 .middle-vertical-align {
	 position: relative;
	 top: 60%;
 }
 
 .popup-main-title {
	 position: relative;
	 top: 50%;
	 transform: translateY(-50%);
	 float: right;
	 font-weight: 600;
 }
 .popup-main-title.title-en {
	float: left!important;
	
}

.edit-image-close.close-en, .edit-image-close-preview.close-en, .edit-image-close-coverpic_facebook.close-en {
    right: 19px;
	left: auto!important;
}
 .register-main-confirm {
	 width: 450px;
	 padding: 46px 50px 50px;
	 margin: 0 auto 0 auto;
	 text-align: center;
	 display: none;
 }
 
 /* register popup */
 
 .register-fade {
	 background: rgba(0, 0, 0, 0.65);
	 position: fixed;
	 top: 0;
	 right: 0;
	 bottom: 0;
	 left: 0;
	 outline: 0;
	 z-index: 1001;
	 display: none;
	 overflow-x: hidden;
	 overflow-y: auto;
 }
 
 .register-dialog {
	 position: relative;
	 margin: 50px auto 0;
	 width: 800px;
	 display: none;
	 -webkit-transform: translate(0, -25%);
	 -ms-transform: translate(0, -25%);
	 -o-transform: translate(0, -25%);
	 transform: translate(0, -25%);
	 transition: transform 0.3s ease-out;
 }
 
 .register-dialog.in {
	 -webkit-transform: translate(0, 0);
	 -ms-transform: translate(0, 0);
	 -o-transform: translate(0, 0);
	 transform: translate(0, 0);
 }
 
 .register-close {
	 width: 20px;
	 height: 20px;
	 background: url('../images/sprite.png') -56px -86px no-repeat;
	 left: 19px;
	 top: 26px;
	 cursor: pointer;
	 position: absolute;
 }
 
 .register-content {
	 position: relative;
	 background-color: #fff;
	 box-shadow: 0 1px 10px rgba(0, 0, 0, 0.20);
	 -moz-border-radius: 1px;
	 -webkit-border-radius: 1px;
	 border-radius: 1px;
 }
 
 .register-header {
	 height: 65px;
	 background: #f0f0f0;
	 padding: 20px;
	 font-size: 28px;
 }
 
 .register-title {
	 margin: 15px 30px 0 0;
 }
 
 .register-title-ngo {
	 margin: 15px 30px 0 0;
 }
 
 .register-details {
	 padding: 46px 50px 50px;
 }
 
 .register-field {
	 margin: 15px 0;
 }
 
 .register-button, .register-back {
	 margin: 10px auto 0 auto;
 }
 
 .register-field input[type=text], .register-field input[type=password], .register-field select {
	 width: 150px;
	 border: none;
	 border-bottom: solid 1px #cccccc;
	 padding: 5px 0;
	 font-size: 15px;
 }
 
 .register-field.space {
	 padding-left: 50px;
 }
 
 .field-width {
	 width: 47%;
	 margin: 15px 1.5%;
 }
 
 .register-confirm {
	 width: 450px;
	 padding: 46px 50px 50px;
	 margin: 0 auto 0 auto;
	 text-align: center;
	 display: none;
 }
 
 /* pledge popup */
 
 .pledge-fade {
	 background: rgba(0, 0, 0, 0.65);
	 position: fixed;
	 top: 0;
	 right: 0;
	 bottom: 0;
	 left: 0;
	 outline: 0;
	 z-index: 1001;
	 display: none;
	 overflow-x: hidden;
	 overflow-y: auto;
 }
 
 .pledge-dialog {
	 position: relative;
	 margin: 250px auto 0;
	 width: 200px;
	 display: none;
	 -webkit-transform: translate(0, -25%);
	 -ms-transform: translate(0, -25%);
	 -o-transform: translate(0, -25%);
	 transform: translate(0, -25%);
	 transition: transform 0.3s ease-out;
 }
 
 .pledge-dialog.in {
	 -webkit-transform: translate(0, 0);
	 -ms-transform: translate(0, 0);
	 -o-transform: translate(0, 0);
	 transform: translate(0, 0);
 }
 
 .pledge-close {
	 left: 12px;
	 top: 12px;
	 cursor: pointer;
	 position: absolute;
	 font-size: 14px;
	 line-height: 14px;
	 color: #ff9e19;
 }
 
 .pledge-content {
	 position: relative;
	 background-color: #f0f0f0;
	 padding: 10px;
	 box-shadow: 0 1px 10px rgba(0, 0, 0, 0.20);
	 -moz-border-radius: 10px;
	 -webkit-border-radius: 10px;
	 border-radius: 10px;
 }
 
 .pledge-title {
	 text-align: center;
	 margin-top: 10px;
	 padding: 10px 0;
	 font-size: 18px;
	 font-weight: 400;
 }
 
 .pledge-logo {
	 text-align: center;
	 margin: 8px 0;
 }
 
 .pledge-logo img {
	 width: 65px;
 }
 
 .pledge-details {
	 text-align: center;
	 padding: 10px 0;
	 font-size: 18px;
	 font-weight: 400;
 }
 
 /****************************** contribute */
 
 .contribute-container {
	 width: 920px;
 }
 
 .report-container-grey {
	 width: 1170px;
	 margin: 0 auto;
	 padding: 10px 0 10px 0;
	 background: #f0f0f0;
	 display: table;
 }
 
 .contribute-container-grey {
	 width: 790px;
	 margin: 0 auto;
	 padding: 10px 0 10px 0;
	 background: #f0f0f0;
	 display: table;
 }
 
 .contribute-container-grey .search-project-progress {
	 background: #fff;
 }
 
 .contribute-container input[type=text] {
	 width: 100px;
	 padding: 5px 0;
	 font-size: 32px;
	 text-align: center;
 }
 
 .contribute-container .project-sim-option {
	 width: 225px;
	 padding: 10px 15px 20px 15px;
 }
 
 .contribute-container .project-sim-option.padded {
	 margin: 0 15px;
 }
 
 .contribute-container .project-sim-option.dark {
	 background-color: #f0f0f0;
 }
 
 .contribute-container .option-cost-category {
	 width: 25px;
	 margin: 10px 5px 0 0;
	 float: right;
 }
 
 .contribute-container .option-cost-category img {
	 width: 25px;
	 border-radius: 50%;
 }
 
 .contribute-container-grey .search-project-details {
	 margin-top: 5px;
 }
 
 .contribute-container-grey .search-project-cover {
	 width: 245px;
	 height: 140px;
 }
 
 .contribute-container-grey .search-project-cover img {
	 width: 245px;
	 height: 140px;
	 margin: 0 0 0 0;
	 padding-right: 10px;
 }
 
 .contribute-container .contribute-currency {
	 font-size: 15px;
 }
 
 .contribute-value, .contribute-voucher {
	 padding: 6px 12px 12px;
	 margin: 0 auto 20px;
	 border: solid 2px #feb877;
	 display: table;
 }
 
 .contribute-voucher {
	 padding-top: 8px;
 }
 
 .contribute-value input[type=text], .contribute-voucher input[type=text] {
	 width: 75px;
	 padding: 0;
	 color: #585859;
	 font-size: 28px;
	 border: none;
	 border-bottom: dashed 2px #d9d9e8;
 }
 
 .contribute-voucher input[type=text] {
	 width: 130px;
	 font-size: 18px;
 }
 
 .contribute-voucher input[type=text]::-webkit-input-placeholder {
	 color: #d9d9e8;
 }
 
 .contribute-value #contribute_voucher {
	 width: 130px;
 }
 
 .contribute-tabs-block {
	 width: 85%;
 }
 
 ul.contribute-tabs {
	 list-style: none;
	 margin: 10px 0 0;
	 padding: 0;
	 float: right;
 }
 
 ul.contribute-tabs li {
	 font-weight: bold;
	 /*letter-spacing:3px;*/
	 text-transform: uppercase;
	 float: right;
	 padding: 20px 0 17px 0;
	 margin: 0 0 0 40px;
	 cursor: pointer;
 }
 
 ul.contribute-tabs li.current {
	 color: var(--primary-color);
	 border-bottom: solid 3px var(--primary-color);
 }
 
 ul.contribute-tabs li.last {
	 margin: 0;
 }
 
 /* contribute button */
 
 .contribute-button-fly {
	 width: 130px;
	 position: fixed;
	 z-index: 200;
	 bottom: 35px;
	 left: 175px;
	 padding: 10px 15px;
	 box-shadow: 0 1px 10px rgba(0, 0, 0, 0.20);
 }
 
 /****************************** pay share */
 
 .payshare-container, .payshare-container-grey {
	 width: 100%;
	 margin: 0 0 15px 0;
	 padding: 5px 0 5px 0;
	 display: table;
 }
 
 .payshare-container-grey {
	 width: 100%;
	 margin: 0 0 15px 0;
	 padding: 5px 0 5px 0;
	 background: #f0f0f0;
	 display: table;
 }
 
 .payshare-container .search-user, .payshare-container-grey .search-project {
	 margin: 0 auto;
	 padding: 40px 50px;
 }
 
 .payshare-container-grey .search-project-progress {
	 background: #fff;
 }
 
 /****************************** search */
 
 .search-container {
	 width: 100%;
	 margin: 0 0 15px 0;
	 padding: 40px 0 45px 0;
	 background: #f0f0f0;
	 display: table;
 }
 
 .search-container input {
	 width: 500px;
	 border: none;
	 border-bottom: solid 1px #bfbfc7;
	 background: none;
	 padding: 4px 20px;
	 font-size: 20px;
	 color: #000;
 }
 
 .search-input {
	 position: relative;
	 margin: 30px auto 30px auto;
 }
 
 .search-summary {
	 font-size: 17px;
	 color: #93969b;
 }
 
 .search-summary span {
	 color: #000;
 }
 
 .search-summary a {
	 text-decoration: none;
 }
 
 .search-results {
	 min-height: 80px;
	 position: relative;
 }
 
 /* search projects */
 
 .search-projects {
	 /*    width:755px; */
	 width: 100%;
	 margin: 0 auto 0 auto;
	 padding: 0 0 5px;
	 position: relative;
 }
 
 .search-projects-sign {
	 position: absolute;
	 margin-right: 150px;
	 padding-right: 35px;
	 right: -150px;
	 top: 40px;
	 font-size: 24px;
 }
 
 .search-projects-sign span {
	 margin-top: 8px;
	 font-size: 16px;
	 display: table;
 }
 
 .search-vip-projects-sign {
	 position: absolute;
	 margin-right: 150px;
	 padding-right: 35px;
	 right: -150px;
	 top: 40px;
	 font-size: 24px;
	 max-width: 220px;
 }
 
 .search-vip-projects-sign span {
	 margin-top: 8px;
	 font-size: 16px;
	 display: table;
 }
 
 .search-project {
	 padding: 40px 50px;
 }
 
 .search-project-slide {
	 position: relative;
 }
 
 .search-project-cover {
	 width: 204px;
	 height: 204px;
	 margin: 5px 0 0 50px;
	 position: relative;
	 float: right;
	 overflow: hidden;
 }
 
 .search-project a {
	 color: #000;
	 text-decoration: none;
 }
 
 .search-project-category {
	 position: absolute;
	 top: 0;
	 right: 0;
	 margin: 5px 15px 0 0;
	 z-index: 20;
 }
 
 .search-project-category img {
	 width: 46px;
 }
 
 .search-project-pledge {
	 width: 45px;
	 height: 45px;
	 position: absolute;
	 top: 0;
	 left: 0;
	 margin: 5px 0 0 5px;
	 z-index: 20;
 }
 
 .search-project-pledge .tooltip .tooltiptext {
	 background: #000;
	 color: #fff;
	 left: 0;
	 margin-top: 5px;
	 min-width: 215px;
 }
 
 .search-project-details {
	 width: 500px;
	 float: right;
 }
 
 .search-project-title {
	 font-size: 20px;
	 font-weight: bold;
	 margin-bottom: 10px;
	 line-height: 1.5;
 }
 
 .search-project-title a {
	 text-decoration: none;
 }
 
 .search-project-data {
	 height: 50px;
	 width: 100%;
	 z-index: 10;
 }
 
 .search-project-progress-stat1 {
	 font-size: 18px;
	 margin: 7px 0 0 0;
	 float: right;
 }
 
 .search-project-progress-stat2 {
	 font-size: 18px;
	 margin: 10px 0 0 0;
	 float: left;
 }
 
 .search-project-progress-stat2:after {
	 clear: both;
 }
 
 .search-project-progress {
	 width: 400px;
	 height: 6px;
	 background: #f0f0f0;
	 margin: 18px 0 0 0;
 }
 
 .search-project-progress-done {
	 height: 6px;
	 background: var(--primary-color);
	 float: right;
 }
 
 .search-project-progress-done:after {
	 clear: both;
 }
 
 .search-project-ngo {
	 display: flex;
	 align-items: center;
	 gap: 15px;
	 font-size: 16px;
	 margin: 7px 0 0 0;
 }
 
 .search-project-ngo-name {
	 float: right;
 }
 
 .search-project-ngo-pic {
	 width: 40px;
	 /* border-radius: 50%; */
	 float: right;
 }
 
 /* search ngo */
 
 .search-ngos {
	 width: 100%;
	 margin: 0 auto 0 auto;
	 padding: 0 0 5px;
	 position: relative;
 }
 
 .search-ngos-sign {
	 margin-right: 150px;
	 padding-right: 35px;
	 position: absolute;
	 right: -150px;
	 top: 40px;
	 font-size: 24px;
 }
 
 .search-ngos-sign span {
	 margin-top: 8px;
	 font-size: 16px;
	 display: table;
 }
 
 .search-ngo {
	 padding: 40px 50px 60px 50px;
 }
 
 .search-ngo-slide {
	 position: relative;
	 margin-right: 150px;
	 padding-right: 35px;
 }
 
 .search-ngo-cover {
	 width: 140px;
	 height: 140px;
	 margin: 5px 0 0 20px;
	 position: relative;
	 float: right;
	 overflow: hidden;
 }
 
 .search-ngo a {
	 color: #000;
	 text-decoration: none;
 }
 
 .search-ngo-details {
	 width: 60%;
	 float: right;
	 margin-right: 10px;
	 margin-top: 20px;
 }
 
 .search-ngo-title {
	 font-size: 20px;
	 font-weight: bold;
	 margin-bottom: 15px;
 }
 
 .search-ngo-location {
	 margin: 0 0 10px;
	 font-size: 18px;
	 display: table;
 }
 
 .nog-text {
	 line-height: 30px;
	 font-size: 15px;
 }
 
 /* search user */
 
 .search-users {
	 width: 755px;
	 margin: 0 auto 0 auto;
	 padding: 0 0 5px;
	 position: relative;
 }
 
 .search-users-sign {
	 position: absolute;
	 right: -150px;
	 top: 40px;
	 font-size: 24px;
 }
 
 .search-users-sign span {
	 margin-top: 8px;
	 font-size: 16px;
	 display: table;
 }
 
 .search-user {
	 padding: 40px 50px;
	 padding-right: 30px;
 }
 
 .search-user-slide {
	 position: relative;
 }
 
 .search-user-pic {
	 width: 140px;
	 height: 140px;
	 margin: 5px 0 0 20px;
	 background: #f0f0fa;
	 /* border-radius: 50%; */
	 float: right;
 }
 
 .search-user-pic img {
    width: 140px;
    height: 140px;
	 /* border-radius: 50%; */
	 float: right;
 }
 
 .search-user a {
	 color: #000;
	 text-decoration: none;
 }
 
 .search-user-details {
	 width: 520px;
	 float: right;
 }
 
 .search-user-title {
	 font-size: 20px;
	 font-weight: bold;
	 margin-block: 10px;
 }
 
 /****************************** explore, leaderboard */
 
 .explore-inner-container {
	 width: 100%;
	 margin: 0 0 15px 0;
	 padding: 40px 0 40px 0;
	 background: #f0f0f0;
	 display: table;
 }
 
 ul.explore-inner-categories {
	 list-style: none;
	 margin: 40px auto 25px auto;
	 padding: 0;
	 display: table;
 }
 
 .explore-inner-wrapper ul.explore-inner-categories {
	 margin: 15px auto 0 auto;
 }
 
 .explore-inner-categories li {
	 width: 70px;
	 float: right;
	 text-align: center;
	 font-size: 13px;
	 letter-spacing: 0px;
 }
 
 .explore-inner-categories li a {
	 text-decoration: none;
	 color: #fff;
 }
 
 .explore-inner-categories li span {
	 text-decoration: none;
	 color: #fff;
 }
 
 .explore-inner-icon {
	 width: 50px;
	 height: 50px;
 }
 
 .explore-inner-icon.on {
	 border: solid 1px #dad7de;
	 background: #fff;
 }
 
 .explore-inner-icon div.all {
	 width: 34px;
	 height: 34px;
	 margin: 5px 5px 0 0;
	 background: #afafb1;
	 border-radius: 50%;
	 text-align: center;
	 line-height: 32px;
 }
 
 .explore-inner-icon img {
	 width: 44px;
	 margin-top: 5px;
	 border-radius: 50%;
 }
 
 ul.explore-inner-filters {
	 list-style: none;
	 margin: 30px auto 0 auto;
	 padding: 0;
	 display: table;
 }
 
 ul.explore-inner-filters:after {
	 clear: both;
 }
 
 ul.explore-inner-filters li {
	 float: right;
	 /* text-transform: uppercase; */
	 text-align: center;
	 font-size: 16px;
	 letter-spacing: 0px;
	 padding: 0 10px;
 }
 
 .explore-inner-filters li a {
	 padding: 4px 8px;
	 text-decoration: none;
	 color: #000;
	 border-radius: 4px;
 }
 

 .explore-inner-filters li span {
	 padding: 0px 10px 5px;
	 text-decoration: none;
	 color: #000;
	 border-radius: 4px;
 }

 .en .explore-inner-filters li span {
	padding: 10px 10px 5px;
	text-decoration: none;
	color: #000;
	border-radius: 4px;
}
 .explore-inner-filters li a.on {
	 background: #fff;
	 color: var(--primary-color);
 }
 
 .explore-inner-filters li span.on {
	 background: #fff;
	 color: var(--primary-color);
 }
 .explore-inner-filters.explore-inner-filters-type{
    list-style: none;
    margin: 30px auto 0;
    padding: 0;
    display: flex; /* Change display to flex */
    justify-content: center; /* Align items to the center (center) */
    gap: 15px; /* Add space between items if needed */
}

ul.explore-inner-filters.explore-inner-filters-type li {
    display: inline-flex; /* Ensures each <li> acts as an inline flex container */
}
 .explore-tabs-block {
	 width: 91%;
 }
 
 ul.explore-tabs {
	 list-style: none;
	 margin: 0;
	 padding: 0;
	 float: right;
 }
 
 ul.explore-tabs li {
	 font-weight: bold;
	 /*letter-spacing:3px;*/
	 /* text-transform: uppercase; */
	 float: right;
	 padding: 20px 0 17px 0;
	 margin: 0 0 0 45px;
	 cursor: pointer;
 }
 
 ul.explore-tabs li.current {
	 color: var(--primary-color);
	 border-bottom: solid 3px var(--primary-color);
 }
 
 .explore-projects {
	 width: 100%;
	 margin: 0 0 0 0;
	 padding: 0 0 5px;
	 position: relative;
	 box-sizing: border-box;
 }
 
 .explore-leaderboard {
	 width: 755px;
	 margin: 0 0 0 auto;
	 padding: 0 0 5px;
	 position: relative;
	 box-sizing: border-box;
 }
 
 .explore-projects-results, .explore-leaderboard-results {
	 font-size: 24px;
	 padding: 5px 25px;
	 margin: 0 auto 0;
	 text-align: center;
	 display: table;
 }
 
 .explore-leaderboard-type {
	 margin: 20px auto -10px;
	 display: table;
	 border: none;
	 border-bottom: solid 1px #c0c0c8;
	 background: none;
	 padding: 5px 0;
 }
 
 .leader-row {
	 width: 100%;
	 float: right;
	 padding: 12px 5px;
 }
 
 .leader-index {
	 width: 30px;
	 color: #dad9e1;
	 float: right;
	 font-size: 32px;
	 font-weight: bold;
	 text-align: center;
	 margin-left: 10px;
 }
 
 .leader-profilepic {
	 width: 55px;
	 height: 55px;
	 float: right;
	 background: #ddd;
	 position: relative;
	 margin-left: 20px;
 }
 
 .leader-profilepic img {
	 width: 55px;
 }
 
 .leader-title {
	 height: 55px;
	 font-size: 18px;
	 font-weight: 600;
	 float: right;
	 line-height: 55px;
	 vertical-align: middle;
 }
 
 .leader-title a {
	 text-decoration: none;
 }
 
 .leader-amount {
	 font-size: 20px;
	 float: left;
	 color: #000;
	 line-height: 55px;
	 vertical-align: middle;
	 margin-left: 5px;
 }
 
 .show-more-main .button-small {
	 min-width: auto;
	 padding: 7px 60px;
 }
 
 /****************************** page */
 
 .page-header {
	 width: 100%;
 }
 
 .page-header h1 {
	 font-weight: bold;
	 font-size: 32px;
	 width: 100%;
 }
 
 .page-cover {
	 width: 100%;
	 color: #fff;
	 display: table;
 }
 
 .page-cover img {
	 width: 100%;
 }
 
 .page-cover h1 {
	 font-weight: normal;
	 font-size: 32px;
	 margin-top: 200px;
	 width: 100%;
	 left: 0;
	 text-align: center;
	 position: absolute;
 }
 
 .page-content {
	 width: 100%;
	 line-height: 35px;
	 margin: 0 auto 0 auto;
	 padding: 25px 0;
	 color: #333;
 }
 
 .page-content a {
	 color: #337ab7;
	 text-decoration: none;
 }
 
 .page-content .orange {
	 color: var(--primary-color);
 }
 
 .page-title {
	 font-size: 16px;
	 padding: 10px 0;
	 margin: 0 0 10px 0;
	 color: #333;
	 border-bottom: solid 1px #e5e5e5;
	 line-height: 35px;
 }
 
 .right-padding {
	 padding-right: 30px;
 }
 
 .page-sub-title {
	 font-size: 20px;
	 padding: 10px 30px 0 0;
	 line-height: 30px;
	 margin: 0 0 10px 0;
	 color: #333;
 }
 
 .panel-title {
	 font-size: 18px;
	 padding: 10px 0;
	 margin: 0 0 10px 0;
	 color: #333;
	 border-bottom: solid 1px #e5e5e5;
 }
 
 .page-cell.table {
	 display: table-cell;
	 vertical-align: top;
	 padding: 2px;
 }
 
 .page-cell.inline {
	 display: inline-block;
 }
 
 .page-cell.space {
	 padding-right: 20px;
 }
 
 .page-cell.padded {
	 padding: 3px;
 }
 
 .page-cell.partner-logo {
	 margin-bottom: 50px;
	 margin-left: 12px;
	 text-align: center;
 }
 
 /****************************** faq */
 
 .faq-question {
	 font-size: 20px;
	 color: var(--primary-color);
	 margin: 25px 0;
	 line-height: 28px;
 }
 
 .faq-answer {
	 height: 0;
	 overflow: hidden;
 }
 
 /****************************** story */
 
 .underline-with-space {
	 border-bottom: solid 1px #ddd;
	 padding-bottom: 10px;
 }
 
 .stories-main-title {
	 margin-right: 20px;
 }
 
 .story-title {
	 font-size: 24px;
	 padding: 0 0px 0px 0;
	 align-items: center;
 }
 
 .story-title p {
	 margin: 0px;
 }
 
 .story-cover {
	 max-height: 400px;
	 width: 100%;
	 object-fit: cover;
 }
 
 .story-col1 {
	 margin-top: 30px;
	 width: 73%;
	 margin-left: 2%;
 }
 
 .story-col2 {
	 margin-top: 30px;
	 width: 23%;
	 margin-right: 2%;
 }
 
 .story-content {
	 padding: 25px;
 }
 
 .story-photos {
	 flex-basis: 25%;
 }
 
 .story-container {
	 display: flex;
 }
 
 .story-col1 a, .story-col2 a {
	 text-decoration: none;
 }
 
 .story-project-name {
	 display: inline-block;
	 font-size: 20px;
	 font-weight: bold;
	 margin-bottom: 10px;
	 position: relative;
	 top: 50%;
	 transform: translateY(-50%);
 }
 
 .story-project-name a {
	 text-decoration: none;
 }
 
 .story-project-more {
	 margin: 10px 0 0 0;
 }
 
 /****************************** file upload */
 
 .fileinput-button.style1 {
	 position: absolute;
	 bottom: -5px;
	 left: -5px;
 }
 
 .fileinput-button.style2 {
	 position: absolute;
	 bottom: 30px;
	 left: 35px;
 }
 
 .fileinput-button.style3 {
	 position: relative;
	 bottom: 0;
	 right: 0;
 }
 
 .btn {
	 display: inline-block;
	 padding: 6px 12px;
	 margin-bottom: 0;
	 font-size: 16px;
	 font-weight: 400;
	 line-height: 1.42857143;
	 text-align: center;
	 white-space: nowrap;
	 vertical-align: middle;
	 cursor: pointer;
	 -webkit-user-select: none;
	 -moz-user-select: none;
	 -ms-user-select: none;
	 user-select: none;
	 background-image: none;
	 border: 1px solid transparent;
	 border-radius: 4px
 }
 
 .btn:focus, .btn:active:focus, .btn.active:focus {
	 outline: thin dotted;
	 outline: 5px auto -webkit-focus-ring-color;
	 outline-offset: -2px
 }
 
 .btn:hover, .btn:focus {
	 color: #333;
	 text-decoration: none
 }
 
 .btn:active, .btn.active {
	 background-image: none;
	 outline: 0;
	 -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
	 box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125)
 }
 
 .btn-success {
	 color: #fff;
	 background-color: var(--primary-color);
	 border-color: #4cae4c;
	 border: none;
 }
 
 .btn-success:hover, .btn-success:focus, .btn-success:active, .btn-success.active, .open>.dropdown-toggle.btn-success {
	 color: #fff;
	 background-color: var(--primary-color);
	 border-color: #398439;
	 border: none;
 }
 
 .btn-success:active, .btn-success.active, .open>.dropdown-toggle.btn-success {
	 background-image: none
 }
 
 .btn-success.disabled, .btn-success[disabled], fieldset[disabled] .btn-success, .btn-success.disabled:hover, .btn-success[disabled]:hover, fieldset[disabled] .btn-success:hover, .btn-success.disabled:focus, .btn-success[disabled]:focus, fieldset[disabled] .btn-success:focus, .btn-success.disabled:active, .btn-success[disabled]:active, fieldset[disabled] .btn-success:active, .btn-success.disabled.active, .btn-success[disabled].active, fieldset[disabled] .btn-success.active {
	 background-color: #5cb85c;
	 border-color: #4cae4c
 }
 
 .btn-success .badge {
	 color: #5cb85c;
	 background-color: #fff
 }
 
 .progress {
	 height: 20px;
	 margin-top: 10px;
	 overflow: hidden;
	 background-color: #f5f5f5;
	 border-radius: 4px;
	 -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, .1);
	 box-shadow: inset 0 1px 2px rgba(0, 0, 0, .1)
 }
 
 .progress-bar {
	 float: left;
	 width: 0;
	 height: 100%;
	 font-size: 12px;
	 line-height: 20px;
	 color: #fff;
	 text-align: center;
	 background-color: #428bca;
	 -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .15);
	 box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .15);
	 -webkit-transition: width .6s ease;
	 -o-transition: width .6s ease;
	 transition: width .6s ease
 }
 
 .progress-striped .progress-bar, .progress-bar-striped {
	 background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
	 background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
	 background-image: linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
	 -webkit-background-size: 40px 40px;
	 background-size: 40px 40px
 }
 
 .progress.active .progress-bar, .progress-bar.active {
	 -webkit-animation: progress-bar-stripes 2s linear infinite;
	 -o-animation: progress-bar-stripes 2s linear infinite;
	 animation: progress-bar-stripes 2s linear infinite
 }
 
 .progress-bar[aria-valuenow="1"], .progress-bar[aria-valuenow="2"] {
	 min-width: 30px
 }
 
 .progress-bar[aria-valuenow="0"] {
	 min-width: 30px;
	 color: #777;
	 background-color: transparent;
	 background-image: none;
	 -webkit-box-shadow: none;
	 box-shadow: none
 }
 
 .progress-bar-success {
	 background-color: #5cb85c
 }
 
 .progress-striped .progress-bar-success {
	 background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
	 background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
	 background-image: linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent)
 }
 
 .progress-bar-info {
	 background-color: #5bc0de
 }
 
 .progress-striped .progress-bar-info {
	 background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
	 background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
	 background-image: linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent)
 }
 
 .progress-bar-warning {
	 background-color: #f0ad4e
 }
 
 .progress-striped .progress-bar-warning {
	 background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
	 background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
	 background-image: linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent)
 }
 
 .progress-bar-danger {
	 background-color: #d9534f
 }
 
 .progress-bar-container {
	 margin: -4px 0 0 0;
	 width: 84%;
	 float: right;
 }
 
 /****************************** mobile (specifics) */
 
 .noscroll-mobile {
	 overflow: hidden;
 }
 
 .search-project-slide-mobile {
	 margin-right: 0px;
 }
 
 /* icons */
 
 .icon-search {
	 margin-top: 5px;
	 margin-left: 2px;
 }
 
 /* header */
 
 .header-container-mobile {
	 display: none;
 }
 
 .header-mobile a.signin {
	 text-decoration: none;
	 font-weight: bold;
 }
 
 .header-menu-switch {
	 width: 70px;
	 height: 70px;
	 order: 3;
 }
 
 .header-menu-switch.on {
	 background: #f0f0f0;
 }
 
 .header-menu-icon {
	 width: 35px;
	 height: 22px;
	 background: url('../images/sprite.png') -189px 0 no-repeat;
	 margin: 25px auto;
 }
 
 .header-menu-switch.on .header-menu-icon {
	 width: 24px;
	 height: 24px;
	 background: url('../images/sprite.png') -234px 0 no-repeat;
	 margin: 22px auto;
 }
 
 .header-menu-mobile {
	 position: absolute;
	 top: 70px;
	 left: 0;
	 background: #f0f0f0;
	 width: 100%;
	 height: auto;
	 padding: 0 25px;
	 box-sizing: border-box;
	 z-index: 1000;
	 display: none;
	 border-bottom: 1px solid #dedee6;
	 box-shadow: 1px 1px 1px #dedee6;
	 overflow: scroll;
 }
 
 .header-search-mobile {
	 width: 100%;
	 display: table;
	 position: relative;
	 margin-top: 10px;
 }
 
 .header-search-mobile input[type=text] {
	 width: 100%;
	 border: none;
	 margin: 0 auto 0 auto;
	 border-bottom: solid 1px #bbbbbb;
	 background: none;
	 padding: 5px 0;
	 font-size: 16px;
	 padding-left: 25px;
 }
 
 ul.header-menu-links {
	 list-style: none;
	 margin: 10px 0 10px 0;
	 padding: 0;
 }
 
 ul.header-menu-links li {
	 font-size: 16px;
	 padding: 4px 0;
 }
 
 ul.header-menu-links li a {
	 text-decoration: none;
 }
 
 /* explore (header) */
 
 ul.explore-categories-mobile {
	 list-style: none;
	 margin: 10px 0 0 0;
	 padding: 0;
	 display: table;
 }
 
 .explore-categories-mobile li {
	 text-transform: uppercase;
	 font-size: 13px;
	 font-weight: bold;
 }
 
 .explore-categories-mobile li a {
	 text-decoration: none;
	 color: #000;
 }
 
 .explore-categories-mobile .explore-title {
	 color: #bbbbc2;
	 font-size: 16px;
	 padding: 5px 0;
 }
 
 .explore-categories-mobile .explore-icon {
	 float: right;
	 width: 25px;
 }
 
 .explore-categories-mobile .explore-icon img {
	 width: 25px;
 }
 
 .explore-categories-mobile .explore-category {
	 float: right;
	 font-size: 14px;
	 margin-right: 13px;
 }
 
 /* explore */
 
 .explore-inner-filters-mobile, .explore-inner-categories-mobile,.mobile-filters, .floating-button {
	 display: none;
	 /* width: 250px;
	 border: none;
	 margin: 30px auto 0 auto;
	 border-bottom: solid 1px #cccccc;
	 background: none;
	 padding: 5px 0;
	 font-size: 15px; */
 }
 .desctop-filtrations{
	display: block;
 }
 
 #project-detail-options-mobile {
	 display: none;
 }
 
 .only-mobile {
	 display: none;
 }
 
 .not-mobile {
	 margin: 0 auto 0 auto;
 }
 
 .img-personal-container {
	 display: inline-block;
	 padding-top: 5px;
	 padding-bottom: 20px;
	 padding-right: 4%;
	 width: 19%;
	 margin: 0;
 }
 
 .img-board-container {
	 display: inline-block;
	 padding-top: 5px;
	 padding-bottom: 20px;
	 width: 24%;
	 margin: 0;
 }
 
 .team-img-container {
	 padding: 0 auto 0 auto;
	 padding-top: 5px;
	 padding-right: 2%;
	 width: 12%;
	 margin: 0 auto 0 auto;
	 display: inline-block;
 }
 
 .cpf-naua {
	 display: flex;
	 align-items: center;
	 text-align: center;
	 width: 50%;
	 margin-right: 25%;
 }
 
 .footer-align {
	 display: flex;
	 align-items: center;
 }
 
 .iframe-project-video {
	 position: absolute;
	 top: 0;
	 left: 0;
	 width: 100%;
	 height: 100%;
	 border: 0;
 }
 
 .create-project-images {
	 width: 33.333%;
	 padding: 5px 10px
 }
 
 .create-project-sim-action {
	 width: 50%;
 }
 
 .create-project-sim-total {
	 width: 27.5%;
 }
 
 .create-project-sim {
	 display: flex;
 }
 
 .project_vip-volunteers-num {
	 display: flex;
 }
 
 .opportunity_info{
	 padding-right: 30%;
 }
 
 .project_vip-img-cover {
	 width: 60%;
	 margin: 0px auto;
 }
 
 .div-w-50-100 {
	 width: 46%;
	 margin: 0px 1%;
 }
 
 .search-project-location-div {
	 display: flex;
	 align-items: center;
	 /* float: left;
	 margin-top: -34px; */
	 width: 100%;
 }
 
 .project-title-header {
	 padding: 0 0 0 45px;
	 position: relative
 }
 
 /****************************** wizard web*/
 
 .wizard_container {
	 width: 85%;
	 margin: 50px auto;
	 min-height: 245px;
 }
 
 .wizard-header {
	 text-align: center;
 }
 
 .wizard-field-container {
	 position: relative;
	 display: inline-block;
	 width: 46%;
	 margin: 23px 2%;
 }
 
 .wizard-field-container p {
	 display: inline-block;
	 width: 35%;
	 margin: 0px;
 }
 
 .wizard-field input, .wizard-field select {
	 border: solid 1px #cccccc;
	 background-color: #fff;
	 padding: 5px 0;
	 font-size: 15px;
	 width: 100%;
	 padding-right: 10px;
 }
 
 .wizard-field input {
	 direction: ltr;
	 text-align: right;
	 padding-top: 10px;
 }
 
 .wizard-field-container .wizard-field {
	 display: inline-block;
	 width: 65%;
 }
 
 .wizard-content {
	 margin-top: 50px;
 }
 
 .wizard-footer {
	 display: flex;
	 justify-content: space-between;
	 margin-top: 20px;
	 align-items: center;
 }
 
 .wizard-button {
	 display: flex;
	 align-items: center;
	 justify-content: center;
	 height: 36px;
	 width: 150px;
 }
 
 .wizard_main_back {
	 font-size: 18px;
	 cursor: pointer;
	 color: var(--primary-color);
	 text-decoration: none;
 }
 
 .wizard-navigation-txt {
	 font-weight: bold;
	 margin: 8px 0px;
 }
 
 .wizard-navigation-link {
	 margin: 8px 0px;
	 cursor: pointer;
	 color: var(--primary-color);
	 font-weight: bold;
 }
 
 .wizard_container .small {
	 font-weight: normal;
	 font-size: 14px;
 }
 
 .wizard-loading {
	 display: none;
	 text-align: center;
 }
 
 .wizard_container .back {
	 border: solid 1.5px var(--primary-color);
	 background: #fff;
	 color: var(--primary-color);
 }
 
 .wizard_container ul.parsley-errors-list {
	 position: absolute;
 }
 
 .not-required-step {
	 font-size: 16px;
	 font-weight: normal;
	 color: var(--primary-color);
 }
 
 .red-label, .red-label:hover {
	 color: red;
 }
 
 .wizard-confirmation {
	 padding: 50px 0px;
 }
 
 .wizard-error {
	 color: red;
	 margin: 0px;
	 display: none;
 }
 
 .wizard-field input::-webkit-input-placeholder {
	 color: #ccc;
 }
 
 .wizard-field input:-moz-placeholder {
	 color: #ccc;
 }
 
 .wizard-field input::-moz-placeholder {
	 color: #ccc;
 }
 
 .wizard-field input :-ms-input-placeholder {
	 color: #ccc;
 }
 /****************************** mobile (restyling) */
 @media (min-width: 667px) {
	 .desktop-hide {
		 display: none !important;
	 }
 }
 
 .home-button-mobile {
    display: block; /* button Link Title on Highlights always visible (Desktop and Mobile)*/
}
@media only screen and (min-width: 668px) {
	.mobile-filters{
		display: none;
	}
}
 @media only screen and (min-width: 320px) and (max-width: 667px) {
	 .flag-header {
		 font-size: 16px;
	 }
	 .flag-details {
		 padding: 20px;
	 }
	 .story-title {
		 display: block !important;
		 font-size: 20px;
	 }
	 .story-content, .story-photos {
		 flex-basis: 100% !important;
	 }
	 .story-container {
		 display: block;
	 }
	 .survey-answer {
		 width: 100%;
		 display: inline-block;
	 }
	 .survey-options {
		 display: block;
	 }
	 #highlight-section {
		 height: 300px;
		 margin-bottom: 2px;
	 }
	 .highlight {
		 height: 300px;
		 background: #f0f0f0;
	 }
	 .highlight .stretch-width {
		 width: 100%;
	 }
	 .highlight-dark {
		 height: 192px;
	 }
	 .highlight-more {
		 display: flex;
		 flex-direction: row;
		 justify-content: center;
		 position: unset;
		 margin: 5% auto 0 auto;
	 }
	 .highlight-next {
		 top: 29%;
	 }
	 .highlight-prev {
		 top: 29%;
	 }
	 .home-button-mobile {
		 justify-content: center;
		 display: flex;
		 padding: 9px 0;
		 width: 85%;
		 min-width: unset !important;
		 max-width: unset !important;
	 }
	 .mobile-flex-layout {
		 display: flex;
	 }
	 .mobile-justify-center {
		 justify-content: center;
	 }
	 .min-width-550 {
		 min-width: unset !important;
	 }
	 .project-title-header {
		 padding: 0px;
	 }
	 .search-project-location-div {
		 /* margin-top: -92px; */
		 margin: 7px 0px;
	 }
	 .search-project {
		 padding: 20px 20px;
	 }
	 .button-prj-location {
		 width: 100% !important;
	 }
	 .footer-wraper {
		 display: inline-block;
		 width: 40% !important;
		 float: none;
		 margin: 0px 4%;
	 }
	 .footer-wraper img {
		 width: 70% !important;
	 }
	 .footer-wraper br {
		 display: none;
	 }
	 .div-w-50-100 {
		 width: 97%;
	 }
	 .user-followers-block {
		 width: 100% !important;
	 }
	 .selected-group-wrapper {
		 width: 100% !important;
	 }
	 .user-register-align {
		 display: block !important;
	 }
	 .user-enroll-uni {
		 width: 100% !important;
		 padding-left: 0px !important;
		 margin-bottom: 0px !important;
		 border-left: none !important;
	 }
	 .user-enroll-ngo {
		 width: 100% !important;
		 padding-right: 0px !important;
	 }
	 .user-fav-cat {
		 width: 100% !important;
		 padding-right: 0px !important;
	 }
	 .settings-fav-cat {
		 width: 100% !important;
		 padding-right: 0px !important;
	 }
	 .follow-block-mobile {
		 position: relative;
		 color: #000;
		 left: 0px;
		 bottom: 0px;
		 padding-top: 20px;
		 margin: 0px auto;
		 width: fit-content;
		 cursor: pointer;
		 text-transform: uppercase;
		 font-size: 16px;
		 font-weight: bold;
	 }
	 .follow-block-usr {
		 position: relative;
		 color: #000;
		 cursor: pointer;
		 text-transform: uppercase;
		 font-size: 16px;
		 font-weight: bold;
		 margin-top: 10px;
	 }
	 .follow-block-mobile .icon-follow, .follow-block-usr .icon-follow {
		 float: right;
	 }
	 .follow-block-mobile .follow-text, .follow-block-usr .follow-text {
		 float: right;
		 margin: 0 12px 0 0;
	 }
	 .ngo-location {
		 justify-content: center;
	 }
 
	 .ngo-cover-gradient {
		 position: relative;
	 }
	 ul.header-menu-links li {
		 font-size: 14px;
	 }
	 .school-btn {
		 width: 100%;
		 margin-top: 10px !important;
	 }
	 ul.powered a {
		 width: 30% !important;
	 }
	 .footer-social-instagram, .footer-social-twitter, .footer-social-facebook {
		 display: inline-block;
	 }
	 .school-rounded {
		 width: 100% !important;
		 display: block;
	 }
	 .user-project-vip {
		 width: 100% !important;
		 display: block !important;
	 }
	 .user-project-vip a {
		 cursor: pointer;
	 }
	 .user-vip-btn {
		 width: 30%;
		 margin-top: 20px;
	 }
	 .opportunity_info{
		 padding-right:0px; 
		 text-align: center;
	 }
	 .header-menu a {
		 font-size: 12px;
	 }
 
	 .header-profilepic {
		 order: 2;
	 }
 
	 .user-notification-switch {
		 order: 1;
		 margin-left: 15px;
	 }
 
	 .header-mobile a.signin {
		 font-size: 12px;
	 }
	 .user-name {
		 font-size: 20px;
		 padding: 0px;
		 margin: 0px;
		 line-height: 22px;
	 }
	 .home-stats-col {
		 width: 49% !important;
	 }
	 .volunteering-week .project {
		 width: 45% !important;
		 height: 180px !important;
	 }
	 
	 .volunteering-week .v-line {
		 height: 200px !important;
	 }
	 .ngo-cover, .user-cover {
		 background-size: contain;
		 background-repeat: no-repeat;
	 }
	 .ngo-cover, .user-cover {
		 background-size: cover;
		 height: 220px;
	 }
	 .project_vip-img-cover {
		 width: 80%;
	 }
	 .project_vip-volunteers-num {
		 display: block;
	 }
	 .field-width {
		 width: 100%;
		 margin: 15px 0px;
	 }
	 .project_vip-button3, .project_vip-button2 {
		 width: 70%;
		 margin: 0px auto !important;
		 float: none !important;
	 }
	 .main-dialog, .edit-image-dialog , .edit-image-dialog-preview,  .edit-image-dialog-coverpic_facebook{
		 width: 100% !important;
	 }
	 .dialog-content {
		 padding: 0px 20px 20px !important;
	 }
	 .sdg {
		 height: auto;
	 }
	 .create-project-images {
		 width: 100%;
	 }
	 .create-project-images-div {
		 display: block !important;
	 }
	 .project-img-cover {
		 width: 80%;
		 height: 250px !important;
		 margin: 0px auto;
	 }
	 .project_vip-img-cover {
		 width: 80%;
		 height: auto !important;
		 margin: 0px auto;
	 }
	 .instructions {
		 display: block !important;
	 }
	 .mobile-hide {
		 display: none !important;
	 }
	 .create-project-sim-action {
		 width: 100%;
	 }
	 .create-project-sim-total {
		 width: 100%;
	 }
	 .create-project-sim {
		 display: block;
	 }
	 #project-sim-total {
		 margin-right: 70px;
	 }
	 #project-sim-unit-span {
		 margin-right: 32px;
	 }
	 .project-block-margin-1 {
		 margin-top: 180px !important;
	 }
	 .project-block-margin-2 {
		 margin-top: 280px !important;
	 }
	 .project-pledge-contribute a {
		 display: block !important;
		 margin-top: 10px;
	 }
	 .report_image {
		 width: 250px;
	 }
	 .report_image_right {
		 width: 10px;
	 }
	 .report_image_left {
		 width: 10px;
	 }
	 .project-browse-update {
		 width: 100%;
		 margin-top: 20px;
	 }
	 .iframe-project-video {
		 left: 10%;
		 width: 90%;
	 }
	 .articles-main {
		 margin: 20px 2.5% !important;
		 width: 95% !important;
	 }
	 .search-user {
		 padding-right: 50px;
	 }
	 .cpf-naua {
		 display: block;
		 width: 100%;
		 margin-right: 0px;
	 }
	 .footer-align {
		 display: block;
		 text-align: center;
	 }
	 .page-content {
		 line-height: 35px;
	 }
	 .main {
		 width: 100%;
	 }
	 .search-project {
		 padding-right: 50px
	 }
	 .only-mobile {
		 display: block;
	 }
	 .user-notification-page .padding-x-7 {
		 padding-left: 20px;
		 padding-right: 20px;
	 }
	 .user-notification-page .margin-x-10 {
		 margin-left: unset;
		 margin-right: unset;
	 }
	 .user-notification-page, .user-notification .min-width-550 {
		 min-width: unset !important;
	 }
	 .user-notification .user-notification-tip-top, .user-notification .user-notification-tip {
		 left: 135px;
	 }
	 .search-project-slide {
		 margin-right: 0px;
	 }
	 .not-mobile {
		 display: none;
	 }
	 .img-personal-container {
		 width: 100%;
	 }
	 .img-personal-container img {
		 height: 150px;
		 object-fit: cover;
	 }
	 .img-board-container {
		 width: 100%;
	 }
	 .img-board-container img {
		 height: 150px;
		 object-fit: cover;
	 }
	 .team-img-container {
		 width: 100%;
		 padding-left: 25%;
		 padding-right: 25%;
	 }
	 .cpf-logo-about-page {
		 width: 80%;
	 }
	 .search-ngo-slide {
		 margin-right: 0px;
	 }
	 .all-surveys-container .min-width-450 {
		 min-width: 100%;
	 }
	 .all-surveys-container .width-75, #satisfaction-survey-form .width-75 {
		 width: 100%;
	 }
	 .ngo-social{
		 float: right;
	 }
	 .tooltip .tooltiptext{
		 left: -100px;
		 top: 30px;
	 }
	 /****************************** header */
 
	 .header-container {
		 display: none;
	 }
	 .banner-content {
		 padding-right: 0px;
		 font-size: 12px;
	 }
	 .banner-visit button {
		 font-size: 12px;
		 padding: 6px;
	 }
	 .banner-close button {
		 font-size: 12px;
		 padding: 6px;
	 }
	 
	 .header-container-mobile {
		 display: flex;
		 flex-direction: column;
	 }
	 .header-mobile {
		 border-bottom: solid 1px #dedee6;
		 height: 70px;
		 position: relative;
		 padding-right: 20px;
	 }
	 .not-mobile {
		 display: none;
	 }
	 .header-logo {
		 width: 80px;
	 }
 
	 .header-logo img {
		 width: 65px;
	 }
 
	 .header-project {
		 float: left;
		 position: relative;
		 margin-left: 0px;
		 z-index: 10;
	 }
	 .header-project .editmode-button {
		 float: left;
		 margin: 13px 10px 0 0;
		 min-height: 45px;
		 min-width: 70px;
		 max-width: 75px;
		 font-size: 12px;
		 line-height: 15px;
		 white-space: normal;
		 padding: 7px 10px;
	 }
	 .header-editmode {
		 float: left;
		 position: relative;
		 margin-left: 0px;
		 z-index: 10;
	 }
	 .header-editmode .editmode-button {
		 float: left;
		 margin: 13px 10px 0 0;
		 min-height: 45px;
		 min-width: 75px;
		 max-width: 75px;
		 font-size: 12px;
		 line-height: 16px;
		 white-space: normal;
		 padding: 6px 10px;
	 }
	 .header-editmode .editmode-button.pending {
		 max-width: initial;
	 }
	 .user-notification {
		 left: 0px;
		 top: 75px;
	 }
 
	 /* user menu, project menu */
	 .user-menu {
		 left: 57px;
		 top: 75px;
	 }
	 .project-menu {
		 left: -10px;
		 top: 75px;
	 }
	 .team-img-container {
		 width: 100%;
		 padding-left: 25%;
		 padding-right: 25%;
	 }
	 /****************************** show transaction mobile */
	 .notification-fade {
		 background: rgba(0, 0, 0, 0.65);
		 position: fixed;
		 top: 0;
		 right: 0;
		 bottom: 0;
		 left: 0;
		 outline: 0;
		 z-index: 1001;
		 display: none;
		 overflow-x: hidden;
		 overflow-y: auto;
	 }
	 .notification-dialog {
		 position: relative;
		 margin: 50px auto 0;
		 width: 100%;
		 display: none;
		 -webkit-transform: translate(0, -25%);
		 -ms-transform: translate(0, -25%);
		 -o-transform: translate(0, -25%);
		 transform: translate(0, -25%);
		 transition: transform 0.3s ease-out;
	 }
	 .notification-dialog.in {
		 -webkit-transform: translate(0, 0);
		 -ms-transform: translate(0, 0);
		 -o-transform: translate(0, 0);
		 transform: translate(0, 0);
	 }
	 .notification-close {
		 width: 20px;
		 height: 20px;
		 background: url('../images/sprite.png') -56px -86px no-repeat;
		 left: 19px;
		 top: 26px;
		 cursor: pointer;
		 position: absolute;
	 }
	 .notification-content {
		 min-height: 300px;
		 position: relative;
		 background-color: #fff;
		 box-shadow: 0 1px 10px rgba(0, 0, 0, 0.20);
		 -moz-border-radius: 1px;
		 -webkit-border-radius: 1px;
		 border-radius: 1px;
	 }
	 .notification-header {
		 height: 65px;
		 background: #f0f0f0;
		 padding: 20px;
		 font-size: 28px;
	 }
 
	 .notification-details, .notification-deactivate {
		 padding: 36px 50px 50px;
	 }
	 .notification-field {
		 margin: 15px 0;
	 }
	 .notification-button {
		 margin: 10px auto 0 auto;
	 }
	 .notification-field input[type=text], .notification-field input[type=password] {
		 width: 325px;
		 border: none;
		 border-bottom: solid 1px #cccccc;
		 padding: 5px 0;
		 font-size: 15px;
	 }
	 .notification-field.space {
		 padding-left: 50px;
	 }
	 .notification-confirm {
		 width: 350px;
		 padding: 46px 0 50px 50px;
		 margin: 0 auto 0 auto;
		 text-align: center;
		 display: none;
	 }
	 .notification-deactivate {
		 display: none;
	 }
	 .notification-deactivate-button {
		 position: absolute;
		 background: #dedede;
		 left: 50px;
		 bottom: 50px;
	 }
	 .transaction-box {
		 width: 100%;
		 background-color: #f0f0f0;
		 padding: 15px;
		 margin-bottom: 15px;
	 }
	 .transaction-box .row {
		 width: 100%;
		 padding-bottom: 15px;
	 }
	 .transaction-box .subtitle {
		 font-weight: bold;
	 }
	 .transaction-box .right {
		 display: inline-block;
		 text-align: center;
		 width: 100%;
	 }
	 .transaction-box .left {
		 display: inline-block;
		 text-align: center;
		 width: 100%;
	 }
	 .transaction-box .block {
		 display: inline-block;
	 }
	 .transaction-box .box-underline {
		 border-bottom: solid 1px #dedee6;
	 }
	 .transaction-box img {
		 width: 100%;
		 height: auto;
	 }
	 .transaction-box a {
		 text-decoration: none;
	 }
	 /****************************** account settings */
	 .settings-dialog {
		 width: 95%;
		 margin: 25px auto 0;
	 }
	 .settings-field {
		 width: 100%;
	 }
	 .settings-field.left {
		 float: none !important;
		 display: inline-block;
	 }
 
	 .settings-deactivate-button {
		 position: relative;
		 left: inherit;
		 bottom: inherit;
		 margin: 15px auto 0 auto;
	 }
	 /****************************** home */
	 /* highlights section */
	 .highlight {
		 width: 100%;
	 }
 
	 /* explore section */
	 .explore-categories li {
		 width: 50px;
		 font-size: 12px;
	 }
	 .explore-icon img {
		 width: 35px;
	 }
	 /* trending section */
	 
	 .trending-title, .newest-title, .ending-title {
		 padding: 0 10px 0 10px;
	 }
	 .trending-title.title-grey, .newest-title.title-grey, .ending-title.title-grey {
		 font-size: 21px;
	 }
	 /* sponsors section */
	 #sponsors-section {
		 width: 80%;
	 }
	 .sponsor-prev {
		 margin-left: -25px;
	 }
	 .sponsor-next {
		 margin-right: -25px;
	 }
	 /* quotes section */
	 #quotes-section {}
	 /* stories section */
	 /* #stories-section {
		 display:none;
	 } */
	 /* project slider (favorites, trending, newest, ending) */
	 .home-project-list, .home-news-list, .report-list-slider, .home-story-list {
		 width: 90%;
		 height: 340px;
	 }
	 .home-project-prev {
		 margin-left: -15px;
		 margin-top: 130px;
	 }
	 .home-project-next {
		 margin-right: -15px;
		 margin-top: 130px;
	 }
	 .home-project-slide, .home-news-slide, .report-cell-slide {
		 width: 290px;
		 height: 340px !important;
		 margin-right: 0;
		 /*49px;*/
	 }
	 .home-project-cover, .home-news-cover {
		 height: 290px;
		 position: relative;
		 overflow: hidden;
	 }
	 .home-project-cover img, .home-news-cover img {
		 width: 340px;
	 }
	 .home-project-category {
		 margin: 0 15px 0 0;
	 }
	 .home-project-progress {
		 width: 240px;
		 height: 6px;
	 }
	 .team-img-container {
		 width: 100%;
		 padding-left: 25%;
		 padding-right: 25%;
	 }
	 /****************************** NGO */
	 .ngo-info {
		 margin: 0px;
		 padding: 30px;
		 color: #000;
		 position: relative;
		 background: #f0f0f0;
		 width: 100%;
	 }
	 .ngo-name {
		 font-size: 24px;
	 }
	 .ngo-info .icon-location-light, .user-info .icon-location-light {
		 background: url('../images/sprite.png') -86px -86px no-repeat;
	 }
	 /* description block */
	 .ngo-desc-block {
		 width: 100%;
		 float: none;
		 margin-bottom: 35px;
	 }
	 .ngo-desc-text {
		 padding: 0;
	 }
	 .ngo-board-block {
		 width: 100%;
		 float: none;
	 }
	 /* contact popup */
	 .contact-dialog {
		 width: 100%;
		 margin: 25px auto 0;
	 }
	 .contact-field {
		 width: 100%;
	 }
	 .contact-field input[type=text], .contact-field select {
		 width: 100%;
	 }
	 .contact-field textarea {
		 width: 100%;
	 }
	 .contact-field.field-full input[type=text] {
		 width: 100%;
	 }
	 .contact-field.space {
		 padding-left: 0px;
	 }
	 .contact-confirm {
		 width: auto;
		 padding: 46px 25px 50px;
	 }
	 .gallery-image{
		 display: block !important;
		 margin: 20px auto !important;
		 width: auto !important;
	 }
	 /****************************** user */
	 .user-info {
		 margin: 0px;
		 padding: 30px 30px 10px 30px;
		 color: #000;
		 position: relative;
		 background: #f0f0f0;
		 width: 100%;
	 }
	 .user-block {
		 padding: 10px 35px 40px 35px;
	 }
	 .user-bio-block {
		 padding: 10px 35px 40px 35px;
		 display: block;
	 }
	 .user-cover-gradient {
		 position: relative;
	 }
	 /* description block */
	 .user-desc-block {
		 width: 100%;
		 float: none;
		 margin-bottom: 35px;
	 }
	 .user-desc-text {
		 padding: 0;
	 }
	 /* user summary */
	 .user-social-graph .title-grey {
		 margin: 0 auto;
		 display: table;
	 }
	 /* recent activity */
	 .user-activity-prev {
		 margin-left: -10px;
	 }
	 .user-activity-next {
		 margin-right: -10px;
	 }
	 /* user followers */
	 .user-follower-details {
		 width: auto;
	 }
	 .graph-project-details {
		 top: 350px;
	 }
	 .user-social-graph .category-project-ngo {
		 width: 100%;
		 float: right;
	 }
	 .user-social-graph .category-project-ngo-title {
		 float: right;
		 right: 120px;
		 position: absolute;
	 }
	 .user-social-graph .category-project-ngo-pic {
		 float: right;
	 }
	 .user-social-graph .category-details {
		 margin: 15px 15px 0;
	 }
	 ul.user-tabs li{
		 margin: 0 0 0 12px;
	 }
	 /****************************** project */
	 .project-block {
		 padding: 45px 30px 35px;
	 }
	 .project-block-left {
		 float: none;
		 width: 100%;
		 margin-bottom: 35px;
	 }
	 .project-block-right {
		 float: none;
		 width: 100%;
		 margin-right: 0;
		 padding-top: 10px;
	 }
	 .project-cover {
		 width: 100%;
		 height: auto;
	 }
	 .project-cover {
		 width: 100%;
		 height: 159px;
	 }
	 .project-desc {
		 padding: 0;
	 }
	 .project-progress {
		 width: 100%;
	 }
	 .project-pledge-contribute, .search-projects .project-pledge-contribute {
		 width: 100%;
	 }
	 .project-pledge-contribute .block {
		 width: auto;
		 float: none;
		 padding: 5px 0;
	 }
	 .project-pledge-contribute .separator {
		 width: 95%;
		 height: 1px;
		 margin: 5px auto;
		 float: none;
	 }
	 /* section tabs */
	 ul.project-tabs li {
		 margin: 0 0 0 12px;
	 }
	 .project-detail-block {
		 padding: 0 40px;
	 }
	 .project-detail-block-sdg {
		 padding: 0 40px;
	 }
	 /* project summary */
	 #project-detail-summary {
		 width: 100%;
		 float: none;
	 }
	 #project-detail-summary-sdg {
		 width: 100%;
		 float: none;
	 }
	 /* project updates */
	 #project-detail-updates {
		 width: 100%;
		 float: none;
	 }
	 .project-update-list {
		 margin: 25px 15px 0 15px;
		 padding: 0 10px 0 10px;
	 }
	 /* project comments */
	 #project-detail-comments {
		 width: 100%;
		 float: none;
	 }
	 /* project followers */
	 #project-detail-followers {
		 width: 100%;
		 float: none;
	 }
	 /* project contribution options */
	 #project-detail-options {
		 display: none;
		 float: none;
		 width: 85%;
		 margin: 25px auto;
	 }
	 #project-detail-options-mobile {
		 display: block;
		 float: none;
		 width: 85%;
		 margin: 25px auto;
	 }
	 .project-sim-option.left {
		 float: none;
	 }
	 .project-follower-description {
		 white-space: nowrap;
		 overflow: hidden;
		 text-overflow: ellipsis;
	 }
	 /***********************login**********/
	 .sigin-col {
		 width: 100%;
		 display: inline-block;
	 }
	 /****************************** project new */
	 .project-dialog {
		 margin: 25px auto 0;
		 width: 100%;
	 }
	 .project-new1 {
		 padding: 36px 25px 50px;
	 }
	 .project-field {
		 width: 100%;
	 }
	 .project-field.field-half input[type=text], .project-field.field-half select {
		 width: 100%;
	 }
	 .project-field.field-half-clipped input[type=text] {
		 width: 96%;
	 }
	 .project-field.field-fourth input[type=text] {
		 width: 75px;
	 }
	 .project-option-label {
		 margin-left: 10px;
	 }
	 .project-terms {
		 width: auto;
	 }
	 /****************************** payment (popup) */
	 .payment-dialog {
		 width: 100%;
	 }
	 .payment-field {
		 width: 100%;
	 }
	 .payment-field input[type=text] {
		 width: 100%;
	 }
	 .payment-field.left {
		 float: none !important;
		 display: inline-block;
	 }
	 .payment-confirm {
		 width: auto;
		 padding: 46px 25px 50px;
	 }
	 /****************************** impact (ngo) */
	 .impact-cell, .impact-cell2, .report-cell {
		 width: 75%;
		 margin: 0 auto;
		 padding: 15px 0;
		 float: none;
		 display: block;
	 }
	 .impact-separator {
		 display: none;
	 }
	 /****************************** graph (user) */
	 .social-graph-canvas {
		 width: 300px;
	 }
	 .graph-instructions {
		 display: none;
	 }
	 /****************************** gallery (ngo) */
	 .project-details .photo-cell img {
		 width: 100%;
	 }
	 /****************************** flag project */
	 .flag-dialog {
		 width: 100%;
	 }
	 .flag-field {
		 width: 100%;
	 }
	 .flag-confirm {
		 width: auto;
		 padding: 46px 25px 50px;
	 }
	 /****************************** flag comment */
	 .flag-comment-dialog {
		 width: 100%;
	 }
	 .flag-comment-field {
		 width: 100%;
	 }
	 .flag-comment-confirm {
		 width: auto;
		 padding: 46px 25px 50px;
	 }
	 /****************************** footer */
	 ul.footer-menu li {
		 float: right;
		 width: 110px;
		 padding: 10px;
	 }
	 .footer-list {
		 width: 33.33% !important;
	 }
	 .separator {
		 margin: 65px 0;
	 }
	 .copyright {
		 /*        float:none;*/
	 }
	 ul.powered {
		 margin: auto;
		 display: block;
		 float: none;
		 width: 100% !important;
		 margin-top: 40px;
		 /* margin-right: 250px;
		 margin-bottom: 20px;
			 margin-top:-50px;
			 margin-left:-100px;*/
	 }
	 .footer-social {
		 margin-top: 40px;
	 }
	 .footer-social-facebook {
		 margin-right: 3px;
	 }
	 .footer-social-twitter {
		 margin-right: 3px;
	 }
	 .footer-social {
		 margin: auto;
		 display: block;
	 }
	 /****************************** search */
	 .search-summary {
		 width: 75%;
		 text-align: center;
		 margin: 0 auto;
	 }
	 .search-container input {
		 width: 250px;
	 }
	 /* search projects */
	 .search-projects {
		 width: 100%;
	 }
	 .search-projects-sign, .search-vip-projects-sign {
		 display: none;
	 }
	 .search-project-cover {
		 float: none;
	 }
	 .search-project-category {
		 margin: 0px 15px 0 0;
	 }
	 .search-project-details {
		 float: none;
		 width: auto;
		 margin-top: 15px;
	 }
	 .search-project-progress {
		 width: 100%;
	 }
	 /* search ngo */
	 .search-ngos {
		 width: 100%;
	 }
	 .search-ngos-sign {
		 display: none;
	 }
	 .search-ngo-cover {
		 float: none;
	 }
	 .search-ngo-details {
		 float: none;
		 width: auto;
		 margin-top: 15px;
	 }
	 /* search user */
	 .search-users {
		 width: 100%;
	 }
	 .search-users-sign {
		 display: none;
	 }
	 .search-user-details {
		 width: 105px;
	 }
	 .search-user-title {
		 font-size: 18px;
	 }
	 /****************************** explore */
	 ul.explore-inner-categories {
		 display: none;
	 }
	 ul.explore-inner-filters {
		 display: none;
	 }
	 .explore-inner-filters-mobile, .explore-inner-categories-mobile, .mobile-filters  {
		 display: block;
	 }
	 .select-container {
		padding: 0px!important;
	}
	 /* html.device-phone body{
		overflow-y: hidden;
	 } */
	 /* Floating Button */
	.floating-button {
        direction: rtl;
		position: fixed;
		bottom: 28px;
		right: 35%;
		background-color: #fff; /* White background for the button */
		color: #424242; /* Dark text */
		padding: 1px 20px; /* Adjust padding for button size */
		border-radius: 20px; /* Rounded edges */
		box-shadow: -2px 4px 4px 3px rgba(0, 0, 0, 0.1);
		border: 1px solid #ccc; /* Border to match the design */
		font-size: 14px; /* Adjust font size */
		/* font-weight: bold; */
		cursor: pointer;
		z-index: 1100;
		display: flex;
		align-items: center; /* Vertically center the icon and text */
		gap: 8px; /* Spacing between icon and text */
		transition: box-shadow 0.2s, transform 0.2s;
	}
	.en .floating-button i.fa.fa-sliders {
		margin-top: 4px;
	}
	.select-column select{
		color: #939393;
		line-height: 1;
	}
	.select-column select option{
		direction: rtl;
	}
	.explore-inner-container {
		padding-top: 27px!important;
	}
	.hide-button {
		/* position: fixed; */
		/* bottom: 20px;
		right: 40%; */
		background-color: #fff; /* White background for the button */
		color: #424242; /* Dark text */
		padding: 1px 20px; /* Adjust padding for button size */
		border-radius: 20px; /* Rounded edges */
		/* box-shadow: -2px 4px 4px 3px rgba(0, 0, 0, 0.1); */
		border: 1px solid #ccc; /* Border to match the design */
		font-size: 14px; /* Adjust font size */
		/* font-weight: bold; */
		cursor: pointer;
		/* z-index: 1100; */
		display: flex;
		align-items: center; /* Vertically center the icon and text */
		gap: 10px; /* Spacing between icon and text */
		transition: box-shadow 0.2s, transform 0.2s;
	}

	/* Icon inside the button */
	.floating-button i, .hide-button i {
		font-size: 14px; /* Adjust icon size */
		color: gray;
	}

	/* Hover effect */
	.floating-button:hover, .hide-button:hover {
		box-shadow: 0px 6px 15px rgba(0, 0, 0, 0.2); /* Slightly stronger shadow */
		transform: translateY(-2px); /* Lift the button slightly */
	}
	.question-container{
		text-align: start!important;
		margin-right: 0px!important;
	}
	.radio-options {
		margin-right: 0px !important;
	}
	.select-column {
		padding-bottom: 5px; /* Space below each field */
		margin-bottom: 10px; /* Space between fields */
		border-bottom: 1px solid #eee; /* Line color */
	}
	.select-column select {
		border-radius: 0px!important;
		border: 1px solid #999999!important;
	}
	.question-container{
		margin-right: 0px;
	}
	.btn-reset-filter-mobile {
		color: #7b7878 !important;
		margin-right: 20px;
		display: inline-flex;
		align-items: center;
		gap:6px;
		padding: 0px 0px 0px 10px;
		white-space: nowrap;
		cursor: pointer;
	}
	.btn-reset-filter-mobile i{
		padding-top: 7px;

	}
	.search-btn-mobile{
		display: flex;
		border-width: 0px;
		color:white;
		width: 140px;
		gap: 20px;
		height: 42px;
		background: inherit;
		background-color: rgba(102, 102, 102, 1);
		border: none;
		border-radius: 5px;
		font-weight: 400;
		font-style: normal;
		font-size: 16px;
        padding: 0px 13px 7px 30px;
	}
	 .desctop-filtrations{
		display: none;
	 }
	 /* explore projects */
	 .explore-projects {
		 width: 100%;
	 }
	 .show-more-main .button-small {
		 display: block;
	 }
	 /* explore leaderboard */
	 .explore-leaderboard {
		 width: 100%;
		 padding: 0 10px;
	 }
	 .leader-profilepic {
		 margin-left: 15px;
	 }
	 .leader-title {
		 font-size: 16px;
		 max-width: 120px;
		 line-height: initial;
		 margin-top: 10px;
		 height: auto;
	 }
	 .explore-tabs-block{
		 display: none;
	 }
	 /****************************** page */
	 .page-cover h1 {
		 font-size: 30px;
		 margin-top: 75px;
	 }
	 .page-content {
		 width: 80%;
	 }
	 .page-cell.table {
		 display: block;
	 }
	 .page-cell.space {
		 padding-top: 15px;
		 padding-right: 0px;
	 }
	 .page-cell.partner-logo {
		 width: 23%;
		 text-align: center;
		 display: table !important;
		 margin: 0 auto 10px;
	 }
	 /****************************** login */
	 .signin-container {
		 padding: 0 25px 25px;
		 box-sizing: border-box;
	 }
	 .signin-container .title-large, .signin-container .title-medium {
		 text-align: center;
		 margin-top: 35px;
	 }
	 .signin-field input[type=text], .signin-field input[type=password] {
		 width: 250px;
	 }
	 .block-third {
		 width: 85%;
		 float: none;
		 margin: 0 auto 40px;
	 }
	 /* register popup */
	 .register-dialog {
		 width: 100%;
		 margin: 25px auto 0;
	 }
	 .register-field {
		 width: 100%;
	 }
	 .register-field.left {
		 float: none !important;
		 display: inline-block;
	 }
	 .register-field input[type=text], .register-field input[type=password], .register-field select {
		 /*        width:100%;*/
	 }
	 .register-confirm {
		 width: auto;
		 padding: 46px 25px 50px;
	 }
	 /****************************** contribute */
	 .contribute-container-grey {
		 width: 100%;
		 padding: 10px;
		 box-sizing: border-box;
	 }
	 .contribute-container {
		 width: 100%;
		 padding: 0 10px;
		 box-sizing: border-box;
	 }
	 .contribute-container .project-sim-option.padded {
		 margin: 0 auto 15px;
	 }
	 .contribute-tabs-block {
		 width: 90%;
	 }
	 ul.contribute-tabs li {
		 margin: 0 0 0 30px;
	 }
	 /****************************** file upload */
	 .fileinput-button.style2 {
		 bottom: 75px;
	 }
	 .progress-bar-container {
		 width: 64%;
	 }
	 /****************************** wizard mobile*/
	 .wizard-field-container {
		 display: block;
		 width: 100% !important;
		 margin: 23px 0px;
	 }
	 .wizard-button {
		 margin: 10px auto;
		 width: 130px;
		 padding: 6px;
	 }
	 .wizard-navigation-txt {
		 font-size: 14px;
		 flex-basis: 80%;
	 }
	 .wizard-navigation-link {
		 font-size: 12px;
	 }
	 .wizard-header .grey {
		 font-size: 14px;
	 }
	 .wizard-header p {
		 font-size: 16px;
	 }
	 .wizard-field-container p, .wizard-field-container .wizard-field {
		 display: block;
		 width: 100%;
		 font-size: 14px;
	 }
	 .wizard-field input, .wizard-field select {
		 text-align: center;
		 border: none;
		 border-bottom: solid 1px #cccccc;
		 font-size: 14px;
		 border-bottom-right-radius: 0px;
		 border-bottom-left-radius: 0px;
	 }
	 .wizard_main_back {
		 font-size: 14px;
	 }
	 .wizard-content h3 {
		 font-size: 16px;
		 margin: 0px;
	 }
	 .wizard-content {
		 margin-top: 20px;
	 }
	 .content-instructions {
		 font-size: 14px;
	 }
	 .wizard_container ul.parsley-errors-list {
		 position: relative;
	 }
	 .mobile-flex-grow-0-75 {
		 flex-grow: 0.75;
	 }
	 .mobile-flex-grow-1 {
		 flex-grow: 1;
	 }
	 .mobile-d-block {
		 display: block !important;
	 }
	 .mobile-d-flex {
		 display: flex !important;
	 }
	 .mobile-d-none {
		 display: none !important;
	 }
	 .mobile-margin-b-2 {
		 margin-bottom: 20px;
	 }
	 .mobile-margin-b-3 {
		 margin-bottom: 30px;
	 }
	 .mobile-padding-b-2 {
		 padding-bottom: 20px;
	 }
	 .mobile-flex-wrap-w {
		 flex-wrap: wrap;
	 }
	 .padding-m-x-1-5 {
		 padding-right: 15px;
		 padding-left: 15px;
	 }
	.settings-btn-group {
		padding: 8px !important;
		padding-block: 15px !important;
		gap: 25px !important;
	}
	#settings-form .button-small{
    	min-width: 93px !important;
	}
 }
 
 @media only screen and (min-width: 320px) and (max-width: 667px) {
	 .user-vip-btn {
		 width: 100% !important;
	 }
	 .user-project-vip-section {
		 display: block;
	 }
	 .user-social-graph {
		 padding: 10px 40px !important;
	 }
	 .user-vip-arrow {
		 width: 20% !important;
	 }
 }
 
 @media only screen and (min-width: 360px) and (max-width: 640px) {
	 /* project slider (favorites, trending, newest, ending) */
	 .home-project-list, .home-news-list, .report-list-slider, .home-story-list {
		 width: 85%;
		 height: 370px;
	 }
	 .home-project-prev {
		 margin-left: -20px;
		 margin-top: 130px;
	 }
	 .home-project-next {
		 margin-right: -20px;
		 margin-top: 130px;
	 }
	 .home-project-slide, .home-news-slide, .report-cell-slide {
		 width: 310px;
		 height: 370px !important;
		 margin-right: 0;
		 /*49px;*/
	 }
	 .home-project-cover, .home-news-cover {
		 height: 310px;
		 position: relative;
		 overflow: hidden;
	 }
 }
 
 @media only screen and (min-width: 375px) and (max-width: 667px) {
	 /****************************** home */
	 .highlight-dark {
		 height: 192px;
	 }
	 /* explore section */
	 .explore-categories li {
		 width: 50px;
		 font-size: 10px;
	 }
	 .explore-icon img {
		 width: 40px;
	 }
	 /* trending section */
	 .trending-title, .newest-title, .ending-title {
		 padding: 0 15px 0 15px;
	 }
	 .trending-title.title-grey, .newest-title.title-grey, .ending-title.title-grey {
		 font-size: 22px;
	 }
	 /* project slider (favorites, trending, newest, ending) */
	 .home-project-list, .home-news-list, .report-list-slider, .home-story-list {
		 width: 85%;
		 height: 370px;
	 }
	 .home-project-prev {
		 margin-left: -20px;
		 margin-top: 130px;
	 }
	 .home-project-next {
		 margin-right: -20px;
		 margin-top: 130px;
	 }
	 .home-project-slide, .home-news-slide, .report-cell-slide {
		 width: 320px;
		 height: 370px !important;
		 margin-right: 0/*49px*/
		 ;
	 }
	 .home-project-cover, .home-news-cover {
		 height: 320px;
		 position: relative;
		 overflow: hidden;
	 }
	 .home-project-cover img, .home-news-cover img {
		 width: 370px;
	 }
	 .home-project-category {
		 margin: 0 15px 0 0;
	 }
	 .home-project-progress {
		 width: 270px;
		 height: 6px;
	 }
	 /****************************** project */
	 .project-cover {
		 width: 100%;
		 height: 193px;
	 }
	 /****************************** graph (user) */
	 .social-graph-canvas {
		 width: 350px;
	 }
	 /****************************** footer */
	 .separator {
		 margin: 65px 0;
	 }
	 ul.footer-menu li {
		 /*        float:right;*/
		 width: 125px;
		 padding: 10px;
	 }
	 .footer-list {
		 width: 50%;
	 }
	 ul.powered {
		 margin: auto;
		 display: block;
		 float: none;
		 width: 100% !important;
		 margin-top: 40px;
	 }
	 /****************************** search */
	 /* search user */
	 .search-user-details {
		 width: 160px;
	 }
	 /****************************** explore */
	 .leader-title {
		 max-width: 175px;
	 }
	 /****************************** login */
	 .signin-field input[type=text], .signin-field input[type=password] {
		 width: 300px;
	 }
	 /****************************** contribute */
	 .contribute-button-fly {
		 position: fixed;
		 z-index: 200;
		 bottom: 0px;
		 left: 30%;
		 box-shadow: 0 1px 10px rgba(0, 0, 0, 0.20);
	 }
 }
 
 @media only screen and (min-width: 412px) and (max-width: 732px) {
	 /* project slider (favorites, trending, newest, ending) */
	 .home-project-list, .home-news-list, .report-list-slider, .home-story-list {
		 width: 83%;
		 height: 370px;
	 }
	 .home-project-prev {
		 margin-left: -25px;
		 margin-top: 130px;
	 }
	 .home-project-next {
		 margin-right: -25px;
		 margin-top: 130px;
	 }
	 .home-project-slide, .home-news-slide, .report-cell-slide {
		 width: 342px;
		 height: 400px !important;
		 margin-right: 0;
		 /*49px;*/
	 }
	 .home-project-cover {
		 height: 342px;
		 position: relative;
		 overflow: hidden;
	 }
 }
 
 @media only screen and (min-width: 414px) and (max-width: 667px) {
	 .home-project-slide, .home-news-slide, .report-cell-slide {
		 margin-right: 15px;
		 margin-left: 15px;
	 }
	 .team-img-container {
		 width: 100%;
		 padding-left: 25%;
		 padding-right: 25%;
	 }
 }
 
 @media only screen and (min-width: 375px) and (max-width: 667px) and (orientation: landscape) {
	 /****************************** header */
	 .header-project .editmode-button {
		 min-width: 75px;
		 max-width: 125px;
	 }
	 .header-editmode .editmode-button {
		 min-width: 75px;
		 max-width: 125px;
	 }
	 .team-img-container {
		 width: 100%;
		 padding-left: 25%;
		 padding-right: 25%;
	 }
	 /****************************** home */
	 /* highlights section */
	 #highlight-section {
		 height: 342px;
	 }
	 .highlight {
		 height: 342px;
	 }
	 .highlight .stretch-width {
		 width: 100%;
	 }
	 .highlight-dark {
		 height: 342px;
	 }
	 /****************************** project */
	 .project-cover {
		 width: 100%;
		 height: 371px;
	 }
	 .project-pledge-contribute {
		 width: 100%;
	 }
	 .project-pledge-contribute .block {
		 width: 31%;
		 float: right;
		 padding: 0;
	 }
	 .project-pledge-contribute .separator {
		 background: #cccfd4;
		 width: 2px;
		 height: 45px;
		 margin: 5px;
		 float: right;
	 }
	 /****************************** explore */
	 .leader-title {
		 height: 55px;
		 max-width: none;
		 line-height: 55px;
		 margin-top: 0;
	 }
 }
 
 @media only screen and (min-width: 320px) and (max-width: 568px) and (orientation: landscape) {
	 /****************************** home */
	 /* highlights section */
	 #highlight-section {
		 height: 291px;
	 }
	 .highlight {
		 height: 291px;
	 }
	 .highlight-dark {
		 height: 291px;
	 }
	 /****************************** project */
	 .project-cover {
		 width: 100%;
		 height: 311px;
	 }
 }
 
 /* edit image popup */
 
 .edit-image-fade, .edit-image-fade-preview, .edit-image-fade-coverpic_facebook {
	 background: rgba(0, 0, 0, 0.65);
	 position: fixed;
	 top: 0;
	 right: 0;
	 bottom: 0;
	 left: 0;
	 outline: 0;
	 z-index: 1001;
	 display: none;
	 overflow-x: hidden;
	 overflow-y: auto;
 }
 
 .edit-image-dialog, .edit-image-dialog-preview, .edit-image-dialog-coverpic_facebook {
	 position: relative;
	 margin: 50px auto 0;
	 width: 800px;
	 display: none;
	 -webkit-transform: translate(0, -25%);
	 -ms-transform: translate(0, -25%);
	 -o-transform: translate(0, -25%);
	 transform: translate(0, -25%);
	 transition: transform 0.3s ease-out;
 }
 
 .edit-image-dialog.in, .edit-image-dialog-preview.in, .edit-image-dialog-coverpic_facebook.in {
	 -webkit-transform: translate(0, 0);
	 -ms-transform: translate(0, 0);
	 -o-transform: translate(0, 0);
	 transform: translate(0, 0);
 }
 
 .edit-image-close,  .edit-image-close-preview,  .edit-image-close-coverpic_facebook {
	 width: 20px;
	 height: 20px;
	 background: url('../images/sprite.png') -56px -86px no-repeat;
	 left: 19px;
	 top: 26px;
	 cursor: pointer;
	 position: absolute;
 }
 
 .edit-image-content, .edit-image-content-preview, .edit-image-content-coverpic_facebook {
	 min-height: 500px;
	 position: relative;
	 background-color: #fff;
	 box-shadow: 0 1px 10px rgba(0, 0, 0, 0.20);
	 -moz-border-radius: 1px;
	 -webkit-border-radius: 1px;
	 border-radius: 1px;
 }
 
 .edit-image-img,  .edit-image-img-preview,  .edit-image-img-coverpic_facebook {
	 width: 50px;
	 height: auto;
	 display: block;
	 margin: auto;
 }
 
 .edit-image-header , .edit-image-header-preview, .edit-image-header-coverpic_facebook{
	 height: 65px;
	 background: #f0f0f0;
	 padding: 20px;
	 font-size: 28px;
 }
 
 .edit-image-title,  .edit-image-title-preview,  .edit-image-title-coverpic_facebook{
	 margin: 15px 30px 0 0;
 }
 
 /* News section */
 
 .news-main-title {
	 font-size: 23px;
	 font-weight: bold;
	 margin: 0px 25px;
	 margin-top: 50px;
 }
 
 .display-news {
	 margin: 0px 20px;
 }
 
 .orange-underline {
	 color: var(--primary-color);
	 text-decoration: underline;
 }
 
 .articles-main {
	 margin: 20px 1.5%;
	 width: 30%;
	 display: inline-block;
	 vertical-align: top;
	 cursor: pointer;
	 position: relative;
 }
 
 .article-info {
	 width: 100%;
	 height: 90px;
	 background: rgba(0, 172, 244, 0.45);
	 position: absolute;
	 bottom: 0;
	 left: 0;
	 color: #fff;
	 z-index: 10;
 }
 
 .article-info-description {
	 font-size: 15px;
	 text-align: center;
	 padding: 10px 15px;
	 margin: 0 auto 0 auto;
	 display: none;
 }
 
 .article-main {
	 padding: 15px 40px 35px;
	 padding-top: 40px;
 }
 
 .article-header {
	 width: 100%;
	 height: 30px;
	 padding: 0px 20px;
	 line-height: 30px;
 }
 
 .article-title {
	 float: right;
	 margin: 0px;
	 font-size: 27px;
	 line-height: 40px;
 }
 
 .article-info-title {
	 font-size: 18px;
	 font-weight: bold;
	 text-align: center;
	 padding: 20px 15px;
	 padding-bottom: 5px;
	 margin: 0 auto 0 auto;
	 display: table;
 }
 
 .article-date {
	 float: right;
	 color: #23232b;
	 margin: 0px;
	 margin-top: 8px;
 }
 
 .news-img {
	 width: 100%;
	 height: 300px;
	 object-fit: cover;
 }
 
 .article-img {
	 width: 100%;
	 object-fit: cover;
	 margin: 15px 0px;
 }
 
 .news-hr {
	 color: #dedee6;
 }
 
 .articles-main .separator-line1 {
	 background: #fff;
 }
 
 .social-media {
	 width: 100%;
	 padding: 15px 40px 35px;
 }
 
 .social-media h3 {
	 line-height: 24px;
	 margin: 0;
 }
 
 .all-news {
	 float: left;
 }
 
 .all-news a {
	 font-size: 24px;
	 color: var(--primary-color) !important;
	 text-decoration: none;
	 font-weight: bold;
 }
 
 .social-media-news .project-desc {
	 margin-top: 0px;
 }
 
 @media only screen and (min-width: 320px) and (max-width: 374px) {
	 .graph-project-details {
		 top: 350px;
	 }
 }
 
 @media only screen and (min-width: 320px) and (max-width: 360px) {
	 .header-mobile a.signin {
		 font-size: 12px;
	 }
 
	 .header-mobile-a {
		 margin-right: 15%;
		 margin-left: 20%;
	 }
	 
	 .notification-icon{
		 width: 25px;
		 height: 20px;
	 }
 }
 
 .dialog-fade {
	 background: rgba(0, 0, 0, 0.65);
	 position: fixed;
	 top: 0;
	 right: 0;
	 bottom: 0;
	 left: 0;
	 outline: 0;
	 z-index: 1001;
	 display: none;
	 overflow-x: hidden;
	 overflow-y: auto;
 }
 
 .main-dialog {
	 position: relative;
	 margin: 50px auto 0;
	 width: 80%;
	 max-width: 800px;
	 display: none;
	 -webkit-transform: translate(0, -25%);
	 -ms-transform: translate(0, -25%);
	 -o-transform: translate(0, -25%);
	 transform: translate(0, -25%);
	 transition: transform 0.3s ease-out;
 }
 
 .main-dialog.in {
	 -webkit-transform: translate(0, 0);
	 -ms-transform: translate(0, 0);
	 -o-transform: translate(0, 0);
	 transform: translate(0, 0);
 }
 
 .dialog-close {
	 width: 20px;
	 height: 20px;
	 background: url('../images/sprite.png') -56px -86px no-repeat;
	 left: 19px;
	 top: 26px;
	 cursor: pointer;
	 position: absolute;
 }
 
 .dialog-main-content {
	 min-height: 300px;
	 position: relative;
	 background-color: #fff;
	 box-shadow: 0 1px 10px rgba(0, 0, 0, 0.20);
	 -moz-border-radius: 1px;
	 -webkit-border-radius: 1px;
	 border-radius: 1px;
 }
 
 .dialog-content {
	 padding: 0px 50px 20px;
 }
 
 .dialog-header {
	 min-height: 65px;
	 background: #f0f0f0;
	 padding: 10px 20px;
	 font-size: 28px;
 }
 
 .text-small-hint {
	 margin-right: 15px;
	 color: #b0b3b6;
 }
 
 .vertical-align {
	 display: flex;
	 align-items: center;
 }
 
 .not-complete {
	 color: var(--primary-color);
	 cursor: pointer;
	 margin: 8px 0px;
	 left: 5%;
	 position: absolute;
	 text-align: left;
	 width: 30%;
 }
 
 .feild-fit-width {
	 width: fit-content;
	 float: left;
 }
 
 .project_vip-button2 {
	 margin: 10px 0 0 0;
	 float: left;
 }
 
 .project_vip-button3 {
	 margin: 10px 0 0 0;
 }
 
 .orange-hr {
	 border: solid 0.5px var(--primary-color);
 }
 
 .p-project-image {
	 text-align: center;
	 margin-bottom: 0px;
 }
 
 .button-create-project {
	 width: 95%;
	 font-size: 15px;
	 margin: auto;
	 margin-top: 10px;
 }
 
 .hr-create-project {
	 border: solid 0.5px #ededee;
	 width: 95%;
 }
 
 .crop-icon {
	 position: absolute;
	 top: 0;
	 width: 15%;
	 left: 0;
	 cursor: pointer;
 }
 
 .project-img-cover {
	 height: 130px;
	 background-color: #f0f0f0;
	 background-size: cover;
	 background-position: 50% 50%;
	 position: relative;
 }
 
 .exit {
	 text-align: center;
	 padding: 20px 0px
 }
 
 .exit-button {
	 width: 220px;
	 margin: auto;
	 margin-top: 10px;
 }
 
 #ngo_editor_content {
	 margin: 20px auto 0;
 }
 
 .ngo-board-label {
	 width: 15%;
 }
 
 .ngo-board-input {
	 width: 25%;
	 margin-right: 5%;
 }
 
 .ngo-board-input2 {
	 width: 25%;
	 margin-right: 11.2%;
 }
 
 #ngo_editor .ngo-editor-board-block li {
	 margin-top: 8px;
 }
 
 #ngo_editor .impact-figure-edit {
	 height: 30px;
	 font-size: 18px;
	 margin-right: 25px;
 }
 
 #ngo_editor .impact-description-edit {
	 margin-right: 17px;
 }
 
 #ngo_editor .impact-cell, #ngo_editor .impact-cell2, #compnay_editor .impact-cell {
	 width: 100%;
	 text-align: right;
 }
 
 #ngo_editor .impact-description {
	 padding-right: 0px;
 }
 
 #ngo_editor .impact-cell-extra {
	 padding: 0px;
 }
 
 #ngo_editor .impact-add {
	 margin: 0px;
 }
 
 #ngo_editor .impact-add span {
	 margin-top: -5px;
	 display: inline-block;
	 margin-right: 10px;
	 vertical-align: middle;
 }
 
 #ngo_editor .step-9 .button-small:hover {
	 color: #fff;
 }
 
 .ngo-add-image {
	 bottom: 0;
	 left: -150%;
	 position: relative;
	 width: 140px;
 }
 
 #ngo_editor .description-div {
	 width: 75%;
	 margin-right: 22%;
 }
 
 #ngo_editor .description-div p {
	 margin: 0px;
 }
 
 #ngo_editor .description-textarea {
	 height: 115px;
	 width: 100%;
 }
 
 #ngo_editor .photo-wrap img {
	 width: 20%;
 }
 
 #ngo_editor .photo-cell, #ngo_editor .photo-wrap {
	 width: 100%;
	 height: auto;
 }
 
 #step-11-photos .photo-cell .photo-del {
	 left: 20px;
	 top: 0px;
 }
 
 #step-11-photos .photo-edit {
	 position: static !important;
	 margin: 55px !important;
	 left: 60px;
	 /* top: -2px; */
	 cursor: pointer;
 }
 
 #step-11-photos .photo-wrap img {
	top: -2px !important;
 }

 #ngo_editor .ngo-board-cell {
	 margin-top: 15px;
 }
 
 #ngo_editor .ngo-member-input {
	 position:absolute;
	 right: 570%;
	 width: 400%;
	 top: 60px;
	 height: 30px;
 }
 
 .add-icon {
	 width: 4%;
	 top: 13px;
	 position: absolute;
	 left: 95%;
 }
 
 #ngo_editor .ngo-board-add, #ngo_editor .impact-add {
	 text-align: right;
	 margin: 0px;
 }
 
 #ngo_editor .ngo-board-add span {
	 margin-right: 45px;
	 /* margin-top: 5px; */
 }
 
 #ngo_editor .impact-add span {
	 margin-right: 25px;
	 margin-top: 5px;
 }
 
 .add-icon-2 {
	 width: 15%;
	 position: absolute;
	 left: 90%;
 }
 
 .en #ngo_editor #step-2 .parsley-errors-list {
	 margin-top: 15px;
	 margin-right: 20px;
	 position: absolute;
     left: 55%;
 }
.ar #ngo_editor #step-2 .parsley-errors-list {
	margin-top: 15px;
	margin-right: 20px;
	position: absolute;
	right: 55%;
}

 #ngo_editor #impact-list2 {
	 display: block;
 }
 
 .vertical-line {
	 border-left: 1.5px solid #eee;
	 height: 30px;
	 width: fit-content;
	 display: inline-block;
	 vertical-align: middle;
	 margin: 0px 5px;
 }
 
 .pagination {
	 display: inline-block;
	 vertical-align: middle;
 }
 
 .current-page {
	 color: #fff;
	 background: var(--primary-color);
	 width: 25px;
	 height: 25px;
	 border-radius: 50%;
	 display: inline-block;
	 text-align: center;
	 padding: 5px 2px;
	 vertical-align: middle;
	 margin-right: 5px;
 }
 
 .pagination-anchor {
	 cursor: pointer;
	 text-decoration: none;
	 font-size: 30px;
	 color: var(--primary-color);
	 padding: 0px 3px;
 }
 
 .pagination-prev, .pagination-next, .pagination-last, .pagination-first {
	 display: inline-block;
	 vertical-align: middle;
 }
 
 .pagination-all-pages {
	 direction: rtl;
	 display: inline-block;
	 vertical-align: middle;
 }
 
 #project_form ul.parsley-errors-list, #user-profile_form ul.parsley-errors-list {
	 margin-right: 10px;
	 margin-top: 15px;
 }
 
 .location-error {
	 font-size: 18px;
	 text-align: center;
	 display: none;
	 position: absolute;
	 left: 0;
	 right: 0;
	 top: 47%;
	 bottom: 0;
 }
 
 .ngo-annual-report-list {
	 padding: 20px 40px;
 }
 
 .report-cell {
	 width: 15%;
	 margin: 0px 5%;
	 text-align: right;
	 padding: 15px 0;
	 position: relative;
	 float: right;
 }
 
 .report-file {
	 padding-top: 20px;
 }
 
 .report-year-edit {
	 width: 190px;
	 height: 27px;
	 font-size: 16px;
	 text-align: center;
	 border: solid 2px var(--primary-color);
 }
 
 .file-ext {
	 line-height: 20px;
	 font-size: 14px;
 }
 
 .report-file-div {
	 text-align: center;
	 vertical-align: middle;
	 line-height: 90px;
	 border: solid 1px;
 }
 
 .download-file-icn {
	 width: 50%;
	 margin: 10px auto;
 }
 
 .report-cell-slide {
	 background: transparent !important;
	 height: 270px !important;
 }
 
 .report-list-slider {
	 height: 300px !important;
 }
 
 .report-del, .update-del {
	 margin-top: 10px;
	 position: absolute;
	 width: 30px;
	 height: 30px;
	 background: url('../images/sprite.png') -161px -86px no-repeat;
	 left: 10px;
	 top: 0;
	 cursor: pointer;
 }
 
 #report-list-slider .home-project-next, #report-list-slider .home-project-prev {
	 margin-top: 120px;
 }
 
 .resp-video-container {
	 position: relative;
	 overflow: hidden;
	 padding-top: 56.25%;
 }
 
 .vertical-story-slider {
	 position: relative;
	 overflow: hidden;
	 margin-bottom: 10px;
 }
 
 .story-vertical-slider {
	 max-height: 570px;
	 overflow-y: auto;
	 margin-top: 25px;
 }
 
 /****************************** University Dashboard */
 
 .uni-dashboard {
	 margin-top: 70px;
 }
 
 .uni-dashboard-welcome {
	 text-align: center;
	 background: var(--primary-color);
 }
 
 .uni-dashboard-welcome h2 {
	 text-align: center;
	 margin: 20px auto;
	 color: #fff;
 }
 
 /* section tabs */
 
 .ngo-tabs-block {
	 width: 91%;
 }
 
 ul.uni-tabs, ul.ngo-dashboard-tabs {
	 list-style: none;
	 margin: 0;
	 float: right;
	 padding: 0px;
 }
 
 ul.uni-tabs li, ul.ngo-dashboard-tabs li {
	 float: right;
	 padding: 20px 0 17px 0;
	 margin: 0 0 0 20px;
	 cursor: pointer;
	 width: 90%;
	 color: #c2c2c2;
	 font-size: 24px;
	 text-align: center;
	 border-bottom: solid 0.02px #c2c2c2;
 }
 
 ul.uni-tabs li.current, ul.ngo-dashboard-tabs li.current {
	 color: var(--primary-color);
	 border-bottom: solid 3px var(--primary-color);
	 font-weight: bold;
 }
 
 #uni-detail-students, #uni-detail-projects, #uni-detail-create-project, #uni-detail-confirm-students, #uni-detail-volunteers-team,#ngo-detail-account-manager-log-list {
	 display: none;
 }
 
 .uni-dashboard hr {
	 border: 0.5px solid #c2c2c2;
	 margin: 0px;
 }
 
 .uni-icon {
	 width: 100%;
	 float: left;
	 border: 0.5px solid #eee;
	 border-radius: 50%;
 }
 
 .uni-fiqure-value {
	 color: var(--primary-color);
	 font-size: 60px;
	 margin: 0px;
	 text-align: center;
	 font-weight: bold;
 }
 
 .uni-fiqure-title {
	 color: var(--primary-color);
	 font-size: 30px;
	 margin: 10px 0px;
	 text-align: center;
 }
 
 #students-list, #students-confirm-table {
	 width: 100%;
	 text-align: right;
 }
 
 #students-list, #students-confirm-table {
	 border-collapse: collapse;
	 width: 100%;
 }
 
 #students-list td, #students-list th, #students-confirm-table td, #students-confirm-table th {
	 border: 1px solid #ddd;
	 padding: 8px;
 }
 
 .student-row {
	 height: 87px;
 }
 
 .student-row:hover, #students-list .donor-row:hover, #students-list .donor-row:hover .donor_id, #students-confirm-table .donor-row:hover, #students-confirm-table .donor-row:hover .donor_id {
	 background-color: var(--primary-color);
	 color: #fff;
 }
 
 #students-list th, #students-confirm-table th {
	 padding-top: 12px;
	 padding-bottom: 12px;
	 text-align: center;
	 font-size: 20px;
 }
 
 .student_id:hover {
	 color: #fff;
	 cursor: pointer;
 }
 
 .student-info {
	 margin-top: 20px;
	 background: #efeff7;
	 padding: 15px;
 }
 
 .students-filter select, .students-filter input {
	 width: 100%;
	 border: solid 1px #c2c2c2;
	 padding: 5px 10px;
	 font-size: 15px;
	 background: #fff;
	 margin-top: 20px;
	 height: 50px;
 }


 .close-uni-dashboard {
	 padding-top: 6px;
	 border-radius: 50%;
	 background: #fff;
	 width: 30px;
	 height: 30px;
	 margin-left: 5%;
	 cursor: pointer;
 }
 
 .close-uni-dashboard p {
	 margin: 0px;
	 color: var(--primary-color);
	 font-weight: bold;
	 font-size: 19px;
 }
 
 .verticalLine {
	 border-left: 0.5px solid #c2c2c2;
 }
 
 #total-impact-text, #monthly-impact-text {
	 position: absolute;
	 left: 5%;
	 top: 43%;
	 text-align: center;
	 font-weight: bold;
	 font-size: 18px;
	 margin: 0px 25%;
	 width: 50%;
 }
 
 #total-impact-icon, #monthly-impact-icon {
	 display: none;
	 width: 10%;
	 margin: 0px 45%;
	 position: absolute;
	 left: 12%;
	 top: 30%;
	 text-align: center;
 }
 
 #total-impact-category, #monthly-impact-category {
	 width: 10%;
	 margin: 0px 45%;
	 position: absolute;
	 left: 1%;
	 top: 32%;
	 text-align: center;
 }
 
 .applied-filters, .applied-filter-payment {
	 height: 25px;
	 width: 25px;
	 padding: 6px;
	 background: red;
	 border-radius: 50%;
	 color: #fff;
	 font-weight: bold;
	 position: absolute;
	 display: none;
	 text-align: center;
	 left: -8%;
	 top: -18%;
 }
 
 .uni-dashboard .orange-hr {
	 border: 2px solid var(--primary-color);
 }
 
 .highcharts-yaxis text {
	 fill: var(--primary-color) !important;
 }
 
 #students_filter .select2-container, #payment_list_filter .select2-container {
	 width: 100% !important;
	 text-align: right;
 }
 
 #students_filter .select2-container--default, #students_filter .select2-selection--single, #students_filter .select2-selection__arrow, #payment_list_filter .select2-container--default, #payment_list_filter .select2-selection--single, #payment_list_filter .select2-selection__arrow {
	 left: 1px;
	 top: 15px;
 }
 
 #students_filter .select2-container--default, #students_filter .select2-selection--single, #payment_list_filter .select2-container--default, #payment_list_filter .select2-selection--single {
	 height: 50px;
 }
 
 #students_filter .select2-container--default, #students_filter .select2-selection--single, #students_filter .select2-selection__rendered, #payment_list_filter .select2-container--default, #payment_list_filter .select2-selection--single, #payment_list_filter .select2-selection__rendered {
	 line-height: 50px !important;
 }
 
 #students_filter .select2-container, #students_filter .select2-selection--single, #students_filter .select2-selection__rendered, #payment_list_filter .select2-container, #payment_list_filter .select2-selection--single, #payment_list_filter .select2-selection__rendered {
	 padding-right: 2px;
 }
 
 #main-uni .croppie-container {
	 height: auto;
 }
 
 a.sort-by {
	 padding-right: 18px;
	 position: relative;
	 color: #dedee1;
 }
 
 a.sort-by:before, a.sort-by:after {
	 border: 4px solid transparent;
	 content: "";
	 display: block;
	 height: 0;
	 right: 5px;
	 top: 50%;
	 position: absolute;
	 width: 0;
 }
 
 a.sort-by:before {
	 border-bottom-color: #dedee1;
	 margin-top: -9px;
 }
 
 a.sort-by:after {
	 border-top-color: #dedee1;
	 margin-top: 1px;
 }
 
 #uni-dashboard-pic, #ngo-dashboard-pic {
	 cursor: pointer;
 }
 
 .dashboard-menu {
	 position: fixed;
	 left: 33px;
	 top: 75px;
	 display: none;
	 z-index: 25;
 }
 
 .dashboard-menu ul {
	 list-style: none;
	 font-size: 15px;
	 margin: 0;
	 padding: 0;
	 position: absolute;
	 top: 0;
	 left: 25px;
	 z-index: 2;
	 width: 200px;
	 background: #fff;
	 padding: 16px 18px 7px;
	 box-shadow: 0 1px 10px rgba(0, 0, 0, 0.20);
 }
 
 .dashboard-menu ul li {
	 padding: 0 0 10px 0;
 }
 
 .dashboard-menu ul li a {
	 text-decoration: none;
 }
 
 .dashboard-menu-tip, .dashboard-menu-tip-top {
	 width: 14px;
	 height: 14px;
	 background: #fff;
	 position: absolute;
	 top: -7px;
	 left: 190px;
	 box-shadow: 0 1px 10px rgba(0, 0, 0, 0.20);
	 z-index: 1;
	 -moz-transform: rotate(45deg);
	 -o-transform: rotate(45deg);
	 -webkit-transform: rotate(45deg);
	 transform: rotate(45deg);
 }
 
 .dashboard-menu-tip-top {
	 width: 14px;
	 height: 14px;
	 background: #fff;
	 position: absolute;
	 top: -7px;
	 left: 190px;
	 box-shadow: none;
	 z-index: 3;
 }
 
 .uni-dashboard-confirm-student:hover {
	 color: #fff;
 }
 
 .uni-dashboard-delete-student:hover {
	 color: red;
 }
 
 .uni-dashboard-confirm-student {
	 color: var(--primary-color);
	 margin: 0px 10%;
	 cursor: pointer;
 }
 
 .uni-dashboard-delete-student {
	 color: red;
	 margin: 0px 10%;
	 cursor: pointer;
 }
 
 .student-row:hover .uni-dashboard-confirm-student {
	 color: #fff;
 }
 
 #confirm_delete_student_form {
	 padding: 40px 20px 52px 20px;
 }
 
 /****************************** Project impact card */
 
 .project-impacts {
	 width: 100%;
 }
 
 .project-impact-card {
	 position: relative;
	 background: #f4f4f4;
	 padding: 10px;
	 width: 22%;
	 margin: 10px 1%;
	 text-align: center;
	 color: #000000;
	 cursor: pointer;
	 display: inline-block;
 }
 
 .project-impact-card hr {
	 border: 1px solid #e0e0e0;
 }
 
 .project-impact-amount span {
	 font-weight: bold;
	 font-size: 22px;
 }
 
 .project-impact-amount {
	 font-weight: normal;
	 font-size: 18px;
 }
 
 .project-impact-hover {
	 display: none;
	 position: absolute;
	 background: #fd9e45;
	 width: 100%;
	 left: 0px;
	 top: 34%;
	 height: 66%;
 }
 
 .project-impact-hover p {
	 color: #fff;
	 font-weight: bold;
	 margin: 25%;
 }
 
 .project-impact-card:hover .project-impact-hover {
	 display: block;
 }
 
 .project-impact-card-selected {
	 position: relative;
	 padding: 10px;
	 width: 22%;
	 margin: 10px 1%;
	 text-align: center;
	 color: #fff;
	 background: #fd9e45;
	 display: inline-block;
 }
 
 .project-impact-card-selected hr {
	 border: 1px solid #fff;
 }
 
 .project-impact-plus, .project-impact-minus {
	 cursor: pointer;
	 width: 30%;
	 font-weight: bold;
	 font-size: 35px;
	 margin: 0px;
 }
 
 .project-impact-count {
	 background: #fff;
	 width: 40%;
	 font-weight: bold;
	 font-size: 35px;
	 margin: 0px;
 }
 
 .project-impact-card-selected .project-impact-count {
	 color: #fd9e45;
 }
 
 .total-impact-donation hr {
	 border: 0.5px solid #c2c2c2;
 }
 
 .project-contribute-scroll {
	 background: var(--primary-color);
	 color: #fff;
	 text-transform: uppercase;
	 font-weight: 600;
	 padding: 10px 0px;
	 cursor: pointer;
	 border: none;
	 -moz-border-radius: 5px;
	 -webkit-border-radius: 5px;
	 border-radius: 5px;
	 width: 100%;
	 text-align: center;
 }
 
 #contribute-button {
	 width: 350px;
	 font-size: 13px;
	 padding: 10px 10px;
	 text-align: center;
	 margin: 10px auto;
 }
 
 .project-impact-action {
	 height: 60px;
 }
 
 .project-impact-result {
	 width: 46%;
 }
 
 /****************************** NGO Dashboard */
 
 .volunteer-info {
	 border-left: 2px solid #ccc;
	 padding-left: 20px;
 }
 
 #settings-firstname, #settings-lastname, #settings-phone, #settings-password, #settings-password-confirm {
	 width: 100%;
	 height: 35px;
	 padding: 0px 5px;
	 padding-top: 4px;
 }
 
 .settings-btn-group {
	 display: flex;
	 padding: 40px;
	 padding-block: 15px;
	 justify-content: end;
	 gap: 200px;
 }
 
 .settings-btn-group > .deactivated-btn {
	 background-color: #dedede;
 }
 
 .settings-btn-group > .deactivated-btn:hover {
	 background-color: var(--primary-color);
 }
 
 #ngo-detail-lists, #ngo-detail-projects, #ngo-detail-volunteers {
	 display: none;
 }
 
 .ngo-stats-border-bottom {
	 border-bottom: 0.5px solid #c2c2c2;
 }
 
 .ngo-stats-border-right {
	 border-right: 0.5px solid #c2c2c2;
 }
 
 ul.ngo-dashboard-sub-tabs, ul.ngo-dashboard-projects-sub-tabs {
	 list-style: none;
	 margin: 0;
	 float: right;
	 padding: 0px;
	 width: 100%;
	 display: flex;
 }
 
 ul.ngo-dashboard-sub-tabs li, ul.ngo-dashboard-projects-sub-tabs li {
	 float: right;
	 padding: 20px 0 17px 0;
	 margin: 0 0 0 20px;
	 cursor: pointer;
	 width: 90%;
	 color: #c2c2c2;
	 font-size: 24px;
	 text-align: center;
	 border-bottom: solid 0.02px #c2c2c2;
 }
 
 ul.ngo-dashboard-sub-tabs li.current, ul.ngo-dashboard-projects-sub-tabs li.current {
	 color: var(--primary-color);
	 border-bottom: solid 3px var(--primary-color);
	 font-weight: bold;
 }
 
 .ngo-dashboard-toggle, .ngo-dashboard-vip-toggle {
	 cursor: pointer;
	 display: flex;
	 align-items: center;
 }
 
 .circle-projects-count {
	 width: 30px;
	 height: 30px;
	 line-height: 30px;
	 text-align: center;
	 border-radius: 50%;
	 border: solid 2px var(--primary-color);
	 color: var(--primary-color);
	 font-weight: bold;
	 padding-right: 1px;
 }
 
 .donor-details {
	 background: #f0f0f0;
	 margin: 20px;
	 padding: 0px 20px;
 }
 
 .ngo-sub-detail {
	 margin-top: 80px;
 }
 
 .download-lists, .download-team {
	 display: flex;
	 align-items: center;
	 justify-content: center;
	 width: 150px;
	 height: 36px;
	 margin-right: 20px;
 }
 
 .donor_id {
	 color: #000;
	 text-decoration: none;
 }
 
 .donor_id:hover {
	 color: #fff;
 }
 
 td .donor_id {
	 display: block;
	 width: 100%;
 }
 
 .invalid-paymnet, .invalid-volunteers {
	 color: red;
	 margin: 5px 0px;
	 margin-right: 40%;
 }
 
 .volunteer-number-note {
	 color: red;
	 font-size: 12px;
 }
 
 .button-volunteers, .button-volunteers:hover {
	 background-color: #ccc;
 }
 .button-volunteers-active, .button-volunteers-active:hover {
	background-color:var(--primary-color);
}

 .volunteers-fade .selected {
	 background-color: var(--primary-color);
 }
 
 .form-section {
	 display: none;
	 position: relative;
	 padding: 0px 50px;
 }
 
 .form-navigation {
	 padding: 0px 50px;
 }
 
 .form-section.current {
	 display: inherit;
 }
 
 #register-user-form .next, #register-user-form .send, #send_user_confirm_uni .send, #confirm_delete_student_form .send, #settings-form .next, #settings-form .send {
	 margin: 10px 0px;
	 display: inline-block;
	 float: left;
 }
 
 #confirm_delete_student_form .send {
	 margin: 0px 0px 10px 0px;
 }
 
 #register-user-form .previous, #register-user-form .back, #send_user_confirm_uni .back, #settings-form .previous, #settings-form .back, #settings-form .back-index {
	 margin: 10px 0px;
	 display: inline-block;
	 float: right;
 }
 
 #register-user-form .back, #send_user_confirm_uni .back, #register-user-form .previous, #settings-form .back, #settings-form .back-index, #settings-form .previous {
	 background: #e65151;
 }
 
 #register-user-form .submit, #settings-form .submit {
	 margin: 10px 0px;
	 display: inline-block;
	 float: left;
 }
 
 .circle-users-count {
	 width: 45px;
	 height: 45px;
	 text-align: center;
	 border-radius: 50%;
	 background: var(--primary-color);
	 color: #fff;
	 font-size: 18px;
	 float: left;
	 margin-top: 6px;
	 line-height: 50px;
 }
 
 #user-detail-gallery {
	 padding: 15px 0 15px 0;
	 display: none;
 }
 
 .croppie-container {
	 height: auto !important;
 }
 
 .home-stats {
	 margin: 70px auto;
 }
 
 .home-stats .content{
	 display: flex;
	 flex-direction: row;
	 flex-wrap: wrap;
 }
 /****************************** Volunteering Month Page */
 
 .volunteering-day {
	 width: 100%;
	 color: var(--primary-color);
	 background-color: #f2f2f2;
	 padding-right: 20px;
 }
 
 .volunteering-week .project {
	 padding: 5px 10px;
	 width: 24%;
	 height: 145px;
	 position: relative;
	 display: inline-block;
	 vertical-align: middle;
 }
 
 .volunteering-week .location {
	 margin: 0px;
 }
 
 .volunteering-week .location-txt {
	 text-decoration: underline;
	 color: var(--primary-color);
 }
 
 .volunteering-week h3 {
	 margin-top: 0px;
	 font-size: 16px;
 }
 
 .volunteering-week-toggle, .volunteering-locations-toggle {
	 display: flex;
	 cursor: pointer;
 }
 
 .volunteering-day-toggle {
	 display: flex;
	 cursor: pointer;
 }
 
 .volunteering-week .down-arrow {
	 font-size: 40px;
	 color: var(--primary-color);
	 margin-top: 3px;
 }
 
 .volunteering-week #volunteering-week-1-details, .volunteering-week #volunteering-week-2-details, .volunteering-week #volunteering-week-3-details, .volunteering-week #volunteering-week-4-details, .volunteering-week #volunteering-week-5-details {
	 display: none;
 }
 
 .volunteering-btn {
	 width: 90%;
	 text-align: center;
	 padding: 5px;
	 bottom: 0%;
	 position: absolute;
 }
 
 .home-stats-col {
	 display: inline-block;
	 width: 16%;
	 text-align: center;
 }
 
 .user-project-vip {
	 font-size: 16px;
	 width: 60%;
	 display: inline-block;
	 padding: 0px 15px;
 }
 
 .user-vip-btn {
	 font-size: 16px;
	 width: 24%;
	 min-width: fit-content;
	 display: inline-block;
 }
 
 .volunteering-week .v-line {
	 border-left: solid 1px #f2f2f2;
	 height: 160px;
	 display: inline-block;
	 vertical-align: top;
 }
 
 .volunteering-week .h-line {
	 border-top: 1px solid #f2f2f2;
	 margin: 0px;
 }
 
 #volunteers_form .parsley-required {
	 display: none;
 }
 
 #school-countries, #project-locations {
	 background: #fff;
	 width: 100%;
	 height: 27px;
	 text-align-last: center;
	 border: 0px;
	 outline: none;
	 margin-top: 0.5px;
	 color: var(--primary-color);
 }
 
 .school-rounded {
	 -webkit-border-radius: 50px;
	 -moz-border-radius: 50px;
	 -ms-border-radius: 50px;
	 border-radius: 0px;
	 border: 1px solid #bbb;
	 width: 30%;
	 height: 30px;
	 display: inline-block;
 }
 
 #school-countries option:checked, #school-countries option, #project-locations option:checked, #project-locations option {
	 color: #000;
 }
 
 .selected-group-wrapper {
	 display: inline-block;
	 width: 25%;
	 padding: 10px 0px;
 }
 
 .selected-uni-ngo-img {
	 width: 100%;
 }
 
 .selected-uni-ngo-name {
	 width: 72%;
	 margin: 0px;
	 margin-right: 10px;
	 font-size: 14px;
	 display: inline-block;
	 vertical-align: middle;
 }
 
 /****************************** Steps Progressbar */
 
 .ProgressBar {
	 margin: 0px;
	 padding: 0px;
	 padding-bottom: 15px;
	 list-style: none;
	 position: relative;
	 display: flex;
	 justify-content: space-between;
	 width: 110%;
	 margin-right: -5%;
	 margin-top: 30px;
 }
 
 .ProgressBar-step {
	 text-align: center;
	 position: relative;
	 width: 100%;
 }
 
 .ProgressBar-step:before, .ProgressBar-step:after {
	 content: "";
	 height: 4px;
	 background-color: var(--primary-color);
	 position: absolute;
	 z-index: 1;
	 width: 100%;
	 left: 50%;
	 top: 40%;
	 -webkit-transform: translateY(-50%);
	 transform: translateY(-50%);
	 transition: all .25s ease-out;
 }
 
 .ProgressBar-step:first-child:before, .ProgressBar-step:first-child:after {
	 display: none;
 }
 
 .ProgressBar-step:after {
	 background-color: var(--primary-color);
	 width: 0%;
 }
 
 .ProgressBar-step.is-complete+.ProgressBar-step.is-current:after, .ProgressBar-step.is-complete+.ProgressBar-step.is-complete:after {
	 width: 100%;
 }
 
 .ProgressBar-icon {
	 width: 1.5em;
	 height: 1.5em;
	 background-color: #fff;
	 fill: #fff;
	 border-radius: 50%;
	 padding: 0.5em;
	 max-width: 100%;
	 z-index: 10;
	 position: relative;
	 transition: all .25s ease-out;
	 border: solid var(--primary-color) 2px;
 }
 
 .is-current .ProgressBar-icon {
	 fill: var(--primary-color);
	 background-color: var(--primary-color);
 }
 
 .is-complete .ProgressBar-icon {
	 fill: var(--primary-color);
	 background-color: var(--primary-color);
 }
 
 .user-register-align {
	 display: flex;
	 vertical-align: middle;
 }
 
 .user-enroll-uni {
	 width: 50%;
	 padding-left: 20px;
	 margin-bottom: 30px;
	 border-left: solid 1px #eee;
 }
 
 .user-enroll-ngo {
	 width: 50%;
	 padding-right: 20px
 }
 
 .user-fav-cat {
	 width: 25%;
	 position: relative;
 }
 
 .settings-fav-cat {
	 width: 25%;
	 position: relative;
 }
 
 .select2-results__option {
	 font-size: 14px;
	 text-align: right;
 }
 
 .select2-container .select2-selection--single .select2-selection__rendered {
	 text-align: right;
	 padding-left: 20px;
	 padding-right: 8px;
 }
 
 .select2-container--default .select2-selection--single .select2-selection__arrow {
	 left: 1px;
	 right: 0px;
 }
 
 .select2-search__field {
	 text-align: right;
 }
 
 .button-prj-location {
	 width: 30.333%;
	 display: inline-block;
	 margin: 10px 0px;
	 margin-left: 0.5%;
	 color: #969292;
	 background: #dedede;
	 padding: 15px 0px;
	 border-radius: 0px;
 }
 
 .volunteering-locations .current {
	 color: #fff;
	 background: var(--primary-color) !important;
 }
 
 .button-prj-location:hover {
	 color: #fff;
 }
 
 .volunteering-location-btn {
	 width: 100%;
	 margin: 0px 30%;
 }
 
 #static_button-2 {
	 width: 40%;
	 text-align: center;
 }
 
 .down-arrow {
	 transform: rotate(45deg);
	 -webkit-transform: rotate(45deg);
	 border: solid white;
	 border-width: 0 3px 3px 0;
	 display: inline-block;
	 padding: 3px;
	 margin: 1px 5px;
 }
 
 .opp-location-wrapper {
	 width: 30.333%;
	 display: inline-block;
	 margin: 10px 0px;
	 margin-left: 0.5%;
	 padding: 15px 30px;
 }
 
 .multi-locations-list {
	 display: none;
 }
 
 .multi-locations-opp {
	 margin-top: 20px;
 }
 
 .multi-locations-list .v-line {
	 border-left: solid 1px #f2f2f2;
	 height: 160px;
	 display: inline-block;
	 vertical-align: top;
 }
 
 .multi-locations-list .h-line {
	 border-top: 1px solid #f2f2f2;
	 margin: 0px;
 }
 
 .flex-layout-safari {
	 display: flex;
	 flex: 0 0 auto;
 }
 
 .flex-layout {
	 display: flex;
 }
 
 .flex-dir-h {
	 flex-direction: row;
 }
 
 .flex-dir-v {
	 flex-direction: column;
 }
 
 .flex-wrap-n {
	 flex-wrap: nowrap;
 }
 
 .flex-wrap-w {
	 flex-wrap: wrap;
 }
 
 .flex-grow-1 {
	 flex-grow: 1;
 }
 
 .flex-shrink-1 {
	 flex-shrink: 1;
 }
 
 .flex-b-60 {
	 flex-basis: 60%;
 }
 
 .flex-b-36 {
	 flex-basis: 36%;
 }
 
 .flex-b-25 {
	 flex-basis: 25%;
 }
 
 .flex-b-30 {
	 flex-basis: 30%;
 }
 
 .flex-b-35 {
	 flex-basis: 35%;
 }
 
 .flex-b-50 {
	 flex-basis: 50%;
 }

 .flex-b-45 {
	 flex-basis: 45%;
 }
 
 .flex-b-80 {
	 flex-basis: 80%;
 }
 
 .flex-b-20 {
	 flex-basis: 20%;
 }
 
 .flex-b-15 {
	 flex-basis: 15%;
 }
 .flex-b-16 {
	flex-basis: 16%;
}

 .flex-b-70 {
	 flex-basis: 70%;
 }
 
 .flex-b-75 {
	 flex-basis: 75%;
 }
 
 .flex-b-85 {
	 flex-basis: 85%;
 }
 
 .flex-b-90 {
	 flex-basis: 90%;
 }
 
 .flex-b-100 {
	 flex-basis: 100%;
 }
 
 .margin-0 {
	 margin: 0px;
 }
 
 .margin-t-3 {
	 margin-top: 30px;
 }
 
 .margin-t-4 {
	 margin-top: 40px;
 }
 
 .margin-t-5 {
	 margin-top: 50px;
 }
 
 .margin-t-7 {
	 margin-top: 70px;
 }
 
 .justify-between {
	 justify-content: space-between;
 }
 
 .justify-center {
	 justify-content: center;
 }
 
 .justify-right {
	 justify-content: right;
 }
 
 .justify-left {
	 justify-content: left;
 }
 
 .justify-around {
	 justify-content: space-around;
 }
 
 .justify-end {
	 justify-content: flex-end;
 }
 
 .justify-start {
	 justify-content: flex-start;
 }
 
 .container {
	 margin: 30px 20px 30px 20px;
 }
 
 .padding-r-1 {
	 padding-right: 10px;
 }
 
 .padding-r-2 {
	 padding-right: 20px;
 }
 
 .padding-l-1 {
	 padding-left: 10px;
 }
 
 .padding-l-2 {
	 padding-left: 20px;
 }
 
 .padding-t-1 {
	 padding-top: 10px;
 }
 
 .padding-t-2 {
	 padding-top: 20px;
 }
 
 .padding-b-2 {
	 padding-bottom: 20px;
 }
 
 .padding-b-1 {
	 padding-bottom: 10px;
 }
 
 .padding-y-1 {
	 padding-block: 10px;
 }
 
 .padding-y-2 {
	 padding-block: 20px;
 }
 
 .padding-x-1 {
	 padding-inline: 10px;
 }
 
 .padding-x-2 {
	 padding-inline: 20px;
 }
 
 .padding-x-7 {
	 padding-inline: 70px;
 }
 
 .margin-y-1 {
	 margin-block: 10px;
 }
 
 .margin-y-2 {
	 margin-block: 20px;
 }
 
 .margin-y-5 {
	 margin-block: 50px;
 }
 
 .margin-x-1 {
	 margin-inline: 10px;
 }
 
 .margin-x-2 {
	 margin-inline: 20px;
 }
 
 .margin-x-10 {
	 margin-inline: 100px;
 }
 
 .margin-r-1 {
	 margin-right: 10px;
 }
 
 .margin-r-2 {
	 margin-right: 20px;
 }
 
 .margin-r-3 {
	 margin-right: 30px;
 }
 
 .margin-l-1 {
	 margin-left: 10px;
 }
 
 .margin-l-3 {
	 margin-left: 30px;
 }
 
 .margin-t-1 {
	 margin-top: 10px;
 }
 
 .margin-t-2 {
	 margin-top: 20px;
 }
 
 .margin-t-3 {
	 margin-top: 30px;
 }
 
 .margin-t-7 {
	 margin-top: 70px;
 }
 
 .margin-t-7-5 {
	 margin-top: 75px;
 }
 
 .margin-b-2 {
	 margin-bottom: 20px;
 }
 
 .margin-b-3 {
	 margin-bottom: 30px;
 }
 
 .margin-b-1 {
	 margin-bottom: 10px;
 }
 
 .mb-5 {
	 margin-bottom: 5px;
 }
 
 .height-100 {
	 height: 100%;
 }
 
 .width-75 {
	 width: 75%;
 }
 
 .width-100 {
	 width: 100%;
 }
 
 .width-auto {
	 width: auto;
 }
 
 .width-fit-content {
	 width: fit-content;
 }
 
 .width-available {
	 width: 100%;
	 width: -moz-available;
	 /* WebKit-based browsers will ignore this. */
	 width: -webkit-fill-available;
	 /* Mozilla-based browsers will ignore this. */
	 width: fill-available;
 }
 
 .border-none {
	 border: none;
 }
 
 .border-bottom {
	 border-bottom: solid 1px;
 }
 
 .border-bottom-3 {
	 border-bottom: solid 3px;
 }
 
 .border-radius-1 {
	 border-radius: 10px;
 }
 
 .border-color-light-grey {
	 border-color: #f0f0f0;
 }
 
 .border-color-dark-grey {
	 border-color: #c5c4c4;
 }
 
 .textarea-responsive-0 {
	 outline: none;
	 resize: none;
 }
 
 .button-md {
	 opacity: 0.6;
	 text-align: center;
	 text-transform: uppercase;
	 letter-spacing: 1px;
	 padding: 10px 30px;
	 display: table;
	 cursor: pointer;
	 border: none;
	 -moz-border-radius: 5px;
	 -webkit-border-radius: 5px;
	 border-radius: 5px;
	 font-size: 16px;
 }
 
 .button-lg {
	 opacity: 0.6;
	 text-align: center;
	 text-transform: uppercase;
	 letter-spacing: 1px;
	 padding: 10px 30px;
	 display: table;
	 cursor: pointer;
	 border: none;
	 -moz-border-radius: 5px;
	 -webkit-border-radius: 5px;
	 border-radius: 5px;
	 font-size: 20px;
 }
 
 .button-md:hover, .button-lg:hover {
	 opacity: 1;
 }
 
 .button-bg-nahno {
	 color: #fff;
	 background: var(--primary-color);
 }
 
 .button-bg-nahno-error {
	 color: #fff;
	 background: #cd0a0a;
 }
 
 .d-none {
	 display: none;
 }
 
 .p-relative {
	 position: relative;
 }
 
 .p-absolute {
	 position: absolute;
 }
 
 .count-tooltip {
	 position: absolute;
	 right: -6px;
	 top: -6px;
	 color: white;
	 border-radius: 50%;
	 height: 15px;
	 width: 19px;
	 text-align: center;
	 display: flex;
	 justify-content: center;
	 flex-direction: column;
	 background: red;
	 border: 2px solid white;
	 font-size: 10px;
	 z-index: 1;
	 padding: 8px 4px 7px 13px;
 }
 
 .text-nahno-blue {
	 color: var(--primary-color);
 }
 
 .text-nahno-error {
	 color: #cd0a0a;
 }
 
 .text-nahno-grey {
	 color: #a9a9a9;
 }
 
 .font-size-25 {
	 font-size: 25px;
 }
 
 .label-sm {
	 font-size: 11px;
 }
 
 .min-height-250 {
	 min-height: 250px;
 }
 
 .min-height-450 {
	 min-height: 450px;
 }
 
 .max-height-450 {
	 max-height: 450px;
 }
 
 .min-width-125 {
	 min-width: 125px;
 }
 
 .min-width-150 {
	 min-width: 150px;
 }
 
 .min-width-175 {
	 min-width: 175px;
 }
 
 .min-width-200 {
	 min-width: 200px;
 }
 
 .min-width-250 {
	 min-width: 250px;
 }
 
 .min-width-450 {
	 min-width: 450px;
 }
 
 .min-width-550 {
	 min-width: 550px;
 }
 
 .min-height-55 {
	 /* min-height: 55px;     */
 }
 
 .selector-div {
	 display: unset;
	 margin: 0;
	 padding: 0;
 }
 
 .bg-light-grey {
	 background-color: #f0f0f0;
 }
 
 .bg-light-grey-1 {
	 background-color: #edf2fa;
 }
 
 .bg-white {
	 background-color: white;
 }
 
 #satisfaction-survey-form .parsley-errors-list {
	 text-align: center;
 }
 
 .header-logo-enhance {
	 margin: 10px 20px 0 0;
 }
 
 .header-image-enhance {
	 max-height: 46px;
	 width: 100pt !important;
 }
 
 .dropdown-box-shadow {
	 box-shadow: 0 1px 10px rgba(0, 0, 0, 0.20);
 }
 
 .box-shadow {
	 box-shadow: 10px 10px 5px 0px rgba(0, 0, 0, 0.1);
 }
 
 .box-shadow-hover:hover {
	 box-shadow: 10px 10px 5px 0px rgba(0, 0, 0, 0.1);
 }
 
 .text-dec-none {
	 text-decoration: none;
 }
 
 .btn-grey-3d {
	 -webkit-box-shadow: 0px -5px 0px #e7e5e5;
	 -moz-box-shadow: 0px -5px 0px #e7e5e5;
	 box-shadow: 0px -5px 0px #e7e5e5;
	 text-decoration: none;
	 border-radius: 5px;
	 border: solid 1px;
	 border-color: #E7E5E5;
	 cursor: pointer;
 }
 
 .hover-grey:hover {
	 background-color: #f0f0f0;
 }
 
 .cursor-p {
	 cursor: pointer;
 }
 
 .p-events-none {
	 pointer-events: none;
 }
 
 .overflow-y-auto {
	 overflow-y: auto;
 }
 
 .dir-ltr {
	 direction: ltr;
 }
 
 .dir-rtl {
	 direction: rtl;
 }
 
 .no-hover:hover {
	 background-color: unset;
	 color: unset;
 }
 
 #satisfaction-survey-form .dialog-close, #satisfaction-survey-completed .dialog-close, #satisfaction-survey-not-completed .dialog-close {
	 background: url('../images/sprite.png') -56px -86px no-repeat;
	 width: 20px;
	 height: 20px;
	 left: unset;
	 top: unset;
	 margin-top: 10px;
	 position: relative;
 }
 
 .pagination-2 {
	 display: flex;
	 justify-content: center;
 }
 
 .ngo-content-search, .user-content-search, .project-content-search {
	 align-items: flex-end;
 }
 
 .pagination-2 div {
	 box-shadow: 0px 10px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0);
	 font-size: 16px;
	 color: black;
	 font-weight: bold;
	 text-align: center;
	 float: left;
	 padding: 15px 21px;
	 text-decoration: none;
	 border: 1px solid #e5e5e5;
 }
 
 .pagination-2 div.active {
	 background-color: #4CAF50;
	 color: white;
 }
 
 .pagination-2 div:hover:not(.active) {
	 background-color: #ddd;
 }
 
 .pagination-2 .selected {
	 background-color: var(--primary-color);
	 color: white;
 }
 
 .pagination-2-input {
	 color: black;
	 width: 100%;
	 border: 1px solid #e3e3e3;
	 box-shadow: 0px 10px 8px 0 rgb(211, 211, 211), 0 6px 20px 0 rgba(0, 0, 0, 0) !important;
	 padding: 5px 15px;
	 font: normal 14px;
	 text-align: center;
 }
 
 
 /* fix in international number plugin style to work with validation */
 .iti--allow-dropdown .iti__selected-flag{
	 max-height: 37px !important;
 }
 
 /* Disable International phone for user settings */
 #settings-form .iti__selected-flag{
	 height: 2em !important;
	 pointer-events: none !important;
 }
 
 .delete-icon {
	 width: 30px;
	 height: 30px;
	 background: url('../images/remove-icon.png') no-repeat;
	 cursor: pointer;
	 background-size: cover;
	 /* position: absolute; */
	 /* top: 0px; */
	 float: left;
 }
 .image-icon {
	 width: 30px;
	 height: 30px;
	 background: url('../images/icon-file.png') no-repeat;
	 cursor: pointer;
	 background-size: cover;
	 float: right;
 }
 /* .pdf-icon {
	 width: 38px;
	 height: 30px;
	 background: url('../images/pdf icon_1.png') no-repeat;
	 cursor: pointer;
	 background-size: cover;
	 float: right;
 } */
 .papers_images img{
	 position: relative;
	 top: 0;
	 left: 0;
 }
 .papers_images {
	 position: relative;
	 top: 0;
	 left: 0;
	 flex: 50%;
	 padding-top: 20px;
 }
 .papers_images_container {
	 display: flex;
	 flex-wrap: wrap;
	 padding: 0px 4px;
 }
 .papers_images_container_1 {
	 display: flex;
	 flex-wrap: wrap;
	 padding: 0px 4px;
 }
 span.pip {
	 flex: 50%;
	 padding-top: 20px;
 }
 input#official_papers {
	 display: none;
 }
 button#choosefile {
	 width: 50%;
 }
 .file_names {
	 width: 100%;
	 padding-top: 10px;
 }
 .conatiner-logos {
	 display: flex;
	 align-items: center;
	 justify-content: center;
 }
 .partner-logos {
	 width: 19.33%;
	 padding: 20px;
 }
 .impact{
	float:left;
 }
.search{
	padding-right: 50px;
}
.uni-search-icon{
	right:-1;
}
#implemented{
	width: 25%;
}
.wizard-footer {
    width: 95%;
}
.resend-email{
	cursor: pointer;
}

a.project_vip-button:hover {
    color: white !important;
}
a.project_vip-button.orange-underline:hover {
    color: #00acf4 !important;
}
a#u_report{
	color: #00acf4;
}
.incomplete-label{
	color:red !important;
}
.incomplete-label:hover{
	color:red !important;
}
.ngo-emergency{
	display: flex;
    flex-wrap: nowrap;
    flex-direction: row;
    align-items: center;
}
.ngo-emergency-title{
	margin-left: 20px;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice{
	float:right !important;
}
.en .select2-container--default .select2-selection--multiple .select2-selection__choice{
	float:left !important;
}
.emergency-icon{
	width: 7% !important;
    vertical-align: middle;
    
}
.emergency-icon-detail{
	width: 6% !important;
    vertical-align: middle;
	margin-bottom: 8px;
    
}
svg {
    width: 30px;
    height: 30px;	
    padding: 5px;
}
a.whatsapp svg> path{
	fill: green;
}
a.facebook svg> path{
	fill: #3b3bff;
}
a.instagram svg> path{
fill:url(#MyGradient);
}
#sdg_error{
	display: none;
}
.iti__arrow{
	display: none;
}
.ngo-phone-container .iti__selected-flag {
	pointer-events: none;
}

.whatsapp-share-button{
	color: white;
    background-color: #44bf44;
    padding: 0px 3px;
    font-size: 14px;
    align-items: center;
    display: inline-block;
    text-decoration: none;
    border-radius: 4px;
}
a.whatsapp-share-button:hover{
	color: white; 
}
.center-content{
	display: flex; 
	align-items: center;
}
.center-content-test{
	padding:4px 2px 1px 2px;
}
.center-content svg {
    width: 27px;
    height: 28px;	
    padding: 5px;
}

/* ngo edit profile */
p.location-label {
    width: 100px !important;
}

/* NGO Dashboard: Health Challenges -> ar */
.health-challenges-title {
	text-align: right !important;
	margin-right: 20px;
	font-weight: bold;
}

.health-challenges-list {
	margin-right: 20px; 
	text-align: right;
}

/* NGO Dashboard: Health Challenges -> en */
.health-challenges-title-en {
	text-align: left !important;
	margin-left: 20px;
	font-weight: bold;
}

.health-challenges-list-en {
    margin-left: 40px;
    text-align: left;
}
#project_vip_not_valid_ID_volunteer_content .dialog-main-content,
#project_vip_not_valid_ID_follow_content .dialog-main-content,
#choose_new_file .dialog-main-content,
#thank_msg_and_continue .dialog-main-content
   {
	min-height: 210px;
	position: relative;
	background-color: #fff;
	box-shadow: 0 1px 10px rgba(0, 0, 0, 0.20);
	-moz-border-radius: 1px;
	-webkit-border-radius: 1px;
	border-radius: 1px;
}
p.confirm-country-code-en {
    margin-left: 35% !important;
	width: 100% !important;
	margin-top: 3px !important;
}
p.confirm-country-code-ar {
    margin-right: 35% !important;
}
.left-foryou{
	text-align: right;
}
textarea#ngo-description-en{
	direction: ltr !important;
}
#settings-phone{
	direction: rtl;
}

.social-share.project-desc1 a {
    text-decoration: none;
    padding: 0 5px;
    display: flex;
    border-radius: 5px;
	margin: 0 5px;
}

.project-desc1 {
    display: flex;
}
.project-desc1 a.facebook {
    background: #1877f2;
	color:#fff;
}
.project-desc1 a.facebook svg,.project-desc1 a.facebook svg> path,.project-desc1 a.whatsapp svg,.project-desc1 a.whatsapp svg> path {
	fill:#fff;
}
.project-desc1 a.whatsapp {
    background: #44bf44;
	color:#fff;
}

/* Add Facts */
/* .en .impact-add {
    margin: 0px 0px 5px 110px !important;
} */
#ngo_editor .impact-add span {
    display: block !important;
}

/* Annual Report: Delete Alert */
.en #confirm-report-delete {
	margin-left: 22% !important;
}

.en .project_vip-button3 {
    float: left;
}
.en #ngo_editor span.btn.btn-success.fileinput-button.style1{
	width: fit-content !important;
    top: 20px !important;
}
.en .project_vip-field.field-half.left.field-width.en_float_right #ngo-submit-form {
    float: right;
}
.en #ngo_editor span.btn.btn-success.fileinput-button.style1.fix_top {
    top: 0px !important;
}
.project_vip-field.field-half.left.space.field-width.fix-alignment {
    text-align: right;
}

.settings-result  ,.settings-result-deactivate {
    text-align: center;

/* owl-carousel-annual-report section start */
}
.lang-en .report-cell-slide{
    margin-right: 0px!important;
    margin-left: 30px;
}
.owl-carousel-annual-report {
	margin: 0 auto 0 auto;
}
.owl-carousel-annual-report.owl-carousel .owl-item{
	margin-right: -8px!important;	
	margin-left: 0px!important;	
}
.owl-carousel-annual-report.owl-carousel.lang-en .owl-item{
	margin-right: 10px!important;	
	margin-left: 0px!important;	
}
.owl-carousel-annual-report.owl-carousel .owl-item img {
    display: block;
    width: 40%;
}

/* owl-carousel-annual-report section end */
.disabled-field{
	background-color: #eee !important;
	cursor: default;
}

/* Hide photo gallery tab from volunteer profile  */
li#user-tab-gallery {
    display: none;
}
.settings-result  ,.settings-result-deactivate {
    text-align: center;
}
.unclickable{
	pointer-events: none;
}
span#clearBtn {
    position: absolute;
    z-index: 99;
    left: 5px;
	top: 10px !important;
}

.wizard-field.clearable-input input {
    position: relative;
    z-index: 0;
}

.en span#clearBtn {
    position: absolute;
    z-index: 99;
    right: 5px;
    left: unset;
	top: 10px !important;
}

.en .lh-17{
	line-height: 1.7;
}
.display_n{
	display: none;
}
.pointer_e_n{
	background-color: #e9ecef; /* Similar to the default disabled color */
    color: #6c757d; /* Greyed out text */
    pointer-events: none; /* Disable pointer events to prevent interaction */
    opacity: 0.65;
}
.pointer_e_n_image{
    color: #6c757d; /* Greyed out text */
    pointer-events: none; /* Disable pointer events to prevent interaction */
    opacity: 0.65;
}
.color-g{
	color:green;
	font-weight: 600;
}
.file_names {
    display: flex;
    align-items: center;
    justify-content: flex-start; /* Align items to the start of the container */
    direction: ltr; /* Default to LTR */
}

.image-icon {
    width: 24px;
    height: 24px;
	pointer-events: none; 
    background-size: contain;
    background-repeat: no-repeat;
    margin-right: 5px; /* Reduce space between the icon and the file name */
}

.delete-icon {
    width: 24px;
    height: 24px;
    background-size: contain;
    background-repeat: no-repeat;
    cursor: pointer;
    margin-left: auto; /* Push delete icon to the far end */
}
.papers_images_container[dir="rtl"] .file_names {
    flex-direction: row-reverse; /* Reverse the display order */
}
.papers_images_container[dir="rtl"] .file_names .image-icon {
    margin-right: 0;
    margin-left: 5px; /* Adjust margin for RTL */
}
.papers_images_container[dir="rtl"] .file_names .delete-icon {
    margin-right: auto;
    margin-left: 0; /* Align delete icon properly in RTL */
}
/* Reverse the layout if the parent container has RTL direction */
.file_names[dir="rtl"] {
    flex-direction: row-reverse; 
}

.file_names[dir="rtl"] .image-icon {
    margin-right: 0;
    margin-left: 5px; 
}

.file_names[dir="rtl"] .delete-icon {
    margin-right: auto;
    margin-left: 0;
}

.ar .wizard-field-container {
    margin: 23px 0px 23px 2%;
};

.wizard-field:has(#firstname) .parsley-errors-list li.parsley-custom-error-message,
.wizard-field:has(#lasttname) .parsley-errors-list li.parsley-custom-error-message{
	font-size: 10px!important;
}
.wizard-field input#firstname ~ ul.parsley-errors-list,
.wizard-field input#lastname ~ ul.parsley-errors-list{
    color: red !important;
    font-size: 10px !important;
}

.color-red{
	color: red;
}

@media only screen and (min-width: 320px) and (max-width: 667px) {
	.explore-inner-filters.explore-inner-filters-type{
		display: none;
		margin-bottom:9px!important;
	}
	.select-row{
		display: block!important;
	}
	.select-column{
		width: auto;
	margin: 0px auto 0 auto;
	}
	.form-control.mobile-dropdown{
	
	/* width: 250px;
	margin: 0px auto 0 auto; */
	 
		/* border: none;
		border-bottom: solid 1px #cccccc;
		background: none;
		padding: 5px 0;
		font-size: 15px;  */
	}
}
/* General Styles for Filters Section */
.mobile-filters {
    display: none; /* Hidden by default */
    background-color: #f5f8f9; /* Matches the light background in the design */
    border-radius: 8px;
    padding: 10px;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
    position: fixed;
    top: 0;
    right: 0;
    height: 90%;
    width: 100%;
    /* max-width: 350px; */
    overflow-y: scroll;
    z-index: 1000;
}

/* Floating Button */
/* .floating-button {
    position: fixed;
    bottom: 20px;
    right: 20px;
    background-color: #ff6600;
    color: #fff;
    padding: 12px 15px;
    border-radius: 50%;
    box-shadow: -2px 4px 4px 3px rgba(0, 0, 0, 0.1);
    cursor: pointer;
    font-size: 18px;
    z-index: 1100;
} */

/* Close Button */
/* .mobile-filters .hide-button {
    background: none;
    border: none;
    color: #333;
    font-size: 18px;
    font-weight: bold;
    cursor: pointer;
    margin-bottom: 15px;
    text-align: left;
} */

/* Select Row */
.select-row {
    margin-bottom: 15px;
}

/* Label Style */
.select-column label {
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 8px;
    display: block;
    color: #555;
}

/* Select and Input Styles */
.select-column select,
.select-column input[type="number"] {
    width: 100%;
    height: 30px;
    padding: 5px 10px;
    font-size: 14px;
    border: 1px solid #ccc;
    border-radius: 4px;
    background-color: #fff;
}

/* Radio Options */
.radio-options {
    /* display: flex; */
    gap: 10px;
    align-items: center;
}

/* Emergency Response Styles */
.question-container {
    margin-top: 5px;
    margin-bottom: 5px;
}

.question-label {
    color: #d32f2f;
    font-size: 14px;
    font-weight: bold;
}

/* Reset Button */
.reset-button {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 15px;
    gap: 10px;
}

.reset-button button {
    background-color: #ff6600;
    color: white;
    padding: 8px 15px;
    border: none;
    border-radius: 4px;
    font-size: 14px;
    cursor: pointer;
}

.reset-button button:hover {
    background-color: #e65c00;
}
.hide-btn-div{
	display: flex;
    /* gap: 7rem; */
	/* margin: 6px 0px 0px 0px; */
	justify-content: space-between;
    align-items: center;
}
/* .hide-button, .floating-button {
	padding: 1px 20px!important;
} */
.age-container {
    display: flex;
    gap: 15px; /* Space between the two fields */	
    flex-direction: row !important;
}

.age-container .age-field {
    flex: 1; /* Make both fields take equal width */
}

.icon-circle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 15px; /* Adjust the size */
	height: 15px; /* Adjust the size */
	border-radius: 50%;
	background-color: #a9a9a9; /* Background color */
	color: #fff; /* Icon color */
	font-size: 9px; /* Icon size */
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); /* Optional shadow */	
    margin-top: 14px;
  }
  

.project-subcategory {
    color: #81bd41;
    font-weight: 600;
}
.project_desc{
	line-height: 1.5;
	margin-top: 7px;
}

.project_target_actual{
	color: #81bd41;
	font-weight: 600;
}
.settings-btn-group.center-text{
	justify-content: center;
}
.mt-5 {
    margin: 10px 0px;
}
.en .mt-5 {
	margin: 13px 0px;
}

a.fix-text-decoration.ngo-edit {
    text-decoration: none;
    font-size: 16px !important;
    /* margin: 5pc 0px; */
}
a.fix-text-decoration.ngo-edit:hover{
	color:white;
}
.account-manager-details .wizard-content{
	margin-top: 20px;
}

.account-manager-details .wizard-content .wizard-field-container .wizard-field{
	width: 64%;
}

#students_filter .select2-selection__rendered {
	padding: 5px 10px!important;
}
/* #students_filter .select2-results__option{
	padding: 5px 10px!important;
} */

#adddate::placeholder {
    color: #c2c2c2; /* Placeholder text color */
}
#adddate{
	color:#000;
}
.fix-h3-title{
	font-weight: normal !important;
    font-size: 18px;
}
.log-link{
	text-decoration: none;
    color: #00aff5;
    cursor: pointer;
}
.student-row:hover .log-link, .log-link:hover{
	color: white;
}
select#action_type option, select#account_manager_id option, select#category-filter option
, select#countries-filter option, select#gender-filter option, select#birthdate-from-filter option, select#birthdate-to-filter option{
	color:black;
}

select#countries-filter,select#gender-filter, select#birthdate-from-filter, select#birthdate-to-filter{
	width: 100%;
    border: solid 1px #c2c2c2;
    padding: 5px 10px;
    font-size: 15px;
    background: #fff;
    margin-top: 20px;
    height: 50px;
}

.pt-22{
	padding-top: 22px;
}
select#countries-filter:focus, select#countries-filter:valid,
select#gender-filter:focus, select#gender-filter:valid,
select#birthdate-from-filter:focus, select#birthdate-from-filter:valid,
select#birthdate-to-filter:focus, select#birthdate-to-filter:valid{
    color: black; /* Forces text color to change */
}
.pb-7{
    padding-bottom: 7px;
}
.dialog-content .custom-file-upload {
	display: inline-block;
	padding: 10px 20px;
	color: #fff;
	background-color: #00ACF4;
	border-radius: 5px;
	font-size: 16px;
	cursor: pointer;
	text-align: center;
	white-space: nowrap;
}

/* Hide the actual file input */
.dialog-content #mou_file, #coc_file{
	display: none;
}
.upload-file-container{
	display: flex;
    align-items: center;
    gap: 15px;
}
.file-info a{
	text-decoration: none;
}

 
div#submit-contact-btn {
    width: 20%;
    margin: 0px !important;
}

.contact-form {
	max-width: 80%;
	margin: 50px auto;
	background: white;
	padding: 30px;
	border-radius: 10px;
	box-shadow: 0 0 15px rgba(0, 0, 0, 0.1);
	display: grid;
	gap: 20px;
}
.contact-form h3 {
      color: #00ACF4;
      margin-bottom: 25px;
      grid-column: 1 / -1;
    }

.contact-form .form-group {
	display: grid;
	gap: 5px;
}

.contact-form label {
	font-weight: bold;
	margin-top: 10px;
}

.contact-form input,
.contact-form select,
.contact-form textarea {
	padding: 10px;
	border: 1px solid #ccc;
	border-radius: 5px;
	font-size: 16px;
}

.contact-form textarea {
	resize: vertical;
	min-height: 100px;
}

.contact-form .form-row-2 {
	display: grid;
	gap: 20px;
}

.contact-form .form-row-3 {
	display: grid;
	gap: 20px;
}

.contact-form button {
	background-color: #00ACF4;
	color: white;
	border: none;
	padding: 8px 16px;
	border-radius: 4px;
	font-size: 14px;
	cursor: pointer;
	transition: background-color 0.3s ease;
	justify-self: start;
}

.contact-form button:hover {
	background-color: #008fcc;
}

@media (min-width: 768px) {
	.contact-form .form-row-2 {
		grid-template-columns: repeat(2, 1fr);
	}

	.contact-form .form-row-3 {
		grid-template-columns: repeat(3, 1fr);
	}
}
a.agree-terms {
	color: #00ACF4;

#ngo_editor_content .remove-file-btn {
	background: none;
	border: none;
	color: #e74c3c;
	font-size: 18px;
	font-weight: bold;
	cursor: pointer;
	margin-left: 10px;
}
#ngo_editor_content .remove-file-btn:hover {
	color: #c0392b;

}