﻿.gray-icon {
	color:#333;
}

.red-icon {
	color:#e51d2e;
}

#my-donations {
	background:#fff;
}

#my-donations h3 {
	color:#333;
	margin:0 0 5px -5px;
}

#my-donations h3, 
#my-donations h4 {
    font-family: 'proxima-nova';
    font-weight: 500;
	text-transform:capitalize;
}

.my-donations--list {
	margin-bottom:2em;
}

.my-donations--list-item {
	transition: all .35s;
	-webkit-transition:all .35s;
	-moz-transition:all .35s;
	background-color:#fcfcfc;
	font-size:10px;
	background-repeat:no-repeat;
	background-position:22px center;
	cursor:pointer;
	position:relative;
	display:block;
}

.my-donations--item-container {
	clear:both;
}

.my-donations--list li:nth-last-child(2n+1) .my-donations--list-item {
	background-color:#ededed;
}

@media (max-width:767px) {
	.my-donations--title {
		font-size:24px;
		margin:0 0 10px;
	}
}

@media (min-width:767px) {
	.no-touch .my-donations--list-item:hover,
	.no-touch .my-donations--list li:nth-last-child(2n+1) .my-donations--list-item:hover {
		background-color:#cacaca;
	}
	.no-touch .my-donations--list-item:hover .my-donations--actions a,
	.no-touch .my-donations--list-item:hover .my-donations--actions .svg {
		color:white;
		stroke:white;
	}
	.no-touch .my-donations--actions a.inactive {
		cursor:default;
	}
	.no-touch .my-donations--actions a.inactive:hover {
		background-color: transparent;
		color: #fff;
	}

	.no-touch .my-donations--actions a.inactive:hover svg {
		stroke: #fff !important;
	}
	.no-touch .my-donations--container .my-donations--list-item:hover .svg.canceledit-icon {
		stroke:#333;
	}
}

.my-donations--list-item p,
.my-donations--list-item h4 {
	margin:0;
}

.my-donations--list-item h4 {
	font-size:14px;
	color:#333;
}

.my-donations--expand {
	padding:10px 20px 10px 60px;
}

/* More Specific CSS related to type of donation */

.my-donations--vehicle .my-donations--list-item {
	background-image:url(../Images/icon-vehicles.svg);
}

.my-donations--drop-off .my-donations--list-item {
	background-image:url(../Images/icon-dropoffs.svg);
}

.my-donations--pickup .my-donations--list-item{
	background-image:url(../Images/icon-pickups.svg);
}

.my-donations--container .svg.svg-arrow {
	width: 5px;
    height: 22px;
    position: absolute;
    left: 8px;
    top: 18px;
    stroke: #545454;
    stroke-width:.4;
	transition:all .35s;
}

.my-donations--container .expanded .svg.svg-arrow {
	transform:rotate(90deg);
}

.my-donations--scheduled {
	color:#22b573;
}

.my-donations--completed {
	color:#29abe2;
}

.my-donations--canceled {
	color:#ed1c24;
}

/* Action Icons */

.my-donations--actions {
    float: right;
}

.my-donations--actions a {
    float: right;
    display: block;
    padding: 12px 10px;
	text-align:center;
	color:#444;
	background-color:transparent;
	transition:all .35s;
	-webkit-transition: all .35s;
	-moz-transition: all .35s;
	position:relative;
	text-transform: uppercase;
    font-size: 7px;
    letter-spacing: 1px;
	font-weight:bold;
}

.my-donations--actions .spinner {
    height: 20px;
    width: 20px;
    border-width: 2px;
    margin: 17px 13px 10px 13px!Important;
	transition:margin 0s;
	-webkit-transition:margin 0s;
	-moz-transition:margin 0s;
}

.my-donations--actions .spinner:after {
	display:none !important;
}

.my-donations--actions a.my-donation--save.spinner {
    margin-right: 19px !important;
}

.my-donations--actions .spinner .svg {
	opacity:0;
}

.my-donations--actions a.my-donation--save {
	color:#ed1c24;
	margin-right:10px;
	padding-right:10px;
	padding-bottom:11px;
}

