// Charity - Give – Donation
// --------------------------------------------------
.give-btn {
	background-color: $theme-color;
	border-color: $theme-color;
	color: $headings-color;
	font-size: 14px;		
	padding: 0px 30px;
	line-height: 1;
	height: 50px;   	
	font-family: $headings-font-family; 
	font-weight: $headings-font-weight;
    @include inline-block();    
	@include transition($linear);
	@include hover-focus-active() {
		color: $theme-color;
		background-color: transparent;
	}
	&.give-submit{		
		@include hover-focus-active() {
			color: $theme-color;
			background-color: transparent;
			border-color: $theme-color;
		}
    }
	&.give-donation-level-btn{		
		line-height: 30px;
		height: 26px;
		color: $headings-color;
		font-family: $headings-font-family;
		font-size: 10px;
		font-weight: $font-weight-medium;
		background-color: $theme-color;
		padding: 0 10px;
		border-color: $theme-color;
		text-transform: uppercase;
		@include hover-focus-active() {
			background-color: transparent;
			color: $theme-color;
			border-color: $theme-color;
		}
	}
}

.give-modal{
	.mfp-content{
		padding: 50px 15px 40px;
		@include border-radius(10px);

		@include media(tablet) {
			padding: 30px 20px;
		}

		@include media(desktop) {
			padding: 30px;
		}

		.mfp-close{		
			top: -72px;
			text-indent: -99999px;
			background-color: $theme-color;
			display: block;
			position: absolute;		
			overflow: hidden;
			margin-left: auto;
			margin-right: auto;
			@include opacity(1);
			@include rtl-right(0);		
			@include rtl-left(0);
			@include background-size(cover);		
			@include square(40px);
			@include border-radius(100%);

			@include media(tablet) {
				top: -57px;
				margin-left: 0px;
				margin-right: 0px;				
				@include rtl-right(-45px);
				@include rtl-left(auto);
				@include square(50px);				
			}

			@include media(desktop) {
				top: -55px;
				@include rtl-right(-55px);		
			}

			&:before{
				content: '';			
				background-image: url('data:image/svg+xml;utf8,<svg height="329pt" viewBox="0 0 329.26933 329" width="329pt" xmlns="http://www.w3.org/2000/svg"><path style="fill: white" d="m194.800781 164.769531 128.210938-128.214843c8.34375-8.339844 8.34375-21.824219 0-30.164063-8.339844-8.339844-21.824219-8.339844-30.164063 0l-128.214844 128.214844-128.210937-128.214844c-8.34375-8.339844-21.824219-8.339844-30.164063 0-8.34375 8.339844-8.34375 21.824219 0 30.164063l128.210938 128.214843-128.210938 128.214844c-8.34375 8.339844-8.34375 21.824219 0 30.164063 4.15625 4.160156 9.621094 6.25 15.082032 6.25 5.460937 0 10.921875-2.089844 15.082031-6.25l128.210937-128.214844 128.214844 128.214844c4.160156 4.160156 9.621094 6.25 15.082032 6.25 5.460937 0 10.921874-2.089844 15.082031-6.25 8.34375-8.339844 8.34375-21.824219 0-30.164063zm0 0"/></svg>');
				background-repeat: no-repeat;
				background-position: center center;		
				@include background-size(cover);
				@include square(16px);
				@include center-box(absolute);
			}
			@include hover-focus-active() {
				background-color: $theme-color;
			}
		}
	}	
}

.give-display-reveal,
.give-display-modal{
	form.give-form{
		.give-donation-amount{
			text-align: center;
			@include justify-content(center);
		}
	}
	.give-btn{
		&.give-btn-reveal,
		&.give-btn-modal{			    
			margin: 0 auto;
			min-width: 100px;
			display: block !important;
		}
	}
}

.give-display-reveal{
	.give-payment-mode-label{
		margin-top: 30px;
	}
}

