@charset "utf-8";
/*!
 * DESCRIPTION
 * Main MyDonate Fundraisers specific CSS file to contain re-usable + page content styles
 * Any responsive overrides should be done associated with main rule
 *
 * SECTIONS
 * Styles to consider for template-v3
 * Generic re-usable styles
 * Page content styles
 *
 */

/*====================================*\
    SECTIONS
\*====================================*/

.form-inline-forced .form-control {
	display: inline;
	width: auto;
}
@media (max-width: 767px) {
	.form-inline-forced--xsonly .form-control {
		display: inline;
		width: auto;
	}
	.form-inline-forced--xsonly .btn { vertical-align: inherit; }
}
/****************************** Fundraiser Pages ****************************************/

.fundraiser-banner { height: 180px; }
@media (min-width: 768px) {
	.fundraiser-banner { height: 280px; }
}
@media (min-width: 992px) {
	.fundraiser-banner { height: 363px; }
}

.block-donate-now { padding: 5px 30px; }
.block-donate-now p { margin-top: 10px; }
@media (min-width: 360px) {
	.block-donate-now { padding: 5px 30px; }
}
@media (min-width: 768px) {
	.block-donate-now { padding: 11px 30px; }	
}
@media (min-width: 992px) {
	.block-donate-now { padding: 6px 30px; }	
}


.fundraiser-profile { margin: 20px 0; }
.fundraiser-profile h2 { margin-top: 0; line-height: 1.1; }
.fundraiser-profile .img-center {height: 130px;}
.fundraiser-profile img { max-width: 150px; }
@media (min-width: 768px) {
	.fundraiser-profile { min-height: 280px; margin: 0; }
	.fundraiser-profile img {
 		max-width: 195px;
		max-height: 195px;
	}
	.fundraiser-profile h2, .fundraiser-profile h1 { margin-left: 15px; }
	.fundraiser-profile .img-center{ height: 225px; }
}
@media (min-width: 992px) {
	.fundraiser-profile { min-height:363px; }
	.fundraiser-profile img {
 		max-width: 260px;
		max-height: 260px;
	}	
	.fundraiser-profile .img-center{
		height:300px;
	}
}

.block-raising-money .logo-charities a {
	width: 82px;
	height: 70px;
	margin: 5px 1px;
	display: inline-block;
}
.block-raising-money .img-center { height: 120px;}
.block-raising-money .img-center img { max-width: 240px; max-height: 120px; }
.block-raising-money .logo-charities .img-center img { max-width: 70px; max-height: 70px; } /*For multi-charity*/
.block-raising-money p { padding: 15px 0 0 30px; }
.logo-charities { padding: 0 30px; }
@media (min-width: 768px) {
	.block-raising-money {
		background: #ffffff;
		padding-bottom: 6px;
	}
}
@media (min-width: 768px) and (max-width:991px) {
	.block-raising-money { padding-bottom: 8px; }
}

q:before {
	font-size: 48px;
	position: absolute;
	top: 30px;
	left: 30px;
}
q:after {
	font-size: 48px;
	position: absolute;
	right: 27px;
}

.block-quote { padding: 56px 48px; }
@media (min-width: 768px) and (max-width:991px) {
	.block-quote { padding: 38px; }
}

.img-thumbnail {
	padding: 4px 2px;
	display: inline-block;
	border: none;
	text-align: center;
	width: 134px;
}
.img-thumbnail img { max-width: 130px; max-height: 130px; }
@media (max-width: 359px) {
	.img-thumbnail { width: 124px; }	
	.img-thumbnail img { max-width: 120px; max-height: 120px; }
}