.my-donations--actions a:after {
	right: 100%;
	top: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: transparent;
	border-right-color: #e51d2e;
	border-width: 5px;
	margin-top: -5px;
	opacity:0;
	transition:all .35s;
}

.my-donations--actions a.my-donation--save:after {
    content: "";
    display: block;
    width: 1px;
    position: absolute;
    right: -5px;
    background: #e7e7e7;
    z-index: 999;
    margin: 0;
    opacity: 1;
    border: none;
    height: 34px;
    top: 18%;
    left: auto;
}

.editing .my-donations--actions a.my-donation--save:after {
	display:none;
}

.my-donations--actions a.my-donation--edit-workflow,
.my-donations--details-header a.my-donation--edit-workflow {
	opacity:0;
	transition:all .35s;
	display:none;
}

.editing .my-donations--actions a.my-donation--edit-workflow,
.editing .my-donations--details-header a.my-donation--edit-workflow {
	opacity:1;
	padding-bottom:11px;
	display:block;
}

.my-donations--container .svg {
    height: 22px;
	width: 22px;
	padding:0 0 3px 0;
	fill: none;
    stroke: #444;
    stroke-width: 1;
	stroke-width:.6;
    stroke-miterlimit: 10;
	margin:0 auto;
	display:block;
	transition:all .35s;
}

.my-donations--container .svg.save-icon,
.my-donations--container .svg.canceledit-icon {
    stroke-width: .3;
    padding-top: 1px;
    height: 23px;
    width: 23px;
    stroke: transparent;
    fill: #e51d2e;
}

.no-touch .my-donations--actions a:hover,
.editing .my-donations--actions a.my-donation--edit {
	background-color:#ed1c24;
	color:white;
	text-decoration:none;
}

.no-touch .my-donations--actions a:hover:after {
	/*opacity:1;*/
}

.no-touch .my-donations--actions a:hover .svg,
.editing .my-donations--actions a.my-donation--edit .svg {
	stroke:#fff;
}

.my-donations--edit-items {
    display: inline-block;
    cursor: pointer;
    vertical-align: middle;
    margin: 0 0 0 5px;
}

.my-donations--edit-items svg {
	transition:all .35s;
}

.no-touch .my-donations--edit-items:hover svg {
	stroke:#000;
}

a.my-donations--edit-items.spinner {
    display: inline-block;
    vertical-align: middle;
    border-width: 2px;
    height: 20px;
    width: 20px;
    margin-left: 6px !important;
    margin-top: -1px !Important;
}

a.my-donations--edit-items.spinner svg {
    opacity: 0;
}

@media (max-width:767px) {
	.my-donations--list-item > .my-donations--actions {
		display:none;
	}
	.my-donations--container .svg {
		width:22px;
		height:22px;
	}
}

/* My Donation Details */

.my-donations--details {
	transform:translate(0,0);
    max-height: 0;
    overflow: hidden;
    transition: max-height .15s ease-out;
	-webkit-transition: max-height .15s ease-out;
	clear:both;
}

.expanded .my-donations--details {
	max-height:999px;
	transition: max-height .75s ease-in;
}

.my-donations--details span {
    font-weight: 800;
    color: #545454;
}

.my-donations--details-header {
	border-bottom:1px solid #ccc;
	padding:10px 0 5px 0;
	margin:0 0 5px 0;
	overflow:hidden;
}

.my-donations--details-body {
	padding:1em 0;
}

.my-donations--details-body i {
	font-style:normal;
}

@media (min-width:768px) {
	.my-donations--details-header {
		display:none;
	}
	.my-donations--details-body {
		padding-left:50px;
	}
}

.my-donations--details-header .fa {
	margin:0;
}

.my-donations--details-header .pull-right .fa {
	font-size:15px;
}

.my-donations--details-header a {
	color: #4d4d4d;
    display: inline-block;
    font-size: 11px;
    text-align: center;
    vertical-align: top;
    margin: 0 5px 0 0;
    cursor:pointer;
}

