/*
Theme Name: AoP Office
Theme URI: http://archphila.org/
Description: Archdiocese of Philadelphia
Author: AOP
Version: 2.0.23
*/

article,aside,details,figcaption,figure,footer,header,nav,section{display:block}audio,canvas,video{display:inline;zoom:1}html{font-size:100%;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}html,button,input,select,textarea{font-family:sans-serif}a:focus{outline:thin dotted}a:active,a:hover{outline:0}ol,ul{margin:1em 0;padding:0 0 0 40px}img{border:0;}form{margin:0}button,input,select,textarea{font-size:100%;margin:0;vertical-align:middle}button,input{line-height:normal}button,input[type="submit"]{-webkit-appearance:button;cursor:pointer;overflow:visible}button[disabled],input[disabled]{cursor:default}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0;height:13px;width:13px}textarea{overflow:auto;vertical-align:top}table{border-collapse:collapse;border-spacing:0} 

	html {box-sizing: border-box;}
	*, *:before, *:after {box-sizing: inherit;}

	body { background: #fafafa; font:100%/1.5 Arial, Helvetica, sans-serif; padding:0; margin:0 auto; text-align:left; display:block; width:100%; min-width:300px; overflow-x:hidden;}

	h1, h2, h3, h4, h5, h6 { font-weight: normal; line-height: 1.25;}
	h1 { font-size: 2em; text-align: center; background: cornflowerblue; color: #FFF; font-weight: bold; padding: 10px; text-shadow: 1px 1px 0px cornflowerblue, 1px 2px 0px rgba(0,0,0,0.5); margin: 0 0 1em; width:100vw; position: relative; left: 50%; margin-left: -50vw;}
	h2 { font-size:1.2em; margin:1em 0; font-weight:bold; color:indianred; display:flex; align-items:center;}
	h2:after {content: ''; display:block; flex-grow:1; border-top:1px solid; border-bottom:1px solid; height:6px; margin:3px 0 0 8px; }
	h3 { font-size:16px; font-weight:bold; }

	p, li { margin: 0 0 1em; }
	ul, ol { margin-bottom: 1em; padding: 0; list-style-position:inside;}
	em, i { font-style: italic; line-height: inherit; }
	strong, b { font-weight: bold; line-height: inherit; }
	small { font-size: 80%; line-height: inherit; }
	hr { border: solid currentColor;  border-width: 1px 0 0; clear: both; margin: 1.65em auto; height: 0; }
	hr[spacer]{border-color: transparent;}

	a { color:cornflowerblue; text-decoration: underline; line-height: inherit; }
	a:hover { text-decoration:none }
	a:focus { text-decoration:none }
	p a { line-height: inherit; }
	
	img, iframe { max-width: 100%; height: auto; }

/*  --------------------------------------------------
    Forms
    -------------------------------------------------- */
	input, textarea, select{padding:10px; border:1px solid #DDD; background:#EEE;display: block;width: 100%;}

	input[readonly]{background:#FFF; cursor:default;}
	input:invalid{background:salmon}

	input[type="submit"] {background:cornflowerblue; color:#FFF; margin: auto; border-radius: 10px; width: auto; padding: 14px;}
	input[type="submit"]:hover{background:royalblue}

	nav.pagination {margin:10px 0; display:table; table-layout: fixed; width:100%; border-collapse:collapse; padding:10px 0;   text-align:center;}
	nav.pagination .page-numbers {background:#FFF; padding:10px 0; border:1px solid #aaa; display:table-cell;}
	nav.pagination .page-numbers.current, nav.pagination .page-numbers:hover {background:gold; color:cornflowerblue;display: table-cell;}

/* -------------------------------------------------- 
	:: Layout - @media = 800px
	---------------------------------------------------*/
main{max-width:1200px; margin:auto; padding:20px 20px 100px;}

@media (min-width:450px) {
	article{display:flex; flex-wrap:wrap; margin-bottom:1em}
	article header{width:215px; font-weight:bold; padding:0 20px 0 10px; text-align:right; align-self:center}
	article header[inline]{width:auto; max-width:215px;}
	article div{flex:1 150px;}
}

section{padding:50px 0; border-bottom:1px solid #ddd; margin-bottom:1em;}
section:last-of-type{border:0 none}

p.tohomepage{text-align:center; margin: 0;position: fixed;bottom: 0;left: 0;width: 100%;}
.tohomepage a{color:#FFF; fill:#FFF;background: firebrick;padding: 10px;display: inline-block;border-radius: 7px 7px 0 0;}

p.exitbutton{text-align:center}
.exitbutton a{background: firebrick; color: #FFF; padding: 20px; border-radius: 10px;}

@media (min-width:450px) {
	.table {display:table;border-collapse:collapse; width:100%;}
	.tr, .th{ display:table-row; }
	.tr p, .th p{display:table-cell;border-bottom:1px solid #aaa; padding:5px; vertical-align:middle;}
	.th p{font-weight:bold}
}

input[hidden]{display:none} /*wish we didn't have to spell this out..*/