.give-grid{
	text-align: center;
	margin-bottom: 30px;		

	.give-grid-container{
		border: 1px solid $border-color;
		@include border-radius-separate(10px,10px,0,0);
		@include transition($linear);
		@include hover() {
			border-color: $theme-color;
			@include border-radius(10px);
		}
	}

	.entry-title{
		font-size: 18px;
		line-height: 30px;
		margin-top: 15px;
		margin-bottom: 30px;		
		@include media(desktop) {
			margin-bottom: 26px;
    		margin-top: 10px;
		}		
	}
	.give-image{		
		img{
			@include border-radius-separate(10px, 10px, 0px, 0px);			
		}
		.image-wrapper{
			margin-bottom: 0;			
			a{
                position: relative;
                display: block;
                &:before{
                    top: 0;
                    position: absolute;
                    visibility: hidden;
                    content: "";
                    z-index: 1;
                    background-color: $theme-color;                             
                    pointer-events: none;
                    @include square(100%);
                    @include opacity(0);
                    @include rtl-left(0);               
                    @include transition($linear);  
                    @include border-radius-separate(10px,10px,0,0);
                }
                &:after{
                    content: "";                  
                    z-index: 2;      
                    background-color: $white;
                    background-image: url('../images/unlink.png');
                    background-position: center center;
                    background-repeat: no-repeat;
                    visibility: hidden;
                    pointer-events: none;
                    position: absolute;
                    left: 0;
                    right: 0;
                    bottom: 0;
                    top: 0;
                    margin: auto;
                    @include transform(scale(0));
                    @include opacity(0);
                    @include background-size(26px,24px);
                    @include border-radius(50px);       
                    @include square(55px);                                        
                    @include transition($linear);
                }                
            }
		}
	}
	.give-content{
		padding: 38px 30px;		
	}	
	.donate-wrapper,.donator-number{	
		font-size: 16px;
		color: $dark-gray;
		> *{
			font-weight: 400;
		}
	}
	.donation-goal{
		.value{
			color: $theme-color;
		}
	}
	.give-goal-progress{
		margin-bottom: 15px;		
		@include media(tablet) {
			margin-bottom: 20px;
		}
		[class*="progress-bar"]{
			max-height: 112px;
		}				
	}
	@include hover-focus-active() {
		.give-image{
			.image-wrapper{
				a{
					&:before{                        
			            pointer-events: auto;
			            visibility: visible;
			            @include opacity(.82);
			        }                    
			        &:after{
			            visibility: visible;
			            pointer-events: auto;
			            @include opacity(1);
			            @include transform(scale(1));
			        }
				}
			}
		}        
    }
}

.give-list{
	.give-list-middle{
		.give-image{
			.image-wrapper{
				a{
			        position: relative;
			        display: block;
			        &:before{
			            top: 0;
			            position: absolute;
			            visibility: hidden;
			            content: "";
			            z-index: 1;
			            background-color: $theme-color;                             
			            pointer-events: none;			            
			            @include square(100%);
			            @include opacity(0);
			            @include rtl-left(0);               
			            @include transition($linear);  
			            @include border-radius-separate(10px,10px,0px,0px);		

						@include media(tablet) {							
							@include border-radius-separate(10px,0,10px,0);
						}

			        }
			        &:after{
			            content: "";                  
			            z-index: 2;      
			            background-color: $white;
			            background-image: url('../images/unlink.png');
			            background-position: center center;
			            background-repeat: no-repeat;
			            visibility: hidden;
			            pointer-events: none;
			            position: absolute;
			            left: 0;
			            right: 0;
			            bottom: 0;
			            top: 0;
			            margin: auto;
			            @include transform(scale(0));
			            @include opacity(0);
			            @include background-size(26px,24px);
			            @include border-radius(50px);       
			            @include square(55px);                                        
			            @include transition($linear);
			        }		        
			    }
			}
		}
		@include hover-focus-active() {
			.give-image{
				.image-wrapper{
					a{
						&:before{                        
			                pointer-events: auto;
			                visibility: visible;
			                @include opacity(.82);
			            }                    
			            &:after{
			                visibility: visible;
			                pointer-events: auto;
			                @include opacity(1);
			                @include transform(scale(1));
			            }
					}
				}				
			}		
        }
	}	
}