.my-donations--details-header > a {
    padding-top: 8px;
}

.no-touch .my-donations--details-header a:hover {
	color:#e51d2e;
}

@media (max-width:767px) {
	.my-donations--details-header a {
		font-size:10px;
		margin-right:10px;
	}
	.my-donations--details-header .pull-right a {
		float:right;
		padding:10px;
		margin:0;
	}
	.my-donations--details-header a:last-child {
		margin-right:2px;
	}
	.my-donations--details-header {
		padding:6px 0 0;
	}
}

.my-donations--container .svg.canceledit-icon {
    fill: #fcfcfc;
    stroke: black;
}

.my-donations--details-header .pull-right a.my-donation--save {
	margin-right: 10px;
}

.my-donations--details-header .pull-right a.my-donation--canceledit {
    margin-right: 30px;
}

.editing .my-donation--edit {
    display: none;
}

.editing .my-donation--cancel {
    display: none;
}
 
.editing .my-donation--email {
    display: none;
}

/* Date Picker */

.my-donations--container .svg.calendar-icon {
    stroke-width: .4;
    position: absolute;
    right: 5px;
    top: 8px;
    cursor: pointer;
	-webkit-transition: all .35s;
	-moz-transition: all .35s;
    transition: all .35s;
}

.my-donations--date-picker {
    position: relative;
    display: inline-block;
    width: 150px;
}

[class^="my-donation"].spinner svg {
    opacity: 0;
}

[class^="my-donation"].spinner {
	width: 20px;
    height: 20px;
    border-width: 2px;
}

.my-donation--calendar-dialog.spinner {
    position: absolute;
    right: 7px;
    top: 8px;
}

@media (max-width:480px) {
	.my-donation--calendar-dialog {
		top: 2px;
		position: absolute;
		right: 2px;
	}
}


.my-donations--date-picker input {
    padding-right: 29px;
}

.my-donations--container .svg.calendar-icon:hover {
    stroke: #888;
}

[aria-describedby="date-picker"] .table > .row,
[aria-describedby="date-picker"] #date-picker > .top-space,
[aria-describedby="date-picker"] .how-did-you-hear,
[aria-describedby="date-picker"] .pickup-back,
[aria-describedby="date-picker"] .pickup-next {
    display: none;
}

[aria-describedby="date-picker"] .table > .row:first-child {
	display:block;
}

[aria-describedby="date-picker"] .ui-datepicker-inline .ui-datepicker-header {
	background:#302921;
	border-bottom:none;
	padding:10px 0;
	border-top-right-radius: 6px;
    border-top-left-radius: 6px;
}

[aria-describedby="date-picker"] .ui-datepicker-inline table.ui-datepicker-calendar {
	border-bottom-right-radius: 6px;
    border-bottom-left-radius: 6px;
}

[aria-describedby="date-picker"] .ui-datepicker-inline .ui-datepicker-prev, 
[aria-describedby="date-picker"] .ui-datepicker-inline .ui-datepicker-next {
	top:9px;
}

[aria-describedby="date-picker"] .ui-datepicker-inline.ui-widget-content {
	padding:0;
	margin:10px 0 0;
	max-width:100%;
}

[aria-describedby="date-picker"]  #date-picker .table {
	max-width:99%;
}

/* Item Picker */

[aria-describedby="item-picker"] .start-mobile-pickup-text,
[aria-describedby="item-picker"] .pickup-next {
	display:none;
}

[aria-describedby="item-picker"] .ui-widget-content a {
    color: white;
}

[aria-describedby="item-picker"] .ui-widget-content a.mobile-add-more-items {
	color:#e51d2e;
}

/*.ui-dialog[aria-describedby="item-picker"] {
    top: 20px !important;
    position: fixed;
}*/



[aria-describedby="item-picker"].ui-dialog .ui-dialog-content.ui-widget-content {
	padding: 0;
	margin: 0;
	border-radius: 0;
}

[aria-describedby="item-picker"] div#mobile-item-chooser {
	border-radius: 0;
}

