/* HANDLERS FOR DONATION MODAL */

/* !!!! need to hard code px height/width/font !!!! */

.modal-headline { text-align: center; font-size: 3.0em; font-weight: bold;  padding-left: 0.25em; padding-right: 0.25em; padding-top: 0.25em; }
.modal-window { }
.modal-nagline {text-align: center !important; padding-top: 2.0em;  padding-left: 0.25em; padding-right: 0.25em;}
.modal-cookieline {text-align: center !important; font-size: 0.8em; padding-top: 1.0em;  padding-left: 0.25em; padding-right: 0.25em;}

@media only screen and (max-width: 1920px) {
.modal-window { width: 800px !important; height: 360px !important;}
.modal-headline { text-align: center; font-size: 34pt; font-weight: bold; padding-bottom: 0.3em !important; }
.modal-nagline {text-align: center !important; font-size: 20pt !important; padding-top: 2.0em;}
}

@media only screen and (max-width: 1280px) {
.modal-window { width: 700px !important; height: 340px !important;}
.modal-headline { text-align: center; font-size: 32pt; font-weight: bold; padding-bottom: 0.3em !important; }
.modal-nagline {text-align: center !important; font-size: 18pt !important; padding-top: 2.0em;}
}

@media only screen and (max-width: 1080px) {
.modal-window { width: 800px !important; height: 340px !important;}
.modal-headline { text-align: center; font-size: 32pt; font-weight: bold; padding-bottom: 0.3em !important; }
.modal-nagline {text-align: center !important; font-size: 18pt !important; padding-top: 2.0em;}
}

@media only screen and (max-width: 1024px) {
.modal-window { width: 700px !important; height: 320px !important;}
.modal-headline { text-align: center; font-size: 28pt; font-weight: bold; padding-bottom: 0.3em !important; }
.modal-nagline {text-align: center !important; font-size: 16pt !important; padding-top: 2.0em;}
}

@media only screen and (max-width: 960px) {
.modal-window { width: 700px !important; height: 320px !important;}
.modal-headline { text-align: center; font-size: 28pt; font-weight: bold; padding-bottom: 0.5em !important; }
.modal-nagline {text-align: center !important; font-size: 16pt !important; padding-top: 2.0em;}
}

@media only screen and (max-width: 800px) {
.modal-window { width: 630px !important; height: 300px !important;}
.modal-headline { text-align: center; font-size: 26pt; font-weight: bold; padding-bottom: 0.5em !important; }
.modal-nagline {text-align: center !important; font-size: 14pt !important; padding-top: 2.0em;}
}

@media only screen and (max-width: 768px) {
.modal-window { width: 600px !important; height: 270px !important;}
.modal-headline { text-align: center; font-size: 22pt; font-weight: bold; padding-bottom: 0.5em !important; }
.modal-nagline {text-align: center !important; font-size: 14pt !important; padding-top: 2.0em;}
}

@media only screen and (max-width: 720px) {
.modal-window { width: 600px !important; height: 270px !important;}
.modal-headline { text-align: center; font-size: 22pt; font-weight: bold; padding-bottom: 0.5em !important; }
.modal-nagline {text-align: center !important; font-size: 14pt !important; padding-top: 2.0em;}
}

@media only screen and (max-width: 640px) {
.modal-window { width: 510px !important; height: 230px !important;}
.modal-headline { text-align: center; font-size: 18pt; font-weight: bold; padding-bottom: 0.5em !important; }
.modal-nagline {text-align: center !important; font-size: 12pt !important; padding-top: 2.0em;}
}

@media only screen and (max-width: 592px) {
.modal-window { width: 450px !important; height: 240px !important;}
.modal-headline { text-align: center; font-size: 18pt; font-weight: bold; padding-bottom: 0.5em !important; }
.modal-nagline {text-align: center !important; font-size: 12pt !important; padding-top: 2.0em;}
}

@media only screen and (max-width: 568px) {
.modal-window { width: 440px !important; height: 240px !important;}
.modal-headline { text-align: center; font-size: 18pt; font-weight: bold; padding-bottom: 0.5em !important; }
.modal-nagline {text-align: center !important; font-size: 12pt !important; padding-top: 2.0em;}
}

@media only screen and (max-width: 540px) {
.modal-window { width: 430px !important; height: 250px !important;}
.modal-headline { text-align: center; font-size: 18pt; font-weight: bold; padding-bottom: 0.5em !important; }
.modal-nagline {text-align: center !important; font-size: 12pt !important; padding-top: 2.0em;}
}

@media only screen and (max-width: 480px) {
.modal-window { width: 380px !important; height: 240px !important;}
.modal-headline { text-align: center; font-size: 16pt; font-weight: bold; padding-bottom: 0.5em !important; }
.modal-nagline {text-align: center !important; font-size: 12pt !important; padding-top: 2.0em;}
}

@media only screen and (max-width: 360px) {
.modal-window { width: 280px !important; height: 280px !important;}
.modal-headline { text-align: center; font-size: 16pt; font-weight: bold; padding-bottom: 0.5em !important; }
.modal-nagline {text-align: center !important; font-size: 12pt !important; padding-top: 2.0em;}
}

@media only screen and (max-width: 320px) {
.modal-window { width: 250px !important; height: 300px !important;}
.modal-headline { text-align: center; font-size: 16pt; font-weight: bold; padding-bottom: 0.5em !important; }
.modal-nagline {text-align: center !important; font-size: 12pt !important; padding-top: 2.0em;}
}