.sidebar{
	.give-list{				
		padding-bottom: 14px;
		margin-top: 14px;						
		@include flexbox();
		@include align-items(center);
		
		.donation-goal{
			.text{
				color: $theme-color;
			}
		}	

		.give-image{
			max-width: 107px;			
			min-width: 107px;			
			overflow: hidden;
			@include rtl-margin-right(20px);
		}
		.give-content{			
			.entry-title{
				font-size: 18px;
				line-height: 28px;
				margin: 0 0 5px 0;
				padding: 0;				
			}
			.donate-wrapper{
				color: $entry-blog-date-color;
				> *{
					color: inherit;
				}
			}
		}		
	}	
}

.give-page{
	&.give-success{
		outline: none;
	}	
}

#give-receipt{
	h2{
		margin-top: 0px;
	}	
}

.give-single-meta{
	outline: none;
}

[id*=give-form]{
	div.summary{
		width: 100%;
		float: none;
	}
	div.images{
		margin-bottom: 30px;
		@include media(tablet) {
			margin-bottom: 50px;
		}
		@include media(desktop) {
			margin-bottom: 63px;
		}
	}
}

.give_error, 
.give_success, 
.give_warning {
	margin-top: 0;
	@include box-shadow(none);
	@include border-radius(5px);
	> p{
		color: inherit;
	}
}

.give_error{
	background-color: $brand-danger;
	border-color: darken($brand-danger, 20%);
	color: darken($brand-danger, 50%);
	&:before{
		background-color: darken($brand-danger, 20%);
	}
}

.give_success{
	background-color: $brand-success;
	border-color: darken($brand-success, 20%);
	color: darken($brand-success, 50%);
	&:before{
		background-color: darken($brand-success, 20%);
	}
}

.give_warning{
	background-color: $brand-warning;
	border-color: darken($brand-warning, 20%);
	color: darken($brand-warning, 50%);
	&:before{
		background-color: darken($brand-warning, 20%);
	}
}

table{
	&.give-table{
		@include text-shadow(none);
		border-color: $border-color;
		margin-bottom: 0px;
		tbody{
			tr{
				td{
					font-size: $font-size-base;
					border-color: $border-color;
				}
			}
		}
	}
	&#give_donation_receipt{
		.give-receipt-thead-text{
			font-size: 22px;
			font-weight: $font-weight-medium;
			color: $headings-color;
			font-family: $headings-font-family;
		}
	}
}
  
.give-form{
	form{
		&#give-email-access-form{
			@include clearfix();
			max-width: 610px;
			margin: 0 auto;
			> *{
				@include rtl-float-left();
			}
			p{
				margin-top: 0px;
				float: none;
				width: 100%;
				text-align: center;
			}
			label{
				margin: 0px;				
				@include rtl-padding(14px, 20px, 14px, 0);
			}
			.give-submit{ 
				padding-top: 15px;
				padding-bottom: 15px;
				@include hover-focus-active() {
					color: $headings-color;
					background-color: $theme-color;
				}
			}
			div.g-recaptcha, 
			input#give-email{
				margin: 0px;
			}
		}		
	}
}

.give-donation-history{
	.give-table{
		margin-top: 0;
		th{
			border-top: 1px solid $border-color !important;
		}
	}
}

table.give-table{
	th{
		font-size: 18px;
		font-weight: $font-weight-medium;
		color: $headings-color;
	}
}