.ui-dialog[aria-describedby="item-picker"] p.top-space-lg.bottom-space-lg {
		padding: 0;
		margin: 15px 10px 0;
	}


@media (max-width:320px) {
	[aria-describedby="item-picker"] .mobile-donate-items > .row {
		padding:0 10px;
	}
}

@media (max-width:480px), (max-height:900px) {
	[aria-describedby="item-picker"] .mobile-donate-items > .row.mobile-additional-items {
		min-height:0;
	}

	
	[aria-describedby="item-picker"] .mobile-donate-items > .row {
		padding: 0;
		min-height: 50px;
	}

	[aria-describedby="item-picker"] .mobile-donate-items > .row#other-item-picker,
	[aria-describedby="item-picker"] .mobile-donate-items > .row.rendered-other-item {
		min-height: 59px;
	}

	[aria-describedby="item-picker"] .mobile-donate-items > .row.rendered-other-item {
		min-height:45px;
	}

	[aria-describedby="item-picker"] .mobile-donate-items > .blank-other-item-block, .row.collapse {
		min-height: 0;
		overflow: hidden;
	}

	[aria-describedby="item-picker"] select#item-select-common {
		height: 34px;
		margin-left: -7px;
		/* font-size: 7px; */
		color: black;
	}

	.ui-dialog[aria-describedby="item-picker"] .item-name {
		font-size: 13px;
		line-height: 1.2;
		padding: 8px 0 0;
	}

	.ui-dialog[aria-describedby="item-picker"] .item-icon .sa-icon {
		width: 40px;
		height: 40px;
		background-size: 772px 251px;
	}

	.ui-dialog[aria-describedby="item-picker"] .item-icon .sa-icon.clothes-pickup {
		background-position: -675px 0px;
	}

	.ui-dialog[aria-describedby="item-picker"] .item-icon .sa-icon.books-pickup {
		background-position: -630px 1px;
	}

	.ui-dialog[aria-describedby="item-picker"] .item-icon .sa-icon.misc-pickup {
		background-position: -630px -43px;
	}



	.ui-dialog[aria-describedby="item-picker"] .item-icon .sa-icon.household-pickup {
		background-position: -631px -89px;
	}

	.ui-dialog[aria-describedby="item-picker"] .item-icon .sa-icon.chair-pickup {
		background-position: -676px -88px;
	}

	.ui-dialog[aria-describedby="item-picker"] .item-icon .sa-icon.couch-pickup {
		background-position: -675px -41px;
	}

	.ui-dialog[aria-describedby="item-picker"] .item-qty input, .ui-dialog[aria-describedby="item-picker"] .item-qty span {
		margin-top: 7px;
	}

	.ui-dialog[aria-describedby="item-picker"] .item-qty input {
		margin-top: 5px;
	}
}


/* Footer */

.my-donations--footer > a {
	display:block;
	text-align:center;
}

.touch .my-donations--footer > a:hover {
	text-decoration:none;
}

.my-donations--footer-icon {
	height:50px;
	width:50px;
	display:block;
	margin:0 auto;
}

.my-donations--footer-icon .st0 {
	fill:#e51d2e;
}

.my-donations--footer-icon .st1 {
	fill:#fff;
}

.my-donations--footer-phone {
    text-align: center;
    padding-bottom:2em;
    overflow: hidden;
	color:#545454;
}

.my-donations--footer-phone-overflow {
	overflow:hidden;
}

.my-donations--footer-phone p {
    display: inline-block;
    position: relative;
    background: #fff;
    padding: 0 10px;
    margin: 0;
	font-weight:100;
}

.my-donations--footer-phone p a {
	color:#545454;
	font-weight:700;
}

.my-donations--footer-phone p:after,.my-donations--footer-phone p:before {
    content: "";
    display: block;
    border-top: 1px solid #ccc;
    position: absolute;
    left: -200%;
    width: 200%;
    height: 1px;
    top: 50%;
}

.my-donations--footer-phone p:after {
    left: auto;
    right: -200%;
}