h3.margin-bottom-0 { color:#000; }

.block-donation-summary {
	background-color: #bfbfbf;
	padding: 10px;
}
.block-donation-summary__header {
	border-bottom: 1px solid #808080;
}
.block-donation-summary__header h2 {
	padding: 0 0 0 10px;
	margin-top: 0;
}
@media (min-width: 768px) {
 	.block-donation-summary a.btn { margin: 0 20%; }
}

@media (min-width: 768px) and (max-width:991px) {
	.block-donation-summary a.btn { margin: 0 35%; }
}

.block-gallery { padding-bottom: 25px; }
.block-gallery__no-image-text {
	display: inline-block; 	 
	vertical-align: middle;
}
@media (min-width:768px)
{
	.block-gallery__no-image-text {	margin-left: 1em; width: 60%; }
}

.carousel-caption {
	position: relative;
	left: 0;
	color: #666;
	font-weight: bold;
	text-shadow: none;
	padding-top: 30px;
}
.carousel-control.right { right:-27px; }
.carousel-control { 
	left: -27px; 
	opacity: 1;
	color: #666;
	bottom: 50%;
	top: auto; 
}
.carousel-indicators li { background-color: #919191; border: 1px solid #919191; }
.carousel-indicators .active {
	background-color: #666;
	border: 1px solid #666;
	height: 10px;
	width: 10px;
	margin: 1px;
}
.carousel-control.left, .carousel-control.right {
	background: none;
	filter: none;
}

.modal-dialog .carousel-indicators { bottom: 0; }
@media (min-width:768px){
	.modal-dialog .carousel-inner .item img, .modal-dialog .carousel-inner .item a img {
		line-height: 1;
		margin: 0 auto;
		max-height:520px;
		max-width: 520px;
	}
	.carousel-control.right { right: -30px; }
	.carousel-control { left: -30px; }
}

.modal-dialog .carousel-inner .item { height: 375px; }
.carousel-item-content-parent {
		height: 100%;
		width: 100%;
		display: table;
	}
.carousel-item-content-child {
		display: table-cell;
		vertical-align: middle;
		text-align: center;
	}
.carousel-item-content-child .img-responsive{ max-width: 260px; margin: 0 auto; }
@media (min-width: 768px)
{
	.modal-dialog .carousel-inner .item { height: 580px;}
	.modal-dialog { margin: 0 auto; }
	.extra-outer-margin{
		margin-left: -15px;
		margin-right: -15px;
		position: relative;
		z-index: 1;
	}
	.ribbon-box-shadow { box-shadow: 0 12px 7px -5px #333; }
}

.ribbon-left{
	border-width: 9px 5px 5px 10px;
	border-style: solid;
	border-color: #1d4281 #1d4281 transparent transparent;
}
.ribbon-right{
    border-color: #1d4281 transparent transparent #1d4281;
    border-style: solid;
    border-width: 9px 11px 5px 5px;
}

span.more { display: none;  }


.block-donations__message { padding: 10px 11px 10px 20px; color: #707172; }
@media (min-width:768px){
	.block-donations__message { padding: 10px 25px 10px 20px; }
}


.progress {
	margin-bottom: 0;
	background-color: #ababab;
	border-radius: 0;
}
.progress-bar-info {
	background-color: #55379b;
}

@media (min-width: 768px) {
	.search-results__item.search-results__item--grid {
		float: left;
		width: 48%;
 		margin: 7px;
	 	min-height: 225px;
	}
	.search-results__item--grid .search-results__item__scroll-area {
 		height: 115px;
 		overflow-y: auto;
 		overflow-x: hidden;
	}
	.search-results__item--grid:before, .search-results__item--grid:after { display: table; content: " "; }
	.search-results__item--grid img { float: left; }
	.search-results__item--grid:after { clear: both; }

	.modal-dialog { width: 800px; }
}
	
 @media (min-width: 768px) and (max-width:991px) {
	
	q::before { top: 18px; left: 15px; }
	.modal-dialog { width: 600px; }
}

 @media (min-width: 640px) and (max-width:767px) {
	.col-landscape-6 {
		width: 50%;
		float: left;
		margin-top: -10px;
	}
}


hr { border-color: #808080; }
.search-results__item--grid { border: none; }
@media (min-width: 992px) {
	.search-results__item--grid table th { width: 35% }
}

.carousel-item-border-first { border-bottom: 10px solid rgb(242, 242, 242); }
.carousel-item-border-second { border-top: 10px solid rgb(242, 242, 242); }

@media (min-width: 320px) and (max-width:767px) {
.search-result {
 	margin-bottom: 25px;
 	margin-left: 17px;
}
}
.search-results__item table th, .search-results__item table td { vertical-align: top; }

.text-conditional {
	font-style: italic;
	font-weight: normal;
	font-size: 12px;
}

.form-group { margin-bottom: 7px; }
/* .form-group .glyphicon { top:8px; } 14/02/2016  - Commented out by Alan to fix Calendar Glyphicon display on date picker fields like personal-account__my-reports__donations-report.html - If needed on other pages make more specific when re-enabling */
input[type="checkbox"] { margin: 8px 0 0; }

.table-strong td { font-weight: bold; }
.table-strong td:last-child { padding-left: 5px;}
.block-gift-aid textarea { background-color: #e8e8e8; }
abbr[title], abbr[data-original-title] { border-bottom: none; }
.progress-status--completed {
	border-top: 7px solid #d63181;
	padding: 0 !important;
	margin-right: 2px;
}
.progress-status {
	border-top: 7px solid #ccc;
	padding: 0 !important;
	margin-right: 2px;
}
.list-inline { margin-left:0; }
.popover {
	min-width: 200px;
	font-size: 12px;
}
.donation-type {
	/*background-color:#e8e8e8;*/
	border-radius: 4px;	
	margin: 15px 0 0 15px !important;
	padding: 15px 20px !important;
}

.error ul {
	margin: 0;
	padding: 10px 10px 0;
}
.glyphicon-alert { top:0 !important; }
.has-error .form-control-feedback { color: #d00; }

.search-results__item {
	padding: 1em;
	margin: 20px 0;
	background-color: #fff;
}
.search-results__item .row { position: relative; }
.search-results__item__buttons {
	padding-left: 15px;
	bottom: 0;
}
@media (min-width: 768px) {
.search-results__item--grid .search-results__item__fundraiser {
 min-height: 180px;
 margin-bottom: 37px;
}
.search-results__item__fundraiser { margin-bottom: 35px; }
.search-results__item__buttons { position: absolute; }
}
@media (min-width: 992px) {
.search-results__item--grid .search-results__item__fundraiser { min-height: 160px; }
}

/*********************** Charity Profile Page ******************************************/

.charity-banner { height: 106px; }
@media (min-width: 768px) {
	.charity-banner { height: 248px; }
}
@media (min-width: 992px) {
	.charity-banner { height: 320px; }
}
#charity-profile-carousel .carousel-indicators , #appeals-profile-carousel .carousel-indicators { bottom: -45px; }
#charity-profile-carousel .carousel-control , #appeals-profile-carousel .carousel-control { top:0; bottom:0; }
#charity-profile-carousel .carousel-control.left , #appeals-profile-carousel .carousel-control.left { left: -10px; }
#charity-profile-carousel .carousel-control.right , #appeals-profile-carousel .carousel-control.right { right: -10px; }
@media (min-width: 768px) {
	.block-right--last-help .sharing-links a { margin-bottom:5px; } 
	#charity-profile-carousel .carousel-indicators , #appeals-profile-carousel .carousel-indicators { bottom: -50px; }
	#charity-profile-carousel .carousel-control , #appeals-profile-carousel .carousel-control { bottom: -20px; top: auto; }
	.charity-profile-carousel-item {
		border:1px solid #ccc;
		height: 182px;
		margin-bottom: 15px;
	}
	.charity-profile-carousel-item img { vertical-align: middle; }
	.carousel-item-border-first { border-right: 10px solid rgb(242, 242, 242); border-bottom: none; }
	.carousel-item-border-second { border-left: 10px solid rgb(242, 242, 242); border-top: none; }
	#charity-profile-carousel .carousel-control.left , #appeals-profile-carousel .carousel-control.left { left: -55px; }
	#charity-profile-carousel .carousel-control.right , #appeals-profile-carousel .carousel-control.right { right: -55px; }
	.dl-horizontal dd { margin-left: 100px; }
	.dl-horizontal dt {
 		width: 100px;
 		text-align: left;
	}
}
 @media (min-width: 768px) and (max-width:991px) 
{
	#charity-profile-carousel .carousel-control.left , #appeals-profile-carousel .carousel-control.left { left: -42px; }
	#charity-profile-carousel .carousel-control.right , #appeals-profile-carousel .carousel-control.right { right: -42px; }
}
 
  
/******************************Charity Search and Event Profile Pages****************************************/

.block-charity-index.pagination > li > a, .block-charity-index.pagination > li > span { padding:1px 7px; }
.search-results__item--grid .grid-hide-text { display: none;}

@media (min-width: 768px)
{
	.search-results__item__charity .search-results__item__scroll-area { max-height: 210px; }
	.search-results__item--grid .search-results__item__charity .search-results__item__scroll-area { height: 190px; }
	.block-charity-number { margin-top:10px; }		
	.search-results__item--grid .block-charity-number { margin-top: 0; }
	.search-results__item--grid .block-no-giftaid { height: 30px; }
	.block-border-right { border-right: 1px solid #fff; }
	/*.search-results__item--grid .search-results__item__scroll-area a { display: block;}*/
}

@media (min-width: 768px) and (max-width:991px)
{	
	.search-results__item--grid .block-charity-number .col-sm-3, .search-results__item--grid .block-charity-number .col-sm-9 
	{ 
		width: 100%;
		text-align: center;
		margin-top: 0;
	}
}
@media (min-width: 992px)
{
	.search-results__item--grid .hidden-md-grid { display: none; }
	.event--variant1-target { margin-top: 30px !important; }
	.search-results__item--grid .search-results__item__charity .search-results__item__scroll-area {
 		height: 160px;
		overflow-y: auto;
 		overflow-x: hidden;
	}
}


/********************************* Team Profile Page ***********************/

.table-team-members tbody > tr > td { vertical-align: middle; font-size: 12px; }
.table-team-members img { max-width: 80px; margin: 5px 10px 5px 0; }

@media only screen and (max-width: 767px) {
/* Force table to not be like tables anymore */
.table-responsive-layout table,
.table-responsive-layout thead,
.table-responsive-layout tbody,
.table-responsive-layout th,
.table-responsive-layout td,
.table-responsive-layout tr
{
display: block;
}
 
/* Hide table headers (but not display: none;, for accessibility) */
.table-responsive-layout thead tr {
position: absolute;
top: -9999px;
left: -9999px;
}
 
.table-responsive-layout tr { border: 1px solid #ccc; }
  
.table-responsive-layout > tbody > tr > td, .table-responsive-layout > tbody > tr > th {
/* Behave like a "row" */
border: none;
border-bottom: 1px solid #eee;
position: relative;
padding-left: 50%;
white-space: normal;
text-align: left;
}
 
.table-responsive-layout td:before, .table-responsive-layout th:before {
/* Now like a table header */
position: absolute;
/* Top/left values mimic padding */
top: 6px;
left: 6px;
width: 45%;
padding-right: 10px;
white-space: nowrap;
text-align: left;
font-weight: bold;
content: attr(data-title); 
}

}
.table-responsive-layout tbody th { font-weight: normal; }
.table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td { vertical-align: middle; }

.table-responsive > .table > thead > tr > th, .table-responsive > .table > tbody > tr > th, .table-responsive > .table > tfoot > tr > th, .table-responsive > .table > thead > tr > td, .table-responsive > .table > tbody > tr > td, .table-responsive > .table > tfoot > tr > td {
    white-space: normal;
}

/**************************** Start Fundraising Pages ******************************************/

a[data-toggle="popover"] { padding-bottom: 10px; }


@media (min-width: 768px)
{
	.width-progress-status{ width: 24%; float: left; }
}

@media (min-width: 768px)
{
	#modal-preview-page .container { width: 665px; }
	#modal-preview-page .modal-dialog { width: 750px; }
}

@media (min-width: 991px)
{
	#modal-preview-page .container { width: 925px; }
	#modal-preview-page .modal-dialog { width: 1000px; }
}

.payment-date .dropdown-menu { background-color: #fff; padding: 5px 10px; min-width: 60px; top: 23px; }

/***************************** Tooltip **********************************/

.tooltip { min-width: 200px; }
.tooltip.in { opacity: 1; }
.tooltip-inner {
  color: #000;
  text-align: left;
  background-color: #fff;
  border: 1px solid #ccc;
  -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
  box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
  border-radius: 6px;
  padding: 10px;
  margin-top: 5px;
}
.tooltip.bottom .tooltip-arrow {
   border: none;
   width: 14px;
   height: 10px;
   overflow: hidden;
   top: 1px;
   margin-left: -7px;
}
.tooltip.bottom .tooltip-arrow:before {
   content: '';
   position: absolute;
   top: 0; left: 0;
   width: 100%; height: 100%;
   border: 1px solid #ccc;
   background-color: white;
   -webkit-transform-origin: 0 100%;
   -ms-transform-origin: 0 100%;
   transform-origin: 0 100%;
   -webkit-transform: rotate(45deg);
   -ms-transform: rotate(45deg);
   transform: rotate(45deg);
}
a[data-toggle="tooltip"] { padding-bottom: 5px; }


.input-group .input-group-addon ~ .has-error .form-control:first-child
{
 	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
	border-top-right-radius: 4px;
	border-bottom-right-radius: 4px;
}
.input-group .input-group-addon ~ .has-error .form-control-feedback { right: 0; }