.give-page{
	&.give-failed-transaction{
		.site-main{
			.label-donte-failed{
				.elementor-text-editor{
					position: relative;
					padding: 100px 0 0 0;
					&:before{
						top: 0;
						content: "";
						background-image: url('../images/face.svg');
						background-repeat: no-repeat;
						background-position: 0 0;												
						@include center-align(absolute);
						@include background-size(cover);
						@include square(80px);
					}
				}
			}
		}
	}
}

.give_receipt_offline_payment{
	p{		
		&:last-child{
			margin-bottom: 0px;
		}
	}
	ul,ol{
		@include rtl-padding-left(16px);
	}
}

.give-large-label{
	font-size: 20px;
	line-height: 30px;
	color: $headings-color;
	@include media(desktop) {
		font-size: 30px;
		line-height: 40px;
	}
}

.give-panel{
	margin-bottom: 20px;
	&:last-child{
		margin-bottom: 0px;
	}
	.give-panel-title{
		margin: 0px;
		padding: 0px;
		text-transform: uppercase;
		font-weight: 400;					
		font-size: 16px;
		line-height: 26px;
		font-family: $font-family-base;

		@include media(tablet) {
			font-size: 18px;
			line-height: 28px;
		}

		a{
			padding: 10px 15px;
			background-color: $theme-color;
			background-color: #eaeaea;
			width: 100%;			
			position: relative;
			@include inline-block();
			@include border-radius(30px);
			@include transition($linear);
			@include media(tablet) {
				padding: 11px 35px;
			}
			@include hover-focus-active() {
				color: $link-color;
				background-color: $theme-color;
			}
			.fa{
				font-size: 10px;
				@include vertical-align(absolute);
				@include rtl-right(15px);

				@include media(tablet) {
					font-size: 12px;
					@include rtl-right(35px);
				}

			}
		}
	}
	.give-panel-body{
		padding: 20px 0 10px 0;
		@include media(tablet) {
			padding: 30px 0 10px 0;
		}
	}
}

.give-entry-content-list{
	@include flexbox();	
	@include flex-direction(column);

	@include media(tablet) {
		@include flex-direction(row);
	}

	> div{		
		@include rtl-margin(0px, 20px, 20px, 20px);
		@include media(tablet) {			
			@include rtl-margin(0px, 43px, 15px, 43px);
		}
		&:first-child{
			@include rtl-margin-left(0);
			@include rtl-margin-right(0);
			margin-bottom: 50px;

			@include media(tablet) {
				margin-bottom: 20px;
				@include rtl-margin-right(20px);
			}

		}
		&:last-child{
			@include rtl-margin-left(0);
			@include rtl-margin-right(0);
		}
	}
	.give-entry-list{
		@include flex-basis(100%);
		max-width: 100%;

		@include media(tablet) {
			@include flex-basis(53%);
			max-width: 53%;
		}

	}
	.give-entry-list-photo{
		@include flex-basis(100%);
		max-width: 100%;

		@include media(tablet) {
			@include flex-basis(47%);
			max-width: 47%;
		}

		img{
			margin-top: 0px;
		}
	}
}

.give-goal-progress{
	position: relative;
	.income{
		color: $text-color;
		font-size: 20px;
		letter-spacing: 0;
	}
	.progress-bar-circle{
		position: relative;				
		.raised{
			margin: 0;
			padding: 0;
			color: $text-color;
			font-size: 20px;	
			font-weight: $font-weight-medium;		
			@include center-box(absolute);
			> *{
				color: inherit;
			}
			sup{
				font-weight: 400;
			}
		}
	}
}

.first-chil{
	clear: none;	
	@include media(desktop) {		
		clear: both;
	}
}

.archive-give{
	.main-content{
		padding-bottom: 23px;		
		@include media(tablet) {
			padding-bottom: 30px;		
		}
		@include media(desktop) {
			padding-bottom: 116px;		
		}
	}
}

.layout-donation-grid{	
	.paging-navigation{
		.apus-pagination{			
			padding: 30px 0 40px 0;
			text-align: center;
			@include media(desktop) {
				padding-bottom: 20px;
			}

		}
	}
}

