﻿body{
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    margin: 0;
    line-height: 1.5;
    margin:  0;
}
.hero {
    /* Sizing */
    width: 100vw;
    height: 100vh;
    background: url( ../images/Logo/pro.jpg ) no-repeat center center;
    background-size: cover;
}
.content, .issues, .gallery{
    max-width: 1280px;
    margin: auto;
    padding: 1rem;
}
.COVID19dialog{
    background-color:  beige;
    color:  black;
    font-size:  2em;
    padding: 2rem;
}
.meetchristy {
    margin: auto;
    padding: 2rem;
    background-color: rgb(248, 209, 28);
    border-radius: 30px;
    font-family: 'Roboto Slab', serif;
}
.meetchristy h2{
    color: rgb(60, 45, 130);
    font-size:  2.0em;
}
.meetchristy h3{
    color: rgb(60, 45, 130);
    font-size:  1.5em;
}
.meetchristyimg{
    float: left;     
    margin: 10px 25px 5px 10px; 
    border: 1px solid #000000; 
    width:  25%;
}
.pacpledge {
    background-color:  blue;
    color:  white;
    /*
    margin-top:  1em;
        */
    margin: auto;
    padding: 1rem;
    border-radius: 30px;
    font-size:  1.2em;
}
.pacpledge h3{
    font-size:  1.5em;
}
#divbanner{
    background-color:  red;
    color:  white;
    font-style:  italic;
    font-size:  1em;
    padding:  2px;
    text-align:  center;
}
#divbanner a {
    color:  white;
    text-decoration:  none;
}
#divbanner a:visited {
    color:  white;
    text-decoration:  none;
}

#donateimage{
    /* Padding and margins */
    padding: 1em;
    margin-top: 45vh;
    margin-left: auto;
    margin-right: auto;
    width:  150px;
}
#divlogo{
    max-width:  45%
}
footer{
    font-weight:  bold;
    padding-top:  1em;
    padding-bottom:  1em;
    background-color:  azure;
    text-align:  center;

}
footer a{
    color:  black;
    text-decoration:  none;
}
footer a:visited{
    color:  black;
    text-decoration:  none;
}
.quotation{
    font-size:  .7em;
    padding-left:  5em;
}
@media only screen and (min-width: 768px) {

    #divlogo{
        max-width:  25%
    } 

    #divbanner{
        background-color:  red;
        color:  white;
        font-style:  italic;
        font-size:  2.5em;
        font-weight:  bold;
        padding:  2px;
        text-align:  center;
    }
    .donatebutton {
        /* Positioning and sizing */
        display: block;
        width: 200px;
    
        /* Padding and margins */
        padding: 1em;
        margin-top: 40vh;
        margin-left: auto;
        margin-right: auto;
    
        /* Text styles */
        color: white;
        font-weight:  bold;
        text-decoration: none;
        font-size: 1.5em;
    
        /* Border styles */
        border: 3px solid black;
        border-radius: 30px;
        background-color:  green;
    }
    #donateimage{
        /* Padding and margins */
        padding: 1em;
        margin-top: 15vh;
        margin-left: auto;
        margin-right: auto;
        width:  400px;
    }
    .pacpledge {
        background-color:  blue;
        color:  white;
        margin-top:  1em;
        border-radius: 30px;
        font-size:  1.5em;
    }
    .pacpledge h3{
        font-size:  2em;
    }
    .quotation{
        font-size:  2em;
        font-weight:  bold;
        font-style:  italic;        
    }
    .meetchristy h2{
    color: rgb(60, 45, 130);
    font-size:  2.5em;
        }
        .meetchristy h3{
            color: rgb(60, 45, 130);
            font-size:  1.5em;
        }
        .meetchristyimg{
            float: left;     
            margin: 10px 25px 5px 10px; 
            border: 1px solid #000000; 
            width:  20%;
        }
}