
.topnav { width: fit-content; float: right; margin-top: 0.2rem; }
.topnav a.menu_item { text-decoration: none; font-size: 1rem; color: #212121; margin-right: 1rem; font-weight: 500; }
.topnav a.menu_item:hover, .topnav a.menu_item.active { border-bottom: 4px solid #f00; padding-bottom: 0.5rem; }
.topnav a.menu_item.active { color: #f00; }

.secure { font-size: 0.9rem; }
.secure::before {  content: "";
  width: 0.9rem;
  height: 0.9rem;
  background-color: currentColor; /* herda a cor do texto */
  mask-size: contain;
  mask-repeat: no-repeat;
  mask-position: center;
  -webkit-mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3Cpath d='M256 160L256 224L384 224L384 160C384 124.7 355.3 96 320 96C284.7 96 256 124.7 256 160zM192 224L192 160C192 89.3 249.3 32 320 32C390.7 32 448 89.3 448 160L448 224C483.3 224 512 252.7 512 288L512 512C512 547.3 483.3 576 448 576L192 576C156.7 576 128 547.3 128 288L128 288C128 252.7 156.7 224 192 224z'/%3E%3C/svg%3E");
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3Cpath d='M256 160L256 224L384 224L384 160C384 124.7 355.3 96 320 96C284.7 96 256 124.7 256 160zM192 224L192 160C192 89.3 249.3 32 320 32C390.7 32 448 89.3 448 160L448 224C483.3 224 512 252.7 512 288L512 512C512 547.3 483.3 576 448 576L192 576C156.7 576 128 547.3 128 288L128 288C128 252.7 156.7 224 192 224z'/%3E%3C/svg%3E");
  margin-right: 0.5rem;
  align-self: anchor-center;
  display: inline-flex;
} 


@media (min-width: 801px) and (max-width: 1024px) {
	header { padding: 0 4vw; text-align: left; }
	.quote1 img { width: 25vw; margin-top: 2rem; }
	.quote2 img { width: 42vw; margin-top: 2rem; float: left; }	
	.topnav a.menu_item, .topnav .secure { font-size: 0.8rem; margin-right: 0.6rem; }
	.topnav.responsive a.icon { top: -1rem; }
	.topnav.responsive { margin-top: 0.6rem; }
}

@media (max-width: 1024px) {
	.comunity_quote { min-height: 42rem; }
	.quote_block1, .quote_block2 { margin-top: 8rem; }
	.nomobile { display: none; }
}
@media (min-width: 1025px) {
	.comunity_quote_img img { width: 110%; }
/*	.button_donations { width: 50%; padding: 0.8rem 2vw; } */
}

@media (min-width: 801px) and (max-width: 1280px) {
	.secure { font-size: 0.8rem; }
	.secure::before { margin-right: 0.2rem; }
	.topnav a.menu_item { font-size: 0.9rem; margin-right: 0.6rem; }
	header .button_donations { font-size: 0.9rem; }
}

@media (min-width: 1280px) {
	.quote1 img { width: 25vw; margin-top: 2rem; }
	.quote2 img { width: 42vw; margin-top: 2rem; }	
}

.thank_you_page #background::before { background-image: url("/img/danke.jpg"); background-position-y: bottom;  }
.thank_you_page footer { position: fixed; bottom: 0; }

@media (min-width: 1025px) {
	.topnav .icon {
    	display: none;
	}
}

@media screen and (max-width: 1024px) {
    .topnav a:not(:first-child) {
        display: none;
    }

    .topnav a.icon {
        float: right;
        display: block;
        color: #000;
        width: 1.5rem;
        height: 1.5rem;
        margin-top: 0.5rem
    }

    .topnav.responsive {
        position: relative;
		position: relative;
        background: #fff;
        width: fit-content;
        padding: 1rem;
        margin-top: 3rem;
        margin-right: -1rem;
    }

    .topnav.responsive a.icon {
        position: absolute;
        right: 0.2rem;
        top: -3.3rem;
	    width: 1.5rem;
        height: 1.5rem;
        margin-top: 0.5rem;
    }

    .topnav.responsive a,
    .topnav.responsive .secure {
        float: none;
        display: block;
        text-align: center;
        width: -webkit-fill-available;
        margin: 0;
        padding: 14px 16px;
    }
}
@media (min-width: 480px) and (max-width: 800px) {
	.topnav.responsive { margin-top: 2.8rem; }
}
@media (min-width: 801px) and (max-width: 1024px) {
	.topnav { margin-top: 0.3rem; margin-right: -1rem; }
	.topnav.responsive { margin-top: 3rem; margin-right: -2.2rem; }
}