.layout-donation-list{
	.give-list{
		margin-top: 30px;			
		.entry-title{
			font-size: 18px;
			line-height: 30px;
			font-weight: $font-weight-medium;
			margin-bottom: 24px;
			margin-top: 0;			
		}
		.goal-wrapper{
			margin-bottom: 34px;
			@include flexbox();
			@include align-items(center);
			@include flex-direction(column);
			@include media(tablet) {
				@include flex-direction(row);				
			}	
			> div{
				@include rtl-margin-right(0);
				
				@include media(tablet) {
					@include rtl-margin-right(25px);	
				}

				&:last-child{
					@include rtl-margin-right(0px);
				}
			}		
		}
		.donate-wrapper{						
			strong{
				font-weight: 400;
			}
			.donation-goal{
				.text{
					color: $theme-color;
				}
			}
		}
		.donator-number{			
			a{
				color: inherit;				
			}
			*{
				font-size: inherit;
			}
			strong{
				font-weight: 400;
			}
		}
		.give-image{			
			@include rtl-margin-right(0px);	
			@include media(tablet) {
				max-width: 40%;
				@include flex-basis(40%);				
			}					
			.image-wrapper{
				margin-bottom: 0px;				
				img{
					@include border-radius-separate(10px,10px,0px,0px);		

					@include media(tablet) {
						@include border-radius-separate(10px,0px,10px,0px);								
					}

				}
			}
		}
		.give-content{
			text-align: center;
			max-width: 100%;			
			padding: 30px;
			@include flex-basis(100%);			
			@include media(tablet) {				
				max-width: 60%;
				padding-top: 24px;
				@include flex-basis(60%);
				@include rtl-text-align-left();
			}			
		}
		.give-list-middle{
			border: 1px solid $border-color;
			@include clearfix();
			@include transition($linear);			
			@include flex-direction(column);
			@include border-radius-separate(10px,10px,0px,0px);					
			@include media(tablet) {
				@include flex-direction(row);
				@include border-radius-separate(10px,0px,10px,0px);					
			}
			@include hover() {
				border-color: $theme-color;
				@include border-radius(10px);
			}
		}
		.give-goal-progress{
			margin-bottom: 20px;

			@include media(tablet) {
				margin-bottom: 0;
			}

			.progress-bar-circle{
				@include square(80px);
				@include rtl-margin-left(auto);
				@include rtl-margin-right(auto);

				@include media(tablet) {
					@include rtl-margin-left(0);
					@include rtl-margin-right(0);			
				}

				canvas{
					@include square(100% !important);
				}
			}
		}
		&:first-child{
			margin-top: 0px;
		}
		~ .paging-navigation{
			.apus-pagination{
				padding-top: 60px;				
			}
		}
	}
}

table.give-table {
	border-top: 1px solid $border-color;
	border-bottom: 1px solid $border-color;
	@include media(desktop) {
		border-top: none;
		border-bottom: none;
	}
}

