[tor-commits] [donate/master] Styling monthly giving banner and body width for smaller screen sizes.

commit f17108d432370604264e0293a66be621f30bf686 Author: Stephanie Kirtiadi <skirtiadi@giantrabbit.com> Date: Wed May 8 14:42:11 2019 -0700 Styling monthly giving banner and body width for smaller screen sizes. As per Richard's initial feedback. Issue #39739 --- public/dist/index.css | 2 +- sass/layouts/_content.scss | 2 +- sass/layouts/_header.scss | 11 +++++++---- 3 files changed, 9 insertions(+), 6 deletions(-) diff --git a/public/dist/index.css b/public/dist/index.css index fa471b69..10ba4561 100644 --- a/public/dist/index.css +++ b/public/dist/index.css @@ -1 +1 @@ -/*! normalize.css v6.0.0 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}article,aside,footer,header,nav,section{display:block}h1{font-size:2em;margin:.67em 0}figcaption,figure,main{display:block}figure{margin:1em 40px}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent;-webkit-text-decoration-skip:objects}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:inherit;font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}dfn{font-style:italic}mark{background-color:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}audio,video{display:inline-block}audio:not([controls]){display:none;height:0}img{border-style:none}svg:not(:root){overflow:hidden}button,in put,optgroup,select,textarea{margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{display:inline-block;vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-but ton{-webkit-appearance:button;font:inherit}details,menu{display:block}summary{display:list-item}canvas{display:inline-block}[hidden],template{display:none}hr{border-top:1px solid #68b030;margin:40px auto;max-width:106px}body,html,input,textarea{color:#484848;font-family:Source Sans Pro,sans-serif;font-size:16px;line-height:20px;font-weight:400}p{font-size:1.3rem;color:#212529;line-height:2rem}.preamble p{color:#777;font-family:Source Sans Pro;font-size:2em;line-height:1.3em;font-weight:300}h1{font-size:47px;letter-spacing:2px;line-height:50px;margin-bottom:1%;margin-top:0;text-transform:capitalize}@media (min-width:767px){h1{font-size:50px;line-height:60px}}@media (min-width:991px){h1{font-size:55px}}h2{font-size:25px;font-weight:700;line-height:1;margin-bottom:1%;margin-top:0}@media (min-width:767px){h2{font-size:34px}}h3{font-weight:700}h3,h4{font-size:27px;text-transform:uppercase;margin-bottom:1%;margin-top:0}h4{font-weight:400;letter-spacing:0;line-height:normal}h5{font-size:21 px;font-weight:300;line-height:28px;margin-bottom:1%;margin-top:0;letter-spacing:.09px}@media (min-width:991px){h5{font-size:22px}}a{color:#7d4698;font-weight:700;text-decoration:none}a:hover{color:#68b030}.bold,b{font-weight:700}.green{color:#68b030}.light{font-weight:200}.email{font-weight:700}.small{font-size:14px}.strong{color:#7d4698;font-weight:700}.tiny{font-size:12px}.background-grey{color:#f1f1f3;font-size:80px;font-weight:700}input[type=checkbox]{margin-top:auto;margin-bottom:auto;margin-right:4px}input[type=date],input[type=text],textarea{border:1px solid #848282;color:#484848;font-size:16px;height:27px;margin:9px;padding:8px 12px}input[type=date].required,input[type=text].required,textarea.required{border-color:#68b030}input[type=date].error,input[type=text].error,textarea.error{border-color:red}input[type=date]::placeholder,input[type=text]::placeholder,textarea::placeholder{color:#aeaeae}input[type=date]:focus,input[type=text]:focus,textarea:focus{border-color:#59316b; color:#7d4698;outline:none}textarea{box-sizing:border-box;width:60%;height:3em;display:block}select,textarea{padding:8px 12px}select{background:#fff;border:1px solid #848282;color:#484848;font-size:16px;height:45px;margin:9px}select.required{border-color:#68b030;color:#484848}select.error{border-color:red}select:focus{border-color:#59316b;color:#7d4698;outline:none}.field-row{align-items:center;box-sizing:border-box;display:flex;flex-direction:row;flex-wrap:wrap;width:100%}@media (min-width:767px){.field-row{flex-wrap:nowrap}}.required{color:#68b030}.button{background-color:#fff;border:1px solid #848282;border-radius:5px;color:#484848;display:inline-block;font-size:20px;font-weight:400;margin:7px;padding:14px 10px;text-transform:uppercase;width:90%;cursor:pointer;font-family:Source Sans Pro,sans-serif}.button.purple{background-color:#7d4698;color:#fff}.button.purple:hover{background-color:#59316b}.button.selected,.button:hover{background-color:#68b030;color:#fff}.button.selected{cur sor:default}@media (min-width:479px){.button{width:auto}}.button.no-margin-left{margin-left:0}a.button{font-size:16px;font-weight:400;padding:14px 10px;text-decoration:none}@media (min-width:767px){a.button{font-size:20px;width:auto}}.button,button{font-family:Source Sans Pro,sans-serif}body{margin:0}div{box-sizing:border-box}.header{background-color:#59316b;color:#fff;width:100%;padding:50px 50px 50px 10%}@media (min-width:767px){.header{padding-right:0;padding-bottom:0}}.header h1{margin-bottom:30px;font-size:36px;font-weight:300;line-height:40px}@media (min-width:767px){.header h1{font-size:40px;line-height:40px}}@media (min-width:991px){.header h1{font-size:60px;line-height:60px}}.header h4{text-transform:none;font-size:14px;line-height:14px;font-weight:400}@media (min-width:767px){.header h4{font-size:16px;line-height:18px}}@media (min-width:991px){.header h4{font-size:20px;line-height:25px}}.header .content-wrapper{width:100%}.header .content-wrapper .header-content{display:fl ex;align-items:flex-end}.header .content-wrapper .header-content .left-column{display:block}@media (min-width:767px){.header .content-wrapper .header-content .left-column{flex:1 1 40%;margin-bottom:60px;margin-right:45%}}.header .tor-campaign-logo{flex:1 1 58%;max-width:750px;display:none;position:relative}@media (min-width:991px){.header .tor-campaign-logo{display:block}}.header .tor-campaign-logo img{width:100%;height:auto;position:absolute;bottom:0;right:0}.header .logo{width:81px}.header .nav-bar{margin-bottom:30px}@media (min-width:767px){.header .nav-bar{margin-bottom:80px}}@media (min-width:767px){.title-header-image .header{background-image:url(tor-header-campaign-2018.ab4c974a.svg);background-position:100% 100%;background-repeat:no-repeat;background-size:40%}.title-header-image .header h4{padding-right:10%}}.title-header-image.monthly-giving .header{background-image:url(defenders-of-privacy-white.0588e631.png);background-position:50%;background-size:175px;background-repeat: no-repeat;height:225px}@media (min-width:767px){.title-header-image.monthly-giving .header{background-size:225px;height:300px}}.content{margin:0;padding:0}.content .fixed-width{margin-left:auto;margin-right:auto}@media (min-width:767px){.content .fixed-width{max-width:728px}}@media (min-width:991px){.content .fixed-width{max-width:940px}}.footer-container{display:flex;flex-direction:column;flex-wrap:wrap;justify-content:space-around;background-color:#59316b;color:#fff;padding:70px 30px 30px}.footer-container a{color:#fff}@media (min-width:767px){.footer-container{padding-top:100px}}.footer-container .footer-content{display:flex;width:100%;max-width:900px;margin:0 auto 30px;flex-wrap:wrap}@media (min-width:767px){.footer-container .footer-content{flex-wrap:nowrap}}.footer-container .footer-content-left{flex:1 1 100%;margin-bottom:70px}@media (min-width:767px){.footer-container .footer-content-left{flex:1 1 60%;margin-right:150px;margin-bottom:0}}.footer-container .footer-content-righ t{display:flex;flex:1 1 100%;align-items:center;flex-direction:column}@media (min-width:767px){.footer-container .footer-content-right{align-items:inherit;flex:1 1 auto}}.footer-container .footer-description{margin-bottom:70px;font-size:20px;line-height:24px}@media (min-width:767px){.footer-container .footer-description{margin-bottom:100px}}.footer-container .footer-subscribe{font-size:17px;line-height:20px}.footer-container .footer-subscribe .footer-subscribe-header{margin-bottom:5px;font-weight:600;text-transform:uppercase;color:hsla(0,0%,100%,.4)}.footer-container .footer-subscribe .footer-sign-up{display:inline-block;padding:15px 30px;border-radius:4px;border:1px solid #fff;font-weight:700;text-transform:uppercase;margin-top:15px}.footer-container .footer-subscribe .footer-sign-up:hover{background-color:#7d4698}.footer-container .footer-menu{display:flex;flex-direction:row;width:100%;margin-bottom:70px;justify-content:space-evenly}.footer-container .footer-menu a{display:block;f ont-weight:300;line-height:30px}.footer-container .footer-menu a:hover{color:#aeaeae}@media (min-width:767px){.footer-container .footer-menu{margin-bottom:200px;flex-direction:column}}.footer-container .footer-social{display:flex;flex-wrap:wrap;width:100%;justify-content:center}@media (min-width:767px){.footer-container .footer-social{width:155px;justify-content:inherit}}.footer-container .footer-social a{display:block;text-indent:-999em;background-size:cover;background-repeat:no-repeat;width:20px;height:20px;margin-right:30px}.footer-container .footer-social a.facebook,.footer-container .footer-social a.mastodon,.footer-container .footer-social a.twitter{margin-bottom:20px}.footer-container .footer-social a.facebook{background-image:url(facebook.9acbe573.svg)}.footer-container .footer-social a.mastodon{background-image:url(mastodon.4c126d2f.svg)}.footer-container .footer-social a.twitter{width:24px;background-image:url(twitter.1d48ba8e.svg)}@media (min-width:767px){.footer-containe r .footer-social a.twitter{margin-right:0}}.footer-container .footer-social a.instagram{background-image:url(instagram.be316699.svg)}.footer-container .footer-social a.linkedin{background-image:url(linkedin.ce947134.svg)}.footer-container .footer-social a.github{background-image:url(github.61372f20.svg)}@media (min-width:767px){.footer-container .footer-social a.github{margin-right:0}}.gr-stamp-container{display:block;text-align:center}.gr-stamp-container a:hover{color:#68b030}.container{width:100%}@media (min-width:576px){.container{max-width:540px}}@media (min-width:768px){.container{max-width:720px}}@media (min-width:992px){.container{max-width:960px}}@media (min-width:1200px){.container{max-width:1140px}}.cryptocurrency .content{display:flex;flex:0 0 100%;flex-wrap:wrap;justify-content:center}.cryptocurrency .content h4{text-align:center;width:100%}.cryptocurrency .intro-text-section{margin:0 15px}.cryptocurrency #cryptocurrency-form{margin:auto;max-width:1024px}.cryptocurrency .copy-button{background:url(copy.2d581cb8.svg) 50%/12px 12px no-repeat;border:none;height:43px;width:43px;padding:5px 5px 2px;margin:0;z-index:100}.cryptocurrency .copy-button:focus{outline:none}.cryptocurrency .donate.button{background-color:#68b030;color:#fff;height:50px;width:300px}.cryptocurrency .form-column{margin-bottom:20px;padding-left:15px;padding-right:15px}@media (min-width:767px){.cryptocurrency .form-column{width:50%}}.cryptocurrency .form-fields{display:grid;grid-column-gap:10px;grid-row-gap:10px;grid-template-columns:[first] 1fr [second] 1fr [end];margin-top:20px}@media (min-width:479px){.cryptocurrency .form-fields{grid-template-columns:[first] 1fr [second] 1fr [third] 1fr [fourth] 1fr [end]}}.cryptocurrency input{box-sizing:border-box;height:43px;margin:0;width:100%}.cryptocurrency input[type=checkbox]{width:auto}.cryptocurrency input[required]{border-color:#68b030}.cryptocurrency input[name=firstName]{grid-column:first/span 2}.cryptocurrency input[name=lastName]{g rid-column:first/end}@media (min-width:479px){.cryptocurrency input[name=lastName]{grid-column-start:third}}.cryptocurrency input[name=streetAddress]{grid-column:first/end}@media (min-width:479px){.cryptocurrency input[name=streetAddress]{grid-column:first/fourth}}.cryptocurrency input[name=extendedAddress]{grid-column-start:first}@media (min-width:479px){.cryptocurrency input[name=extendedAddress]{grid-column-start:fourth}}.cryptocurrency input[name=locality],.cryptocurrency input[name=postalCode]{grid-column:first/span 2}.cryptocurrency input[name=email]{grid-column:first/end}@media (min-width:479px){.cryptocurrency input[name=estimatedDonationDate]{grid-column:3/span 2}}.cryptocurrency input[name=currencyAmount]{grid-column:first/span 2}@media (min-width:479px){.cryptocurrency input[name=currencyAmount]{grid-column:third/span 2}}.cryptocurrency input[name=region]{grid-column:first/span 2}@media (min-width:479px){.cryptocurrency input[name=region]{grid-column:third/span 2}}.crypto currency label[for=estimatedDonationDate]{align-self:center;grid-column:first;text-align:right}@media (min-width:479px){.cryptocurrency label[for=estimatedDonationDate]{grid-column:first/span 2}}.cryptocurrency .checkbox-row{display:flex;grid-column:first/end;align-items:center}.cryptocurrency .checkbox-row input{margin-right:5px}.cryptocurrency select{box-sizing:border-box;height:43px;margin:0}.cryptocurrency select[name=country]{grid-column:first/end}.cryptocurrency select[name=region]{grid-column:first/span 2}@media (min-width:479px){.cryptocurrency select[name=region]{grid-column:third/span 2}}.cryptocurrency select[name=cryptocurrencyType]{grid-column:first/span 2}.cryptocurrency .wallet-column{padding-left:15px;padding-right:15px;width:100%}@media (min-width:767px){.cryptocurrency .wallet-column{width:50%}}.cryptocurrency .wallet-column ul{list-style-type:none;margin-top:20px;padding:0;width:100%}.cryptocurrency .wallet-column li{align-items:center;display:flex;margin-bottom:1 0px;width:100%}.cryptocurrency .wallet-column li:first-child .wallet-id{border-top:1px solid}.cryptocurrency .wallet-column .currency-name{padding:5px;width:30%}.cryptocurrency .wallet-column .wallet-id{font-family:Source Code Pro,monospace;padding:5px;width:60%}.cryptocurrency .section{display:flex;flex-wrap:wrap;justify-content:center;padding:10px}.cryptocurrency .button-section{justify-content:center;margin-bottom:20px;padding:0;width:100%}.campaign-totals-area{display:flex;flex-wrap:wrap;justify-content:center}.campaign-totals-area .characters{display:flex;justify-content:center;line-height:normal;margin:10px 30px}.campaign-totals-area .characters .character{position:relative}.campaign-totals-area .characters .character .cover{background:#68b030;bottom:0;left:0;position:absolute;visibility:hidden;right:0;top:0;z-index:1}.campaign-totals-area .characters .character.covered .cover{visibility:visible}.campaign-totals-area .characters .character.resolved{color:#68b030}.campaign-tota ls-area .label{font-size:27px;text-align:center}.donate-options{display:flex;justify-content:center;margin:30px auto 2%;width:92vw}.donate-options a{background-color:#fff;border:2px solid #aeaeae;color:#aeaeae;font-weight:400;display:block;text-align:center;text-decoration:none;text-transform:uppercase}.donate-options a.once-button{border-radius:5px 0 0 5px;margin-right:0;padding-left:15px;padding-right:15px;width:150px}.donate-options a.monthly-button{border-left:0;border-radius:0 5px 5px 0;margin-left:0;padding-left:15px;padding-right:15px;width:160px}.donate-options a.selected,.donate-options a:hover{background-color:#68b030;color:#fff}.payment-other-div{text-align:center;margin-bottom:20px}.perk-intro{display:flex;flex-wrap:wrap;margin:2% 5%;justify-content:center;text-align:center}.perk-intro .perk-title{font-size:22px;margin-bottom:0}.price-change-warning{color:red}#donationForm{margin:0 auto 40px;max-width:1024px}.donation-selection-area{display:flex;flex-direction:row;flex-w rap:wrap;margin:auto 2%;max-width:1024px;justify-content:center}@media (min-width:767px){.donation-selection-area{flex-direction:row}}.donation-selection-area .donate-buttons{align-items:center;align-self:center;display:flex;flex-direction:row;flex-wrap:wrap;justify-content:center;margin:5px}@media (min-width:767px){.donation-selection-area .donate-buttons{flex-direction:row;margin-right:5px}}.donation-selection-area .donate-buttons a.price-btn,.donation-selection-area .donate-buttons button.price-btn{line-height:20px;background-color:#59316b;border-radius:5px;border-style:none;color:#fff;display:block;font-size:23px;font-weight:400;margin:5px;padding:20px 0;text-align:center;text-decoration:none;width:120px}@media (min-width:767px){.donation-selection-area .donate-buttons a.price-btn,.donation-selection-area .donate-buttons button.price-btn{font-size:29px}}.donation-selection-area .donate-buttons a.price-btn.promo,.donation-selection-area .donate-buttons button.price-btn.promo{posi tion:relative}.donation-selection-area .donate-buttons a.price-btn.promo:before,.donation-selection-area .donate-buttons button.price-btn.promo:before{position:absolute;display:block;background-color:#68b030;color:#fff;content:"LIMITED OFFER";width:80px;height:20px;font-size:12px;top:-9px;left:13px;padding:0 8px;border-radius:16px;font-weight:300}.donation-selection-area .donate-buttons a.selected,.donation-selection-area .donate-buttons button.selected{background-color:#68b030}.donation-selection-area .donate-buttons .other-amount-field{align-items:center;display:flex;flex-direction:column;justify-content:center}.donation-selection-area .donate-buttons .other-amount-field .error{color:red;display:block;text-align:center}.donation-selection-area .donate-buttons .other-amount-field .perk-amt{background-color:#f1f1f3;font-size:23px;font-weight:700;height:42px;margin:5px;min-width:80px;text-transform:capitalize;text-align:center;width:94px}.donation-selection-area .no-perk-area{margin: 1% 1% 20px;width:100%;text-align:center}.donation-selection-area label[for=no-perk-checkbox]{font-size:20px;line-height:24px}.donation-selection-area .perks{align-self:center;display:flex;flex-direction:column;width:100%;margin-top:20px;position:relative;z-index:2;justify-content:space-evenly}@media (min-width:767px){.donation-selection-area .perks{border:none;flex-direction:row}}.donation-selection-area .perks .perk{border:1px solid #aeaeae;border-top:0 solid #aeaeae;display:flex;flex-direction:row;flex-wrap:wrap;justify-content:space-between}.donation-selection-area .perks .perk:first-child{border-top-width:1px}@media (min-width:767px){.donation-selection-area .perks .perk{border:1px solid #aeaeae;flex-direction:column;justify-content:flex-start;margin:0 5px 20px;position:relative;width:30%;top:0;flex-wrap:nowrap}}.donation-selection-area .perks .perk.disabled{border-color:#f8f9fa;color:#aeaeae;font-style:italic}.donation-selection-area .perks .perk.disabled img{opacity:.2}.donati on-selection-area .perks .perk.disabled select{color:#aeaeae;font-style:italic}.donation-selection-area .perks .perk.disabled .promo-red-dot{background-color:#aeaeae}.donation-selection-area .perks .perk.disabled .promo-price{color:#aeaeae}.donation-selection-area .perks .perk .slides{position:relative;align-self:center;display:none;height:175px;overflow:hidden;width:100%}@media (min-width:767px){.donation-selection-area .perks .perk .slides{display:block;order:2}}.donation-selection-area .perks .perk img{display:block;margin:0 auto;max-width:50%;height:auto}@media (min-width:767px){.donation-selection-area .perks .perk img{width:85%;max-width:none}}.donation-selection-area .perks .perk .promo-red-dot{position:absolute;background:red;top:45px;right:15px;color:#fff;padding:10px 20px;font-size:28px;line-height:31px;font-weight:700;border-radius:40px}.donation-selection-area .perks .perk .price-tag-group{margin:20px 0 20px 20px;font-size:21px;font-weight:600;width:40%}@media (min-width :767px){.donation-selection-area .perks .perk .price-tag-group{font-size:16px;order:1;width:100%}}.donation-selection-area .perks .perk .promo-strike-through{text-decoration:line-through}.donation-selection-area .perks .perk .promo-price{color:#59316b;font-weight:700}.donation-selection-area .perks .perk .promo-price.large{font-size:22px;font-weight:600}.donation-selection-area .perks .perk .perk-label{font-size:21px;font-weight:700;margin:20px 20px 20px 0;text-align:right;text-transform:uppercase;width:40%;box-sizing:border-box}@media (min-width:767px){.donation-selection-area .perks .perk .perk-label{margin:0;padding:20px 20px 0;font-size:27px;width:100%;order:3;text-align:center}}.donation-selection-area .perks .perk .perk-desc{font-size:16px;font-weight:300;display:none;padding:20px;width:100%;box-sizing:border-box}@media (min-width:767px){.donation-selection-area .perks .perk .perk-desc{display:block;margin:0 11px;order:4;padding-left:4px;padding-right:4px;width:auto}}.donation -selection-area .perks .perk .perk-sub-select{display:none;border-color:#aeaeae;margin:10px;width:100%}@media (min-width:767px){.donation-selection-area .perks .perk .perk-sub-select{display:block;order:5;width:92%}}.donation-selection-area .perks .selected{background-color:#68b030;transition:all .5s}.donation-selection-area .perks .selected .perk-desc,.donation-selection-area .perks .selected .perk-sub-select,.donation-selection-area .perks .selected .slides{display:block}@media (min-width:767px){.donation-selection-area .perks .selected{background-color:#fff;box-shadow:8px 8px #68b030;position:relative;top:-4px}}.donation-selection-area .totals-area{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:center;margin-bottom:4%;position:relative}.donation-selection-area .totals-area,.donation-selection-area .totals-area div,.donation-selection-area .totals-area input{position:relative;z-index:1}.donation-selection-area .totals-area .fist-bg{position:absolute;top:0;right:0;z -index:0;height:auto}@media (min-width:767px){.donation-selection-area .totals-area{order:4;width:100%}}.donation-selection-area .totals-area .matching-message{color:#59316b;font-size:35px;line-height:normal;padding-top:10px;text-align:center;width:100%}.donation-selection-area .totals-area .matched-amount{color:#59316b;font-size:100px;font-weight:700;line-height:normal;text-align:center;width:100%}.info-area,.payment-method-area{position:relative;z-index:2}.payment-method-area{border-bottom:2px solid #aeaeae;border-top:2px solid #aeaeae;display:flex;flex-direction:column;justify-content:center;margin-top:20px;padding:4% 21px;text-align:center}.payment-method-area .button{width:160px;vertical-align:top;line-height:20px}.payment-method-area .button.paypal{padding-top:8px;padding-bottom:5px}.payment-method-area .paypal-png{height:32px}.payment-method-area .payment-method-question{margin-bottom:3%}.payment-method-area .payment-option{margin-bottom:2%}.info-area{padding-top:4%;margin-le ft:auto;margin-right:auto;max-width:600px;text-align:center}.info-area #firstName{width:100%}@media (min-width:767px){.info-area #firstName{width:50%}}.info-area #lastName{width:100%}@media (min-width:767px){.info-area #lastName{width:50%}}.info-area #streetAddress{width:100%}@media (min-width:767px){.info-area #streetAddress{width:80%}}.info-area #extendedAddress{width:20%}.info-area #country{width:100%}.info-area #locality{width:38%}@media (min-width:767px){.info-area #locality{width:33%}}.info-area #region{width:45%}@media (min-width:767px){.info-area #region{width:34%}}.info-area #postalCode{width:100%}@media (min-width:767px){.info-area #postalCode{width:33%}}.info-area #email{width:100%}@media (min-width:767px){.info-area #email{width:56%}}.info-area .receipt{display:none}@media (min-width:767px){.info-area .receipt{display:block}}.info-area #mailingListOptIn{margin:10px 4px 10px 10px}.info-area #cardNumber{width:100%}@media (min-width:767px){.info-area #cardNumber{width:56%}} .info-area img.credit-cards{display:none}@media (min-width:767px){.info-area img.credit-cards{display:block;height:29px;vertical-align:middle}}.info-area #expMonth{width:38%}@media (min-width:767px){.info-area #expMonth{width:33%}}.info-area #expYear{width:38.5%}@media (min-width:767px){.info-area #expYear{width:33%}}.info-area #cvc{width:38%}@media (min-width:767px){.info-area #cvc{width:33%}}.info-area #perk-fields{display:block;margin:10px;text-align:left}.info-area #perk-fields #selected-perk-fields-label{margin-top:10px}.info-area #perk-fields #perk-fit{margin-left:0}.info-area .donate-submit-area{color:#848282;font-size:22px;font-weight:700;padding:20px 0;line-height:26px}.info-area .donate.button{background-color:#68b030;color:#fff;text-transform:uppercase;width:300px}#donate-comments-wrapper{text-align:left}#donate-comments-wrapper textarea{width:95%}@media (min-width:767px){#donate-comments-wrapper textarea{width:97%}}.no-close .ui-dialog-titlebar-close{display:none}#loadin g-dialog .overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#484848;z-index:99}#loading-dialog .dialog-area{display:flex;justify-content:center;position:fixed;top:20vh;width:100%;z-index:100}#loading-dialog .dialog{background-color:#fff;min-height:150px;text-align:center;width:300px}#loading-dialog .message{margin:20px}#loading-dialog .dots{display:flex;margin:20px 20px 0;justify-content:center}#loading-dialog .dot{display:block;width:15px;height:15px;margin-right:.5%;margin-left:.5%;border-radius:20px;background-color:#8cd621;opacity:.3}#loading-dialog .dot:nth-child(0n+1){animation-name:moving-dot;animation-duration:2.5s;animation-iteration-count:infinite;animation-delay:0}#loading-dialog .dot:nth-child(0n+2){animation-name:moving-dot;animation-duration:2.5s;animation-iteration-count:infinite;animation-delay:.5s}#loading-dialog .dot:nth-child(0n+3){animation-name:moving-dot;animation-duration:2.5s;animation-iteration-count:infinite;animation-delay:1s}#loading-d ialog .dot:nth-child(0n+4){animation-name:moving-dot;animation-duration:2.5s;animation-iteration-count:infinite;animation-delay:1.5s}#loading-dialog .dot:nth-child(0n+5){animation-name:moving-dot;animation-duration:2.5s;animation-iteration-count:infinite;animation-delay:2s}@keyframes moving-dot{0%{opacity:.3}20%{opacity:1}to{opacity:.3}}.donor-faq{margin:40px auto;width:90%}@media (min-width:991px){.donor-faq{width:80%}}.donor-faq .questions{list-style-position:inside;padding-left:0}.donor-faq .questions li{color:#59316b;font-size:20px;font-weight:700;line-height:29px}@media (min-width:991px){.donor-faq .questions li{font-size:25px;line-height:34px}}.donor-faq .questions .question{color:#59316b;display:inline;font-size:20px;margin-bottom:10px;margin-top:10px}@media (min-width:991px){.donor-faq .questions .question{font-size:25px}}.donor-faq .questions .answer{color:#484848;font-family:Source Sans Pro,sans-serif;font-size:16px;line-height:20px;font-weight:400}.donor-faq .button-line{ width:100%}.button-line{text-align:center}.error-container{display:block;width:50%;min-height:100px;margin-right:auto;margin-bottom:5%;margin-left:auto;padding:2% 5%;border:1px solid #aeaeae;box-shadow:11px 11px 0 0 #e70000}.error-container .title{margin-bottom:3%;color:#e70000;font-size:34px;line-height:40px;text-align:center}#company-profile-container,#hepdata-no-results-message,.donate-match-container{text-align:center;margin-bottom:60px}.donate-match-container .input-and-loader,.donate-match-container datalist,.donate-match-container input{width:300px}.donate-match-container .input-and-loader{margin:auto;position:relative}.donate-match-container .input-and-loader input{height:30px;padding:3px;border-style:solid;text-align:center;font-weight:600}.donate-match-container .input-and-loader .load-container{display:none;height:30px;width:30px;overflow:hidden;position:absolute;top:4px;right:-6px}.donate-match-container .input-and-loader .load-container .loader,.donate-match-container . input-and-loader .load-container .loader:after,.donate-match-container .input-and-loader .load-container .loader:before{background:#59316b;animation:load1 1s ease-in-out infinite;width:1em;height:4em}.donate-match-container .input-and-loader .load-container .loader{color:#59316b;text-indent:-9999em;margin:10px auto;position:relative;font-size:4px;transform:translateZ(0);animation-delay:-.16s}.donate-match-container .input-and-loader .load-container .loader:after,.donate-match-container .input-and-loader .load-container .loader:before{position:absolute;top:0;content:""}.donate-match-container .input-and-loader .load-container .loader:before{left:-1.5em;animation-delay:-.32s}.donate-match-container .input-and-loader .load-container .loader:after{left:1.5em}@-webkit-keyframes load1{0%,80%,to{box-shadow:0 0;height:4em}40%{box-shadow:0 -2em;height:5em}}@keyframes load1{0%,80%,to{box-shadow:0 0;height:4em}40%{box-shadow:0 -2em;height:5em}}.donate-match-container #company-option-list{width :300px;margin:0 auto;max-height:300px;overflow-x:hidden;overflow-y:auto;background-color:#f8f9fa;border:1px solid #7d4698;display:none}.donate-match-container #company-option-list .company-option{word-wrap:break-word;padding:5px 2px}.donate-match-container #company-option-list .company-option:hover{background-color:#68b030;color:#fff}.donate-error-message{color:#aeaeae;padding:0 10%;word-break:break-all;text-align:center}#company-profile-container .profile{display:none;width:75%;margin:auto}#company-profile-container .profile .row{margin:20px 0}#company-profile-container .profile .row .company-property-label{width:30%;text-align:right;font-weight:700}#company-profile-container .profile .row .company-property-value{text-align:left;width:60%}#company-profile-container .profile .row .company-property-value#summary-value{width:auto;font-size:25px;line-height:34px;text-align:center}#company-profile-container .profile .row .company-property-value#summary-value .company{font-weight:700;col or:#7d4698}#company-profile-container .profile .row .company-property-value#summary-value .percent{font-weight:700;color:#68b030}#company-profile-container .profile .row .company-property-value#summary-value .match-amount{font-weight:700;color:#59316b}#company-profile-container .profile .row .company-property-value#matchingGiftForm-value{width:auto}#company-profile-container .profile .row .company-property-value#lastUpdated-value{font-weight:700;color:#aeaeae}#company-profile-container .profile .row .company-property-value#matchingConditions-value .ratio{font-weight:700;color:#59316b}#company-profile-container .profile .row .company-property-value#resources-value{width:auto}#company-profile-container ul{margin-top:0}#company-profile-container li{margin-bottom:10px}.notify-popup{background:#7d4698;border-radius:5px;box-shadow:0 0 2px rgba(0,0,0,.5);color:#fff;padding:3px 5px 5px;margin:10px;opacity:0;transition-property:opacity;transition-duration:3s}.notify-popup.start{opacity:1;tra nsition-duration:1ms}.notify-popup .arrow{height:10px;width:10px}.notify-popup .arrow:before{border-style:solid;content:"";display:block;height:0;margin:auto;width:0}.notify-popup[data-placement=top] .arrow{bottom:0;margin-bottom:-10px;position:absolute}.notify-popup[data-placement=top] .arrow:before{border-width:5px 5px 0;border-color:#7d4698 transparent transparent}.notify-popup[data-placement=bottom] .arrow{top:-5px;position:absolute}.notify-popup[data-placement=bottom] .arrow:before{border-width:0 5px 5px;border-color:transparent transparent #7d4698}@keyframes fadeout{0%{opacity:1}to{opacity:0}}.privacy-policy{margin-left:auto;margin-right:auto;width:70%;margin-bottom:40px}.stripe-elements .field{box-sizing:border-box;padding:12px;border:1px solid #68b030;margin:9px}.stripe-elements .field.card-number,.stripe-elements .field.cvc,.stripe-elements .field.exp-date{width:100%}@media (min-width:767px){.stripe-elements .field.cvc,.stripe-elements .field.exp-date{width:50%}}.stripe-ele ments .field.error{border:1px solid red}.subscribe .fixed-width{max-width:600px;text-align:center}.subscribe .fixed-width #email,.subscribe .fixed-width #firstName{width:100%}@media (min-width:767px){.subscribe .fixed-width #firstName{width:50%}}.subscribe .fixed-width #lastName{width:100%}@media (min-width:767px){.subscribe .fixed-width #lastName{width:50%}}.subscribe .fixed-width .join{width:200px}.subscribe .fixed-width .messages{color:red;text-align:left}.header-content .thank-you{width:80%}.header-content .thank-you h1{text-align:center;text-transform:none}.header-content .thank-you h5{text-align:center}.header-content .thank-you img{width:50px}.header-content .thank-you p{color:#fff}.header-content .thank-you .share-icons{margin:20px 10px 0;text-align:center}@media (min-width:767px){.header-content .thank-you{margin-top:-120px;margin-bottom:30px}}.content{margin-top:20px}.content .thank-you{margin-bottom:40px}.content .thank-you h4{text-align:center}.content .thank-you .volunt eer-desc{margin-left:auto;margin-right:auto;max-width:490px;text-align:center}.content .thank-you .volunteer-desc .skills-text{margin-bottom:20px} \ No newline at end of file +/*! normalize.css v6.0.0 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}article,aside,footer,header,nav,section{display:block}h1{font-size:2em;margin:.67em 0}figcaption,figure,main{display:block}figure{margin:1em 40px}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent;-webkit-text-decoration-skip:objects}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:inherit;font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}dfn{font-style:italic}mark{background-color:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}audio,video{display:inline-block}audio:not([controls]){display:none;height:0}img{border-style:none}svg:not(:root){overflow:hidden}button,in put,optgroup,select,textarea{margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{display:inline-block;vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-but ton{-webkit-appearance:button;font:inherit}details,menu{display:block}summary{display:list-item}canvas{display:inline-block}[hidden],template{display:none}hr{border-top:1px solid #68b030;margin:40px auto;max-width:106px}body,html,input,textarea{color:#484848;font-family:Source Sans Pro,sans-serif;font-size:16px;line-height:20px;font-weight:400}p{font-size:1.3rem;color:#212529;line-height:2rem}.preamble p{color:#777;font-family:Source Sans Pro;font-size:2em;line-height:1.3em;font-weight:300}h1{font-size:47px;letter-spacing:2px;line-height:50px;margin-bottom:1%;margin-top:0;text-transform:capitalize}@media (min-width:767px){h1{font-size:50px;line-height:60px}}@media (min-width:991px){h1{font-size:55px}}h2{font-size:25px;font-weight:700;line-height:1;margin-bottom:1%;margin-top:0}@media (min-width:767px){h2{font-size:34px}}h3{font-weight:700}h3,h4{font-size:27px;text-transform:uppercase;margin-bottom:1%;margin-top:0}h4{font-weight:400;letter-spacing:0;line-height:normal}h5{font-size:21 px;font-weight:300;line-height:28px;margin-bottom:1%;margin-top:0;letter-spacing:.09px}@media (min-width:991px){h5{font-size:22px}}a{color:#7d4698;font-weight:700;text-decoration:none}a:hover{color:#68b030}.bold,b{font-weight:700}.green{color:#68b030}.light{font-weight:200}.email{font-weight:700}.small{font-size:14px}.strong{color:#7d4698;font-weight:700}.tiny{font-size:12px}.background-grey{color:#f1f1f3;font-size:80px;font-weight:700}input[type=checkbox]{margin-top:auto;margin-bottom:auto;margin-right:4px}input[type=date],input[type=text],textarea{border:1px solid #848282;color:#484848;font-size:16px;height:27px;margin:9px;padding:8px 12px}input[type=date].required,input[type=text].required,textarea.required{border-color:#68b030}input[type=date].error,input[type=text].error,textarea.error{border-color:red}input[type=date]::placeholder,input[type=text]::placeholder,textarea::placeholder{color:#aeaeae}input[type=date]:focus,input[type=text]:focus,textarea:focus{border-color:#59316b; color:#7d4698;outline:none}textarea{box-sizing:border-box;width:60%;height:3em;display:block}select,textarea{padding:8px 12px}select{background:#fff;border:1px solid #848282;color:#484848;font-size:16px;height:45px;margin:9px}select.required{border-color:#68b030;color:#484848}select.error{border-color:red}select:focus{border-color:#59316b;color:#7d4698;outline:none}.field-row{align-items:center;box-sizing:border-box;display:flex;flex-direction:row;flex-wrap:wrap;width:100%}@media (min-width:767px){.field-row{flex-wrap:nowrap}}.required{color:#68b030}.button{background-color:#fff;border:1px solid #848282;border-radius:5px;color:#484848;display:inline-block;font-size:20px;font-weight:400;margin:7px;padding:14px 10px;text-transform:uppercase;width:90%;cursor:pointer;font-family:Source Sans Pro,sans-serif}.button.purple{background-color:#7d4698;color:#fff}.button.purple:hover{background-color:#59316b}.button.selected,.button:hover{background-color:#68b030;color:#fff}.button.selected{cur sor:default}@media (min-width:479px){.button{width:auto}}.button.no-margin-left{margin-left:0}a.button{font-size:16px;font-weight:400;padding:14px 10px;text-decoration:none}@media (min-width:767px){a.button{font-size:20px;width:auto}}.button,button{font-family:Source Sans Pro,sans-serif}body{margin:0}div{box-sizing:border-box}.header{background-color:#59316b;color:#fff;width:100%;padding:50px 50px 50px 10%}@media (min-width:767px){.header{padding-right:0;padding-bottom:0}}.header h1{margin-bottom:30px;font-size:36px;font-weight:300;line-height:40px}@media (min-width:767px){.header h1{font-size:40px;line-height:40px}}@media (min-width:991px){.header h1{font-size:60px;line-height:60px}}.header h4{text-transform:none;font-size:14px;line-height:14px;font-weight:400}@media (min-width:767px){.header h4{font-size:16px;line-height:18px}}@media (min-width:991px){.header h4{font-size:20px;line-height:25px}}.header .content-wrapper{width:100%}.header .content-wrapper .header-content{display:fl ex;align-items:flex-end}.header .content-wrapper .header-content .left-column{display:block}@media (min-width:767px){.header .content-wrapper .header-content .left-column{flex:1 1 40%;margin-bottom:60px;margin-right:45%}}.header .tor-campaign-logo{flex:1 1 58%;max-width:750px;display:none;position:relative}@media (min-width:991px){.header .tor-campaign-logo{display:block}}.header .tor-campaign-logo img{width:100%;height:auto;position:absolute;bottom:0;right:0}.header .logo{width:81px}.header .nav-bar{margin-bottom:30px}@media (min-width:767px){.header .nav-bar{margin-bottom:80px}}@media (min-width:767px){.title-header-image .header{background-image:url(tor-header-campaign-2018.ab4c974a.svg);background-position:100% 100%;background-repeat:no-repeat;background-size:40%}.title-header-image .header h4{padding-right:10%}}.title-header-image.monthly-giving .header{background-image:url(defenders-of-privacy-white.0588e631.png);background-position:center 120px;background-size:150px;backgroun d-repeat:no-repeat;height:300px}@media (min-width:479px){.title-header-image.monthly-giving .header{background-position:50%;background-size:200px}}@media (min-width:767px){.title-header-image.monthly-giving .header{background-size:225px}}.content{margin:0;padding:0}.content .fixed-width{margin-left:auto;margin-right:auto;padding:0 10px}@media (min-width:767px){.content .fixed-width{max-width:728px}}@media (min-width:991px){.content .fixed-width{max-width:940px}}.footer-container{display:flex;flex-direction:column;flex-wrap:wrap;justify-content:space-around;background-color:#59316b;color:#fff;padding:70px 30px 30px}.footer-container a{color:#fff}@media (min-width:767px){.footer-container{padding-top:100px}}.footer-container .footer-content{display:flex;width:100%;max-width:900px;margin:0 auto 30px;flex-wrap:wrap}@media (min-width:767px){.footer-container .footer-content{flex-wrap:nowrap}}.footer-container .footer-content-left{flex:1 1 100%;margin-bottom:70px}@media (min-width:767px){ .footer-container .footer-content-left{flex:1 1 60%;margin-right:150px;margin-bottom:0}}.footer-container .footer-content-right{display:flex;flex:1 1 100%;align-items:center;flex-direction:column}@media (min-width:767px){.footer-container .footer-content-right{align-items:inherit;flex:1 1 auto}}.footer-container .footer-description{margin-bottom:70px;font-size:20px;line-height:24px}@media (min-width:767px){.footer-container .footer-description{margin-bottom:100px}}.footer-container .footer-subscribe{font-size:17px;line-height:20px}.footer-container .footer-subscribe .footer-subscribe-header{margin-bottom:5px;font-weight:600;text-transform:uppercase;color:hsla(0,0%,100%,.4)}.footer-container .footer-subscribe .footer-sign-up{display:inline-block;padding:15px 30px;border-radius:4px;border:1px solid #fff;font-weight:700;text-transform:uppercase;margin-top:15px}.footer-container .footer-subscribe .footer-sign-up:hover{background-color:#7d4698}.footer-container .footer-menu{display:flex; flex-direction:row;width:100%;margin-bottom:70px;justify-content:space-evenly}.footer-container .footer-menu a{display:block;font-weight:300;line-height:30px}.footer-container .footer-menu a:hover{color:#aeaeae}@media (min-width:767px){.footer-container .footer-menu{margin-bottom:200px;flex-direction:column}}.footer-container .footer-social{display:flex;flex-wrap:wrap;width:100%;justify-content:center}@media (min-width:767px){.footer-container .footer-social{width:155px;justify-content:inherit}}.footer-container .footer-social a{display:block;text-indent:-999em;background-size:cover;background-repeat:no-repeat;width:20px;height:20px;margin-right:30px}.footer-container .footer-social a.facebook,.footer-container .footer-social a.mastodon,.footer-container .footer-social a.twitter{margin-bottom:20px}.footer-container .footer-social a.facebook{background-image:url(facebook.9acbe573.svg)}.footer-container .footer-social a.mastodon{background-image:url(mastodon.4c126d2f.svg)}.footer-cont ainer .footer-social a.twitter{width:24px;background-image:url(twitter.1d48ba8e.svg)}@media (min-width:767px){.footer-container .footer-social a.twitter{margin-right:0}}.footer-container .footer-social a.instagram{background-image:url(instagram.be316699.svg)}.footer-container .footer-social a.linkedin{background-image:url(linkedin.ce947134.svg)}.footer-container .footer-social a.github{background-image:url(github.61372f20.svg)}@media (min-width:767px){.footer-container .footer-social a.github{margin-right:0}}.gr-stamp-container{display:block;text-align:center}.gr-stamp-container a:hover{color:#68b030}.container{width:100%}@media (min-width:576px){.container{max-width:540px}}@media (min-width:768px){.container{max-width:720px}}@media (min-width:992px){.container{max-width:960px}}@media (min-width:1200px){.container{max-width:1140px}}.cryptocurrency .content{display:flex;flex:0 0 100%;flex-wrap:wrap;justify-content:center}.cryptocurrency .content h4{text-align:center;width:100%}.crypt ocurrency .intro-text-section{margin:0 15px}.cryptocurrency #cryptocurrency-form{margin:auto;max-width:1024px}.cryptocurrency .copy-button{background:url(copy.2d581cb8.svg) 50%/12px 12px no-repeat;border:none;height:43px;width:43px;padding:5px 5px 2px;margin:0;z-index:100}.cryptocurrency .copy-button:focus{outline:none}.cryptocurrency .donate.button{background-color:#68b030;color:#fff;height:50px;width:300px}.cryptocurrency .form-column{margin-bottom:20px;padding-left:15px;padding-right:15px}@media (min-width:767px){.cryptocurrency .form-column{width:50%}}.cryptocurrency .form-fields{display:grid;grid-column-gap:10px;grid-row-gap:10px;grid-template-columns:[first] 1fr [second] 1fr [end];margin-top:20px}@media (min-width:479px){.cryptocurrency .form-fields{grid-template-columns:[first] 1fr [second] 1fr [third] 1fr [fourth] 1fr [end]}}.cryptocurrency input{box-sizing:border-box;height:43px;margin:0;width:100%}.cryptocurrency input[type=checkbox]{width:auto}.cryptocurrency input[requir ed]{border-color:#68b030}.cryptocurrency input[name=firstName]{grid-column:first/span 2}.cryptocurrency input[name=lastName]{grid-column:first/end}@media (min-width:479px){.cryptocurrency input[name=lastName]{grid-column-start:third}}.cryptocurrency input[name=streetAddress]{grid-column:first/end}@media (min-width:479px){.cryptocurrency input[name=streetAddress]{grid-column:first/fourth}}.cryptocurrency input[name=extendedAddress]{grid-column-start:first}@media (min-width:479px){.cryptocurrency input[name=extendedAddress]{grid-column-start:fourth}}.cryptocurrency input[name=locality],.cryptocurrency input[name=postalCode]{grid-column:first/span 2}.cryptocurrency input[name=email]{grid-column:first/end}@media (min-width:479px){.cryptocurrency input[name=estimatedDonationDate]{grid-column:3/span 2}}.cryptocurrency input[name=currencyAmount]{grid-column:first/span 2}@media (min-width:479px){.cryptocurrency input[name=currencyAmount]{grid-column:third/span 2}}.cryptocurrency input[name= region]{grid-column:first/span 2}@media (min-width:479px){.cryptocurrency input[name=region]{grid-column:third/span 2}}.cryptocurrency label[for=estimatedDonationDate]{align-self:center;grid-column:first;text-align:right}@media (min-width:479px){.cryptocurrency label[for=estimatedDonationDate]{grid-column:first/span 2}}.cryptocurrency .checkbox-row{display:flex;grid-column:first/end;align-items:center}.cryptocurrency .checkbox-row input{margin-right:5px}.cryptocurrency select{box-sizing:border-box;height:43px;margin:0}.cryptocurrency select[name=country]{grid-column:first/end}.cryptocurrency select[name=region]{grid-column:first/span 2}@media (min-width:479px){.cryptocurrency select[name=region]{grid-column:third/span 2}}.cryptocurrency select[name=cryptocurrencyType]{grid-column:first/span 2}.cryptocurrency .wallet-column{padding-left:15px;padding-right:15px;width:100%}@media (min-width:767px){.cryptocurrency .wallet-column{width:50%}}.cryptocurrency .wallet-column ul{list-style-ty pe:none;margin-top:20px;padding:0;width:100%}.cryptocurrency .wallet-column li{align-items:center;display:flex;margin-bottom:10px;width:100%}.cryptocurrency .wallet-column li:first-child .wallet-id{border-top:1px solid}.cryptocurrency .wallet-column .currency-name{padding:5px;width:30%}.cryptocurrency .wallet-column .wallet-id{font-family:Source Code Pro,monospace;padding:5px;width:60%}.cryptocurrency .section{display:flex;flex-wrap:wrap;justify-content:center;padding:10px}.cryptocurrency .button-section{justify-content:center;margin-bottom:20px;padding:0;width:100%}.campaign-totals-area{display:flex;flex-wrap:wrap;justify-content:center}.campaign-totals-area .characters{display:flex;justify-content:center;line-height:normal;margin:10px 30px}.campaign-totals-area .characters .character{position:relative}.campaign-totals-area .characters .character .cover{background:#68b030;bottom:0;left:0;position:absolute;visibility:hidden;right:0;top:0;z-index:1}.campaign-totals-area .characters . character.covered .cover{visibility:visible}.campaign-totals-area .characters .character.resolved{color:#68b030}.campaign-totals-area .label{font-size:27px;text-align:center}.donate-options{display:flex;justify-content:center;margin:30px auto 2%;width:92vw}.donate-options a{background-color:#fff;border:2px solid #aeaeae;color:#aeaeae;font-weight:400;display:block;text-align:center;text-decoration:none;text-transform:uppercase}.donate-options a.once-button{border-radius:5px 0 0 5px;margin-right:0;padding-left:15px;padding-right:15px;width:150px}.donate-options a.monthly-button{border-left:0;border-radius:0 5px 5px 0;margin-left:0;padding-left:15px;padding-right:15px;width:160px}.donate-options a.selected,.donate-options a:hover{background-color:#68b030;color:#fff}.payment-other-div{text-align:center;margin-bottom:20px}.perk-intro{display:flex;flex-wrap:wrap;margin:2% 5%;justify-content:center;text-align:center}.perk-intro .perk-title{font-size:22px;margin-bottom:0}.price-change-warni ng{color:red}#donationForm{margin:0 auto 40px;max-width:1024px}.donation-selection-area{display:flex;flex-direction:row;flex-wrap:wrap;margin:auto 2%;max-width:1024px;justify-content:center}@media (min-width:767px){.donation-selection-area{flex-direction:row}}.donation-selection-area .donate-buttons{align-items:center;align-self:center;display:flex;flex-direction:row;flex-wrap:wrap;justify-content:center;margin:5px}@media (min-width:767px){.donation-selection-area .donate-buttons{flex-direction:row;margin-right:5px}}.donation-selection-area .donate-buttons a.price-btn,.donation-selection-area .donate-buttons button.price-btn{line-height:20px;background-color:#59316b;border-radius:5px;border-style:none;color:#fff;display:block;font-size:23px;font-weight:400;margin:5px;padding:20px 0;text-align:center;text-decoration:none;width:120px}@media (min-width:767px){.donation-selection-area .donate-buttons a.price-btn,.donation-selection-area .donate-buttons button.price-btn{font-size:29px}}. donation-selection-area .donate-buttons a.price-btn.promo,.donation-selection-area .donate-buttons button.price-btn.promo{position:relative}.donation-selection-area .donate-buttons a.price-btn.promo:before,.donation-selection-area .donate-buttons button.price-btn.promo:before{position:absolute;display:block;background-color:#68b030;color:#fff;content:"LIMITED OFFER";width:80px;height:20px;font-size:12px;top:-9px;left:13px;padding:0 8px;border-radius:16px;font-weight:300}.donation-selection-area .donate-buttons a.selected,.donation-selection-area .donate-buttons button.selected{background-color:#68b030}.donation-selection-area .donate-buttons .other-amount-field{align-items:center;display:flex;flex-direction:column;justify-content:center}.donation-selection-area .donate-buttons .other-amount-field .error{color:red;display:block;text-align:center}.donation-selection-area .donate-buttons .other-amount-field .perk-amt{background-color:#f1f1f3;font-size:23px;font-weight:700;height:42px;m argin:5px;min-width:80px;text-transform:capitalize;text-align:center;width:94px}.donation-selection-area .no-perk-area{margin:1% 1% 20px;width:100%;text-align:center}.donation-selection-area label[for=no-perk-checkbox]{font-size:20px;line-height:24px}.donation-selection-area .perks{align-self:center;display:flex;flex-direction:column;width:100%;margin-top:20px;position:relative;z-index:2;justify-content:space-evenly}@media (min-width:767px){.donation-selection-area .perks{border:none;flex-direction:row}}.donation-selection-area .perks .perk{border:1px solid #aeaeae;border-top:0 solid #aeaeae;display:flex;flex-direction:row;flex-wrap:wrap;justify-content:space-between}.donation-selection-area .perks .perk:first-child{border-top-width:1px}@media (min-width:767px){.donation-selection-area .perks .perk{border:1px solid #aeaeae;flex-direction:column;justify-content:flex-start;margin:0 5px 20px;position:relative;width:30%;top:0;flex-wrap:nowrap}}.donation-selection-area .perks .perk.disab led{border-color:#f8f9fa;color:#aeaeae;font-style:italic}.donation-selection-area .perks .perk.disabled img{opacity:.2}.donation-selection-area .perks .perk.disabled select{color:#aeaeae;font-style:italic}.donation-selection-area .perks .perk.disabled .promo-red-dot{background-color:#aeaeae}.donation-selection-area .perks .perk.disabled .promo-price{color:#aeaeae}.donation-selection-area .perks .perk .slides{position:relative;align-self:center;display:none;height:175px;overflow:hidden;width:100%}@media (min-width:767px){.donation-selection-area .perks .perk .slides{display:block;order:2}}.donation-selection-area .perks .perk img{display:block;margin:0 auto;max-width:50%;height:auto}@media (min-width:767px){.donation-selection-area .perks .perk img{width:85%;max-width:none}}.donation-selection-area .perks .perk .promo-red-dot{position:absolute;background:red;top:45px;right:15px;color:#fff;padding:10px 20px;font-size:28px;line-height:31px;font-weight:700;border-radius:40px}.donation-s election-area .perks .perk .price-tag-group{margin:20px 0 20px 20px;font-size:21px;font-weight:600;width:40%}@media (min-width:767px){.donation-selection-area .perks .perk .price-tag-group{font-size:16px;order:1;width:100%}}.donation-selection-area .perks .perk .promo-strike-through{text-decoration:line-through}.donation-selection-area .perks .perk .promo-price{color:#59316b;font-weight:700}.donation-selection-area .perks .perk .promo-price.large{font-size:22px;font-weight:600}.donation-selection-area .perks .perk .perk-label{font-size:21px;font-weight:700;margin:20px 20px 20px 0;text-align:right;text-transform:uppercase;width:40%;box-sizing:border-box}@media (min-width:767px){.donation-selection-area .perks .perk .perk-label{margin:0;padding:20px 20px 0;font-size:27px;width:100%;order:3;text-align:center}}.donation-selection-area .perks .perk .perk-desc{font-size:16px;font-weight:300;display:none;padding:20px;width:100%;box-sizing:border-box}@media (min-width:767px){.donation-selec tion-area .perks .perk .perk-desc{display:block;margin:0 11px;order:4;padding-left:4px;padding-right:4px;width:auto}}.donation-selection-area .perks .perk .perk-sub-select{display:none;border-color:#aeaeae;margin:10px;width:100%}@media (min-width:767px){.donation-selection-area .perks .perk .perk-sub-select{display:block;order:5;width:92%}}.donation-selection-area .perks .selected{background-color:#68b030;transition:all .5s}.donation-selection-area .perks .selected .perk-desc,.donation-selection-area .perks .selected .perk-sub-select,.donation-selection-area .perks .selected .slides{display:block}@media (min-width:767px){.donation-selection-area .perks .selected{background-color:#fff;box-shadow:8px 8px #68b030;position:relative;top:-4px}}.donation-selection-area .totals-area{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:center;margin-bottom:4%;position:relative}.donation-selection-area .totals-area,.donation-selection-area .totals-area div,.donation-selection-area . totals-area input{position:relative;z-index:1}.donation-selection-area .totals-area .fist-bg{position:absolute;top:0;right:0;z-index:0;height:auto}@media (min-width:767px){.donation-selection-area .totals-area{order:4;width:100%}}.donation-selection-area .totals-area .matching-message{color:#59316b;font-size:35px;line-height:normal;padding-top:10px;text-align:center;width:100%}.donation-selection-area .totals-area .matched-amount{color:#59316b;font-size:100px;font-weight:700;line-height:normal;text-align:center;width:100%}.info-area,.payment-method-area{position:relative;z-index:2}.payment-method-area{border-bottom:2px solid #aeaeae;border-top:2px solid #aeaeae;display:flex;flex-direction:column;justify-content:center;margin-top:20px;padding:4% 21px;text-align:center}.payment-method-area .button{width:160px;vertical-align:top;line-height:20px}.payment-method-area .button.paypal{padding-top:8px;padding-bottom:5px}.payment-method-area .paypal-png{height:32px}.payment-method-area .paym ent-method-question{margin-bottom:3%}.payment-method-area .payment-option{margin-bottom:2%}.info-area{padding-top:4%;margin-left:auto;margin-right:auto;max-width:600px;text-align:center}.info-area #firstName{width:100%}@media (min-width:767px){.info-area #firstName{width:50%}}.info-area #lastName{width:100%}@media (min-width:767px){.info-area #lastName{width:50%}}.info-area #streetAddress{width:100%}@media (min-width:767px){.info-area #streetAddress{width:80%}}.info-area #extendedAddress{width:20%}.info-area #country{width:100%}.info-area #locality{width:38%}@media (min-width:767px){.info-area #locality{width:33%}}.info-area #region{width:45%}@media (min-width:767px){.info-area #region{width:34%}}.info-area #postalCode{width:100%}@media (min-width:767px){.info-area #postalCode{width:33%}}.info-area #email{width:100%}@media (min-width:767px){.info-area #email{width:56%}}.info-area .receipt{display:none}@media (min-width:767px){.info-area .receipt{display:block}}.info-area #mailingLis tOptIn{margin:10px 4px 10px 10px}.info-area #cardNumber{width:100%}@media (min-width:767px){.info-area #cardNumber{width:56%}}.info-area img.credit-cards{display:none}@media (min-width:767px){.info-area img.credit-cards{display:block;height:29px;vertical-align:middle}}.info-area #expMonth{width:38%}@media (min-width:767px){.info-area #expMonth{width:33%}}.info-area #expYear{width:38.5%}@media (min-width:767px){.info-area #expYear{width:33%}}.info-area #cvc{width:38%}@media (min-width:767px){.info-area #cvc{width:33%}}.info-area #perk-fields{display:block;margin:10px;text-align:left}.info-area #perk-fields #selected-perk-fields-label{margin-top:10px}.info-area #perk-fields #perk-fit{margin-left:0}.info-area .donate-submit-area{color:#848282;font-size:22px;font-weight:700;padding:20px 0;line-height:26px}.info-area .donate.button{background-color:#68b030;color:#fff;text-transform:uppercase;width:300px}#donate-comments-wrapper{text-align:left}#donate-comments-wrapper textarea{width:95%} @media (min-width:767px){#donate-comments-wrapper textarea{width:97%}}.no-close .ui-dialog-titlebar-close{display:none}#loading-dialog .overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#484848;z-index:99}#loading-dialog .dialog-area{display:flex;justify-content:center;position:fixed;top:20vh;width:100%;z-index:100}#loading-dialog .dialog{background-color:#fff;min-height:150px;text-align:center;width:300px}#loading-dialog .message{margin:20px}#loading-dialog .dots{display:flex;margin:20px 20px 0;justify-content:center}#loading-dialog .dot{display:block;width:15px;height:15px;margin-right:.5%;margin-left:.5%;border-radius:20px;background-color:#8cd621;opacity:.3}#loading-dialog .dot:nth-child(0n+1){animation-name:moving-dot;animation-duration:2.5s;animation-iteration-count:infinite;animation-delay:0}#loading-dialog .dot:nth-child(0n+2){animation-name:moving-dot;animation-duration:2.5s;animation-iteration-count:infinite;animation-delay:.5s}#loading-dialog .dot:nth- child(0n+3){animation-name:moving-dot;animation-duration:2.5s;animation-iteration-count:infinite;animation-delay:1s}#loading-dialog .dot:nth-child(0n+4){animation-name:moving-dot;animation-duration:2.5s;animation-iteration-count:infinite;animation-delay:1.5s}#loading-dialog .dot:nth-child(0n+5){animation-name:moving-dot;animation-duration:2.5s;animation-iteration-count:infinite;animation-delay:2s}@keyframes moving-dot{0%{opacity:.3}20%{opacity:1}to{opacity:.3}}.donor-faq{margin:40px auto;width:90%}@media (min-width:991px){.donor-faq{width:80%}}.donor-faq .questions{list-style-position:inside;padding-left:0}.donor-faq .questions li{color:#59316b;font-size:20px;font-weight:700;line-height:29px}@media (min-width:991px){.donor-faq .questions li{font-size:25px;line-height:34px}}.donor-faq .questions .question{color:#59316b;display:inline;font-size:20px;margin-bottom:10px;margin-top:10px}@media (min-width:991px){.donor-faq .questions .question{font-size:25px}}.donor-faq .questions .answer {color:#484848;font-family:Source Sans Pro,sans-serif;font-size:16px;line-height:20px;font-weight:400}.donor-faq .button-line{width:100%}.button-line{text-align:center}.error-container{display:block;width:50%;min-height:100px;margin-right:auto;margin-bottom:5%;margin-left:auto;padding:2% 5%;border:1px solid #aeaeae;box-shadow:11px 11px 0 0 #e70000}.error-container .title{margin-bottom:3%;color:#e70000;font-size:34px;line-height:40px;text-align:center}#company-profile-container,#hepdata-no-results-message,.donate-match-container{text-align:center;margin-bottom:60px}.donate-match-container .input-and-loader,.donate-match-container datalist,.donate-match-container input{width:300px}.donate-match-container .input-and-loader{margin:auto;position:relative}.donate-match-container .input-and-loader input{height:30px;padding:3px;border-style:solid;text-align:center;font-weight:600}.donate-match-container .input-and-loader .load-container{display:none;height:30px;width:30px;overflow:hidden;po sition:absolute;top:4px;right:-6px}.donate-match-container .input-and-loader .load-container .loader,.donate-match-container .input-and-loader .load-container .loader:after,.donate-match-container .input-and-loader .load-container .loader:before{background:#59316b;animation:load1 1s ease-in-out infinite;width:1em;height:4em}.donate-match-container .input-and-loader .load-container .loader{color:#59316b;text-indent:-9999em;margin:10px auto;position:relative;font-size:4px;transform:translateZ(0);animation-delay:-.16s}.donate-match-container .input-and-loader .load-container .loader:after,.donate-match-container .input-and-loader .load-container .loader:before{position:absolute;top:0;content:""}.donate-match-container .input-and-loader .load-container .loader:before{left:-1.5em;animation-delay:-.32s}.donate-match-container .input-and-loader .load-container .loader:after{left:1.5em}@-webkit-keyframes load1{0%,80%,to{box-shadow:0 0;height:4em}40%{box-shadow:0 -2em;height:5em}}@keyframes load1{0%,80%,to{box-shadow:0 0;height:4em}40%{box-shadow:0 -2em;height:5em}}.donate-match-container #company-option-list{width:300px;margin:0 auto;max-height:300px;overflow-x:hidden;overflow-y:auto;background-color:#f8f9fa;border:1px solid #7d4698;display:none}.donate-match-container #company-option-list .company-option{word-wrap:break-word;padding:5px 2px}.donate-match-container #company-option-list .company-option:hover{background-color:#68b030;color:#fff}.donate-error-message{color:#aeaeae;padding:0 10%;word-break:break-all;text-align:center}#company-profile-container .profile{display:none;width:75%;margin:auto}#company-profile-container .profile .row{margin:20px 0}#company-profile-container .profile .row .company-property-label{width:30%;text-align:right;font-weight:700}#company-profile-container .profile .row .company-property-value{text-align:left;width:60%}#company-profile-container .profile .row .company-property-value#summary-value{width:auto;font-size:25px;line-height:34px ;text-align:center}#company-profile-container .profile .row .company-property-value#summary-value .company{font-weight:700;color:#7d4698}#company-profile-container .profile .row .company-property-value#summary-value .percent{font-weight:700;color:#68b030}#company-profile-container .profile .row .company-property-value#summary-value .match-amount{font-weight:700;color:#59316b}#company-profile-container .profile .row .company-property-value#matchingGiftForm-value{width:auto}#company-profile-container .profile .row .company-property-value#lastUpdated-value{font-weight:700;color:#aeaeae}#company-profile-container .profile .row .company-property-value#matchingConditions-value .ratio{font-weight:700;color:#59316b}#company-profile-container .profile .row .company-property-value#resources-value{width:auto}#company-profile-container ul{margin-top:0}#company-profile-container li{margin-bottom:10px}.notify-popup{background:#7d4698;border-radius:5px;box-shadow:0 0 2px rgba(0,0,0,.5);color:#fff; padding:3px 5px 5px;margin:10px;opacity:0;transition-property:opacity;transition-duration:3s}.notify-popup.start{opacity:1;transition-duration:1ms}.notify-popup .arrow{height:10px;width:10px}.notify-popup .arrow:before{border-style:solid;content:"";display:block;height:0;margin:auto;width:0}.notify-popup[data-placement=top] .arrow{bottom:0;margin-bottom:-10px;position:absolute}.notify-popup[data-placement=top] .arrow:before{border-width:5px 5px 0;border-color:#7d4698 transparent transparent}.notify-popup[data-placement=bottom] .arrow{top:-5px;position:absolute}.notify-popup[data-placement=bottom] .arrow:before{border-width:0 5px 5px;border-color:transparent transparent #7d4698}@keyframes fadeout{0%{opacity:1}to{opacity:0}}.privacy-policy{margin-left:auto;margin-right:auto;width:70%;margin-bottom:40px}.stripe-elements .field{box-sizing:border-box;padding:12px;border:1px solid #68b030;margin:9px}.stripe-elements .field.card-number,.stripe-elements .field.cvc,.stripe-elements .field.ex p-date{width:100%}@media (min-width:767px){.stripe-elements .field.cvc,.stripe-elements .field.exp-date{width:50%}}.stripe-elements .field.error{border:1px solid red}.subscribe .fixed-width{max-width:600px;text-align:center}.subscribe .fixed-width #email,.subscribe .fixed-width #firstName{width:100%}@media (min-width:767px){.subscribe .fixed-width #firstName{width:50%}}.subscribe .fixed-width #lastName{width:100%}@media (min-width:767px){.subscribe .fixed-width #lastName{width:50%}}.subscribe .fixed-width .join{width:200px}.subscribe .fixed-width .messages{color:red;text-align:left}.header-content .thank-you{width:80%}.header-content .thank-you h1{text-align:center;text-transform:none}.header-content .thank-you h5{text-align:center}.header-content .thank-you img{width:50px}.header-content .thank-you p{color:#fff}.header-content .thank-you .share-icons{margin:20px 10px 0;text-align:center}@media (min-width:767px){.header-content .thank-you{margin-top:-120px;margin-bottom:30px}}.conte nt{margin-top:20px}.content .thank-you{margin-bottom:40px}.content .thank-you h4{text-align:center}.content .thank-you .volunteer-desc{margin-left:auto;margin-right:auto;max-width:490px;text-align:center}.content .thank-you .volunteer-desc .skills-text{margin-bottom:20px} \ No newline at end of file diff --git a/sass/layouts/_content.scss b/sass/layouts/_content.scss index 7b383094..f02c4646 100644 --- a/sass/layouts/_content.scss +++ b/sass/layouts/_content.scss @@ -5,7 +5,7 @@ .fixed-width { margin-left: auto; margin-right: auto; - + padding: 0px 10px; @include breakpoint($screen-m) { max-width: 728px; } diff --git a/sass/layouts/_header.scss b/sass/layouts/_header.scss index af0eb1fc..ec0be0be 100644 --- a/sass/layouts/_header.scss +++ b/sass/layouts/_header.scss @@ -101,13 +101,16 @@ .title-header-image { &.monthly-giving .header { background-image: url('../public/images/defenders-of-privacy-white.png'); - background-position: center; - background-size: 175px; + background-position: center 120px; + background-size: 150px; background-repeat: no-repeat; - height: 225px; + height: 300px; + @include breakpoint($screen-s) { + background-position: center; + background-size: 200px; + } @include breakpoint($screen-m) { background-size: 225px; - height: 300px; } } }