/* CSS for #jumbotron-vision used on Vision page */

#jumbotron-vision {
        background-image: url(../vision-bg.jpg);
        background-size: cover;
        background-position: center;
        color: white;
    }

/* This adjusts text size to make it larger and responsive*/
#jumbotron-vision div h2 {
            font-size: 1.65rem;
            text-shadow: 2px 2px 5px black;
        }
    #jumbotron-vision div p.lead {
            font-size: .9rem;
            text-shadow: 1px 1px 5px black;
        }
    
    @media (min-width: 576px) { 
        #jumbotron-vision div h2 {
            font-size: 2.7rem;
        }
        #jumbotron-vision div p.lead {
            font-size: 1rem;
        }
    }
    
    @media (min-width: 768px) { 
        #jumbotron-vision div h2 {
            font-size: 3.5rem;
        }
        #jumbotron-vision div p.lead {
            font-size: 1rem;
        }
    }
    
    @media (min-width: 992px) { 
        #jumbotron-vision div h2 {
            font-size: 4.5rem;
        }
        #jumbotron-vision div p.lead {
            font-size: 1.2rem;
        }
    }
    
    @media (min-width: 1200px) { 
        #jumbotron-vision div h2 {
            font-size: 4.5rem;
        }
        #jumbotron-vision div p.lead {
            font-size: 1.25rem;
        }
    }