@media (max-width:767px) {
	.my-donations--footer > a {
		background: #e51d2e;
		color: white;
		overflow: hidden;
		margin: 1em;
		border-radius: 5px;
		line-height: 50px;
		text-align: left;
	}

	.my-donations--footer > a br {
		display: none;
	}

	.my-donations--footer-icon {
		float: left;
		height:35px;
		width:35px;
		margin:7px 10px 0 0;
	}
	.my-donations--footer-icon .st0 {
		fill:#fff;
	}
	
	.my-donations--footer-icon .st1 {
		fill:#e51d2e;
	}

	.my-donations--footer-phone {
		padding-bottom:1em 0;
	}

	.my-donations--footer-phone a {
		display: block;
	}
}

/* Main Container */

.div-loading .my-donations--details-container {
	opacity:0;
	transition: all .35s;
	-webkit-transition: all .35s;
	-moz-transition: all .35s;
}

.my-donations--details-container {
	opacity:1;
}

.my-donations--details:after {
	width: 34px;
	height: 34px;
	display: block;
	content: "";
	border-top: 4px solid #C01D2B;
	border-right: 4px solid #e51d2e;
	border-bottom: 4px solid #e51d2e;
	border-left: 4px solid #e51d2e;
	border-radius: 100%;
	animation: rotate 1s infinite linear;
	opacity: 0;
	font-size: 0 !important;
    background-color: #fff !important;
    margin: 0 auto !important;
    border-radius: 50% !important;
    padding: 0 !important;
	opacity:0;
	transition: all .35s;
	-webkit-transition: all .35s;
	-moz-transition: all .35s;
	position:absolute;
	left:50%;
	top:20px;
}

.my-donations--details.div-loading:after {
	opacity:1;
}

.my-donations--details.div-loading {
	padding:2em 0;
	position:relative;
}

.ui-dialog.ui-widget-content[aria-describedby="item-select"] {
	width:480px !important;
}

.ui-dialog.ui-widget-content[aria-describedby="item-select"] .start-mobile-pickup-text,
.ui-dialog.ui-widget-content[aria-describedby="item-select"] .pickup-next,
.ui-dialog.ui-widget-content[aria-describedby="item-select"] .top-space {
	display:none;
}


/* List Nav */
.my-donations--list-nav-container {
	text-align: center;
	margin-bottom: 2em;
}
.my-donations--list-nav {
	text-align: center;
	line-height: 32px;
	height: 32px;
	display: inline-block;
	margin-bottom: 5px;
}
.my-donations--list-nav:after {
	content: '';
	display: table;
	clear: both;
}
.my-donations--list-nav span {
	color: #a3131f;
	padding: 0 8px;
	cursor: pointer;
}
.my-donations--list-nav span:hover {
	text-decoration: underline;
}
.my-donations--list-nav span.ellipsis {
	color: #000;
	cursor: default;
	padding: 0;
}
.my-donations--list-nav span.ellipsis:hover {
	text-decoration: none;
}
.my-donations--list-nav span.active {
	color: #000;
	font-weight: bold;
	cursor: default;
}
.my-donations--list-nav span.active:hover {
	text-decoration: none;
}
.my-donations--list-nav span.my-donations--list-nav--prev, .my-donations--list-nav span.my-donations--list-nav--next {
	display: inline-block;
	width: 32px;
	height: 32px;
	padding: 0;
	text-align: center;
	border-radius: 50%;
	position: relative;
	background: #ededed;
	transition: background-color .35s;
}
.my-donations--list-nav span.my-donations--list-nav--prev .svg.svg-arrow, .my-donations--list-nav span.my-donations--list-nav--next .svg.svg-arrow {
	top: 10px;
	left: 13px;
	height: 14px;
}
.my-donations--list-nav span.my-donations--list-nav--prev {
	float: left;
	margin-right: 10px;
}
.my-donations--list-nav span.my-donations--list-nav--next {
	float: right;
	margin-left: 10px;
}
.my-donations--list-nav span.my-donations--list-nav--prev:hover, .my-donations--list-nav span.my-donations--list-nav--next:hover {
	text-decoration: none;
	background: #cacaca;
}
