@font-face {
    font-family: 'Circular Bold Medium';
    src: URL('../fonts/CircularStd-Regular.otf') format('truetype');
}

body {
    padding: 0px;
    margin: 0px;
}

.bi {
    vertical-align: -.125em;
    fill: currentColor;
}

.user-donation-card .dateDonation {
    position: absolute; 
    right: 20px; 
    top: 10px; 
    font-weight: 600; 
    color: #ff813f;
}

.user-donation-card .user-avatar {
    width: 48px; height: 48px; margin-right: 10px;
    border-radius: 100%;
    object-fit: cover;
}

.user-donation-card .comment {
    margin-left: 60px; 
    background-color: #fff9f5; 
    border: 2px solid #ffe6d8;
}

#ranking-donations .value-donation {
    right: 10px; position: absolute;
}

.bg-yellow {
    background: #ffdd00;
}

.bg-soft-yellow {
    background: #fffce6;
}

.bg-orange {
    background-color: #f8ae33;
}

.font-helvetica {
    font-family: Arial, Helvetica, Tahoma, Verdana;
}

.font-circular-medium {
    font-family: 'Circular Bold Medium';
}

	.controlNumberB {
			font-size:100px; font-weight:bold; cursor:pointer;
		}
		
		#value_credit {
			text-align:center;
			font-weight:bold;
		}
		
		.messagefield {
			font-style: italic;
			color:gray;
		}
		
		input[type=checkbox]
{
  /* Double-sized Checkboxes */
  -ms-transform: scale(2); /* IE */
  -moz-transform: scale(2); /* FF */
  -webkit-transform: scale(2); /* Safari and Chrome */
  -o-transform: scale(2); /* Opera */
  cursor:pointer;  
}

.labelCheck {
	padding-left:20px;
}

#checkwhatsLabel {
	cursor:pointer;
	width:84%; float:left; text-align:left; padding:0px 0px 0px 0px !important;
	margin-top:-10px;
}



@media only screen and (max-width: 600px) {
    #modalData {
        margin:0px 0px 0px 0px !Important;
    }
}
.headerContainer {
	background-color:#140525; color:white !important
}

.h1line {
	color:white !important;
}

.itemlistheader {
	padding-bottom:10px;
}
/* Estilos para mobile */
.headerText {
  text-align:left; font-size:95%; opacity:0.7; line-height:20px;
}

.prefooterAlert {
	background-color:#4B0082
}
.footerAlert {
	border-top:1px solid #eee;
	width:100%; padding:20px 10px 20px 10px; text-align:justify; font-size:60%;
	background-color:#4B0082
}

#feedbackCopy {
	background-color:green; color:white;
	padding:5px 0x 5px 0px !important;
}

#copyButton {
	color:black !IMPORTANT;
}

#titlelogo {
	width:100%; text-align:center; background-color:#4B0082; padding:10px 0px 10px 0px; margin-bottom:0px;
}
#subtitle {
	width:100%; background-color:#7000C1; font-weight:bold; color:white; text-align:center; text-transform:uppercase; padding:5px 0px 5px 0px !Important; margin-bottom:20px;
}

@media (max-width: 767px) {
	#alertDiv {
		opacity:0.5; font-style: italic;
		padding:0px 0px 0px 0px !important;
		text-align:center;
		margin:-30px 0px 25px 0px !important;
		color:gray !important;
	}
	
	.formPrice {
		font-weight:bold; font-size:200% !Important; border:none; text-align:center; color:green; pointer-events: none;
	}
	
	.priceContainer {
		padding:0px 0px 0px 0px !Important; margin-top:-20px;
	}
	
	#secbar {
		max-width:70%;
		display:block;
		margin:auto;
		opacity:0.5;
		margin-bottom:30px;
	}
}



/* Estilos para desktop */
@media (min-width: 768px) {
	#alertDiv {
		color:gray !important;
		opacity:0.5; font-style: italic;
		margin-top:-20px;
		padding-bottom:20px;
	}
	
  .headerText {
    text-align:center; font-size:95%; opacity:0.7; line-height:20px;
  }
  
  .footerAlert {
	border-top:none;
	width:500px;
	margin:0px auto;
	padding:20px 10px 20px 10px; text-align:justify; font-size:60%; opacity:0.6;
}

.priceContainer {
	text-align:center;
	margin-top:18px;
}

.formPrice {
	font-weight:bold; font-size:200% !important; border:none; text-align:center; color:green; pointer-events: none;
}

	#secbar {
		max-width:300px;
		display:block;
		margin:auto;
		opacity:0.5;
		margin-bottom:30px;
	}

}

.footerAlert .pFooterAlert {
	color:white !important;
	opacity:0.7;
}

.footerAlert a {
	text-decoration:none;
	color:white;
}