.detail-give{	
	.give_forms{		
		.entry-title{
			font-size: 26px;
			line-height: 36px;
			font-weight: $font-weight-medium;			
			text-align: center;
			margin: 0 0 10px 0;
			@include media(tablet) {				
				font-size: 30px;
				line-height: 40px;
				margin: 0 0 30px 0;
			}
			@include media(desktop) {
				font-size: 32px;
				line-height: 42px;
			}
		}
		#comments{
			.comment-list{
				margin-bottom: 32px;
			}
		}
		.comments-area{			
			margin-top: 40px;
			padding-top: 15px;
			border-top: 1px solid $border-color;

			@include media(tablet) {
				margin-top: 55px;
				padding-top: 30px;
			}

			#respond{
				.title{
					margin-bottom: 15px;
				}
				.logged-in-as{				
					margin-top: 0;
				}
			}			
		}	
		.give-single-meta{
			color: $entry-blog-date-color;
			font-style: italic;
			> *{
				@include rtl-padding-right(12px);
				&:last-child{
					@include rtl-padding-right(0);
				}
			}
			.post-author{				
				position: relative;
				@include rtl-padding-left(23px);
				&:before{
					content: '\f2c0';
					font-family: $font-awesome;					
					top: -1px;
					position: absolute;						
					font-style: normal;
					color: $theme-color;
					font-size: 14px;					
					@include rtl-left(0);		
					@include rtl-margin-right(5px);		
				}
			}
			.entry-date{
				position: relative;
				@include rtl-padding-left(23px);
				&:before{
					content: '\f133';
					font-family: $font-awesome;					
					top: -1px;
					position: absolute;						
					font-style: normal;
					font-size: 14px;					
					color: $theme-color;
					@include rtl-left(0);		
					@include rtl-margin-right(5px);		
				}				
			}	
			.entry-comments{
				position: relative;
				@include rtl-padding-left(23px);
				&:before{
					content: '\f0e5';
					font-family: $font-awesome;					
					top: -1px;
					position: absolute;						
					font-style: normal;
					font-size: 14px;	
					color: $theme-color;				
					@include rtl-left(0);		
					@include rtl-margin-right(5px);		
				}
			}	
		}	
		.top-info-give{			
			.image-wrapper{
				img{
					@include border-radius-separate(10px, 10px, 0px, 0px);
					@include media(tablet) {
						@include border-radius-separate(20px, 20px, 0px, 0px);
					}
				}
			}
		}	
		.give-form-wrap{
			padding-bottom: 40px;
			margin-bottom: 40px;
			border-bottom: 1px solid $border-color;
			&.give-display-button-only{
				text-align: center;
			}
		}		
		.give-goal-progress{	
			margin-bottom: 30px;
			min-height: 72px;	
			text-align: center;
			@include flexbox();
			@include align-items(center);
			@include flex-direction(column);

			@include media(tablet) {
				@include rtl-text-align-left();
				@include flex-direction(row);
				margin-bottom: 50px;
			}

			.total-goal{
				position: relative;
				@include rtl-padding-left(30px);
				&:before{
					color: $theme-color;
					top: 10px;
					font-size: 18px;
					position: absolute;
					content: '\f0d6';
					font-family: $font-awesome;
					@include rtl-left(0);
				}
			}			

			> *{
				margin: 5px 0;
				font-size: 20px;

				&:first-child{
					margin-top: 0px;
				}
				&:last-child{
					margin-bottom: 0px;
				}
				
				@include media(tablet) {
					margin: 0;
				}

				&:first-child{
					@include rtl-margin-left(0);
				}	
				&:last-child{
					@include rtl-margin-right(0);
				}		
			}	
			.donator-number{			
				position: relative;
				@include rtl-padding-left(30px);
				&:before{
					font-size: 18px;
					color: $theme-color;
					content:'\f08a';
					top: 3px;
					position: absolute;
					font-family: $font-awesome;
					@include rtl-left(0);
				}
				strong{
					font-weight: 400;
				}
				@include media(tablet) {
					@include rtl-margin-left(auto);		
				}
			}
			.progress-bar-circle{
				display: block;
				@include square(72px);				
				@include media(tablet) {
					@include center-align(absolute);		
				}
			}
		}
		.give-entry-description{
			.give-entry-title{
				font-size: 20px;
				line-height: 30px;
				text-transform: uppercase;	
				font-weight: $font-weight-medium;			
				margin-bottom: 20px; 
				margin-top: 15px;
				@include media(desktop) {
					font-size: 26px;
					line-height: 36px;
					margin-bottom: 26px; 		
					margin-top: 20px;								
				}
			}
		}
	}
}

[id*=give-form] fieldset{
	overflow: visible;
}

