/*
Photo buttons */
		
.photo-grid { text-align: center; margin-left: 0 !important; padding: 0 }
.photo-grid a { margin: 0; padding: 0; border: 0 }
.photo-grid figcaption { color: #fff!important; display: table; height: 100%; left: 0; opacity: 0; position: absolute; right: 0; top: 0; z-index: 100 }
.photo-grid figcaption p { display: table-cell; position: relative; vertical-align: middle; color: #fff; padding: 0 2em; width: 100%; }
.photo-grid a:hover figcaption { opacity: 1 }
.photo-grid img { display: block; height: auto }
.photo-grid figure { height: 194px; overflow: hidden; position: relative; margin: 0; padding: 0; background-size: cover; background-position: center; }
.box span { display: block; padding: 1rem 0; font-weight: 400 }
.blue { background-color: #4271D0; display: block; color: #fff }
.red { background-color: #CC0033; display: block; color: #fff }
.purple { background-color: #791B72; display: block; color: #fff }
.green { background-color: #508911; display: block; color: #fff }
.blue figcaption { background: rgba(46, 78, 144, 0.75); }
.red figcaption { background: rgba(141, 0, 35, 0.75); }
.purple figcaption { background: rgba(84, 19, 79, 0.57); }
.green figcaption { background: rgba(55, 95, 12, 0.75); }
.blue:hover { background-color: #6c90da; color: #fff }
.red:hover { background-color: #d73860; color: #fff }
.purple:hover { background-color: #964d91; color: #fff }
.green:hover { background-color: #76a345; color: #fff }
.button-list .blue { background-color: #df3399; display: block; color: #fff }
.button-list .red { background-color: #b6cc00; display: block; color: #fff }
.button-list .purple { background-color: #b16700; display: block; color: #fff }
.button-list .green { background-color: #04958f; display: block; color: #fff }
.button-list .blue:hover { background-color: #8f2162; color: #fff }
.button-list .red:hover { background-color: #758300; color: #fff }
.button-list .purple:hover { background-color: #724200; color: #fff }
.button-list .green:hover { background-color: #03605c; color: #fff }
.button-list { margin: 0; padding: 0;}
.button-list li { margin: 0 0 1em; list-style: none; }
.button-list a { padding: 12px 20px 12px 95px; display: block; background-repeat: no-repeat; background-position: top left; background-size: 81px 48px; }

/* Midrange -- adjust the navigation... */
		
@media (max-width: 1081px) {
#site-focus> .nine,  #site-focus> .three { width: 100%; margin: 1em auto; }
.button-list li { width: 50%; margin: 10px 0; display: inline-block; float: left; padding: 0 10px; box-sizing: border-box; }
}

/* Smaller than desktop -- hide the navigation... */
		
@media (max-width: 768px) {
.photo-grid .three { width: 50%; margin: 0; padding: 10px; }
}

/* Smaller than desktop -- hide the navigation... */
		
@media (max-width: 559px) {
.photo-grid .three { width: 100%; margin: 1em auto; }
.button-list li { width: 100%; margin: 1em 0; }
}