form[id*=give-form] .give-donation-amount {
    margin: 0 0 20px;
    @include flexbox();
    @include justify-content(center);
    @include media(desktop) {
    	@include justify-content(flex-start);
    }
}

.give-submit-button-wrap{
	text-align: center;
	@include media(desktop) {
		@include rtl-text-align-left();
	}
}

.give-submit-button-wrap .give-submit, [id^="give-user-login-submit"] .give-submit {
	float: none;
	@include media(desktop) {
		@include rtl-float-left();
	}
}

form[id*=give-form]{
	#give-final-total-wrap{
		margin-bottom: 40px;
	}
	#give-gateway-radio-list{
		> li{
			line-height: 36px;	
			@include clearfix();
			@include inline-flex();
			@include align-items(center);	
			@include media(desktop) {		
				> *{
					@include rtl-float-left();
				}		
			}
		}
	}
}

form[id*=give-form] #give-gateway-radio-list > li input[type=radio]{	
	@include rtl-margin(0,5px,0,2px);
}

form[id*="give-form"] p.give-loading-text, 
form[id*="give-form"] span.give-loading-text {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	top: 0;
	margin: auto;
	z-index: 1;
	@include square(100px);
}

[id*=give-form].give-fl-form.give-fl-style-give input.give-fl-input[type=email],
[id*=give-form].give-fl-form.give-fl-style-give input.give-fl-input[type=number],
[id*=give-form].give-fl-form.give-fl-style-give input.give-fl-input[type=password],
[id*=give-form].give-fl-form.give-fl-style-give input.give-fl-input[type=search],
[id*=give-form].give-fl-form.give-fl-style-give input.give-fl-input[type=tel],
[id*=give-form].give-fl-form.give-fl-style-give input.give-fl-input[type=text],
[id*=give-form].give-fl-form.give-fl-style-give input.give-fl-input[type=url],
[id*=give-form].give-fl-form.give-fl-style-give input.give-fl-input,
[id*=give-form].give-fl-form.give-fl-style-give select.give-fl-select,
[id*=give-form].give-fl-form.give-fl-style-give textarea.give-fl-textarea{
	-webkit-appearance: none;
	-webkit-backface-visibility: hidden;
	height: auto;
	min-height: auto;	
	cursor: pointer;
	color: $input-color !important;
	background: $input-bg;
	border: solid 1px $input-bg;	
	outline: none;
	padding: 20px 23px 4px;
	filter: none;	
	@include transition($linear);
	@include appearance(none);	
	@include border-radius(0);		
	@include box-sizing(border-box);
	&:-moz-autofill, 
	&:-moz-autofill-preview {
		filter: grayscale(21%) brightness(88%) contrast(161%) invert(10%) sepia(40%) saturate(206%);
	}
	&:required,
	&:optional,
	&:invalid{		
		@include box-shadow(none);
	}
	@include hover-focus-active() {
		border-color: $theme-color;		
		background-color: $white;
	}	
}

[id*=give-form].give-fl-form.give-fl-style-give .give-fl-is-active select.give-fl-select,
[id*=give-form].give-fl-form.give-fl-style-give .give-fl-is-active textarea.give-fl-textarea,
[id*=give-form].give-fl-form.give-fl-style-give textarea.give-fl-textarea{
	min-height: 150px;
	padding-left: 23px !important;
	padding-right: 23px !important;
}

[id*=give-form].give-fl-form.give-fl-style-give label.give-fl-label {
	font-size: 13px;
    font-weight: 400;
    color: $headings-color;
    @include rtl-left(23px);
}

form[id*=give-form] .give-donation-amount #give-amount, 
form[id*=give-form] .give-donation-amount #give-amount-text{
	min-width: 143px;
}
    
form[id*="give-form"]{
	.give-payment-mode-label{	
		.give-loading-animation {
			text-indent: -99999px;
			display: block;
			top: 0;        
			overflow: hidden;
	        position: absolute;
	        @include size(100%,50%);	        
	        @include transform-origin(50%, 100%);        
	        @include animation(loading 1.5s linear infinite);
	        &:before {
	            content: "";
	            display: block;
	            position: absolute;            
	            @include size(100%,200%);
	            border: 2px solid $theme-color;
	            @include border-radius(100%);
	        }
		}
	}	
} 

#give-recurring-form, form.give-form, form[id*=give-form]{
	margin-bottom: 0;
	position: relative;
}

form[id*=give-form] #give-final-total-wrap .give-donation-total-label{
	background-color: $input-bg;
	border-color: $border-color;
}

form[id*=give-form] #give-final-total-wrap .give-final-total-amount{
	border-color: $border-color;	
}

form[id*=give-form] .give-donation-amount .give-currency-symbol.give-currency-position-before{	
	border-color: $border-color;
	background-color: $input-bg;
}

form[id*=give-form] .give-donation-amount #give-amount, form[id*=give-form] .give-donation-amount #give-amount-text {
    border-color: $border-color;            
}

.give-submit-button-wrap span.give-loading-animation, [id^="give-user-login-submit"] span.give-loading-animation {	
	@include rtl-margin(18px, 0, 0, 18px);
}

#give-recurring-form h3.give-section-break, #give-recurring-form h4.give-section-break, #give-recurring-form legend, form.give-form h3.give-section-break, form.give-form h4.give-section-break, form.give-form legend, form[id*=give-form] h3.give-section-break, form[id*=give-form] h4.give-section-break, form[id*=give-form] legend{
	border-color: $border-color;
}

#give-recurring-form .form-row input[type=email], #give-recurring-form .form-row input[type=password], #give-recurring-form .form-row input[type=tel], #give-recurring-form .form-row input[type=text], #give-recurring-form .form-row input[type=url], #give-recurring-form .form-row select, #give-recurring-form .form-row textarea, form.give-form .form-row input[type=email], form.give-form .form-row input[type=password], form.give-form .form-row input[type=tel], form.give-form .form-row input[type=text], form.give-form .form-row input[type=url], form.give-form .form-row select, form.give-form .form-row textarea, form[id*=give-form] .form-row input[type=email], form[id*=give-form] .form-row input[type=password], form[id*=give-form] .form-row input[type=tel], form[id*=give-form] .form-row input[type=text], form[id*=give-form] .form-row input[type=url], form[id*=give-form] .form-row select, form[id*=give-form] .form-row textarea{
	-webkit-appearance: none;
	-webkit-backface-visibility: hidden;
	cursor: pointer;
	color: $input-color !important;
	background: $input-bg;
	border: solid 1px $input-bg;	
	outline: none;
	padding: 13px 23px;	
	filter: none;	
	@include transition($linear);
	@include appearance(none);	
	@include border-radius(0);		
	@include box-sizing(border-box);
	&:-moz-autofill, 
	&:-moz-autofill-preview {
		filter: grayscale(21%) brightness(88%) contrast(161%) invert(10%) sepia(40%) saturate(206%);
	}
	@include hover-focus-active() {
		border-color: $theme-color;		
		background-color: $white;
	}
	&:required,
	&:optional,
	&:invalid{		
		@include box-shadow(none);
	}
}

form[id*="give-form"] #give-final-total-wrap .give-donation-total-label,
form[id*="give-form"] #give-final-total-wrap .give-final-total-amount {
	height: 45px;
	line-height: 45px;
	@include media(tablet) {
		height: 35px;
		line-height: 35px;
	}
}

// Homepage Elements
.widget-donations{
	.widget-give{
		outline: none;
	}
	&.carousel{
		.slick-arrow{			
			display: none!important;
			@include media(desktop) {
				display: none !important;
			}

		}
		.slick-dots{
			display: block;
			padding-top: 10px;
			@include media(tablet) {
				padding-top: 15px;
			}
			@include media(desktop) {				
				display: none !important;				
			}
		}
	}
}