
body, html {
	font-family: Arial, Helvetica, sans-serif;
	background: url(/Graphics/AboutBkg.png);
	background-attachment: fixed;
	background-position: center;
	background-size: cover;
	box-sizing: border-box;
	min-width: 1000px;
	font-size: 22px;
	margin: 0px;
}
h1 {
	text-align: center;
}
input[type="radio"] {
	vertical-align: bottom;
	width: 30px;
	height: 30px;
}

#LargeImgPanel {
	justify-content: center;
	background: #00000099;
    align-items: center;
	position: fixed;
	display: none;
	width: 100%;
	height: 100%;
	z-index: 20;
	top: 0;
}
#LargeImgClose {
	position: absolute;
	font-size: 26px;
	cursor: pointer;
	color: #FFFFFF;
	top: 10px;
	right: 10px;
	z-index: 25;
}
#LargeImgPanel img{
    object-fit: contain;
	max-width: 90%;
    max-height: 90%;
    width: auto;
    height: auto;
}

#TopBar {
	background: url(/Graphics/TopBkg.png);
	transition: height 0.3s ease-in-out;
    transform: translateX(-50%);
    position: fixed;
	width: 100%;
	z-index: 10;
	left: 50%;
	top: 0;
}
.PageAtTop {
	text-align: center;
	height: 155px;
}
.PageAtTop #NavLinks {
	display: none;
}
.PageAtTop #SmallLogo {
	display: none;
}
.PageScrolled {
	border-bottom: solid 1px #A13505;
	text-align: left;
	height: 50px;
}
.PageScrolled #LargeLogo {
	display: none;
}
.PageScrolled #SmallLogo {
	display: inline-block;
}
.PageScrolled #NavLinks {
	display: inline-block;
}
#AsMenu {
	cursor: pointer;
}
.MenuLinks {
	background: #EC4F09;
	position: absolute;
	display: none;
	width: 215px;
	right: 0px;
	top: 0px;
}
.MenuLinks a {
	border-bottom: solid 1px #A13505;
	text-align: left;
	width: 175px;
}

#NavLinks {
	display: inline-block;
	vertical-align: top;
	text-align: right;
	height: 50px;
	float: right;
}
#NavLinks a {
	display: inline-block;
	text-decoration: none;
	padding: 0px 20px;
	line-height: 50px;
	color: #F7F7E7;
	height: 50px;
}
#NavLinks a:hover {
	background: #A13505;
	color: #FFFFFF;
}

#Tiles {
	background: #FFFFFF;
	text-align: center;
	margin-top: 155px;
	width: 100%;
}
.Tile {
	background: url(/Graphics/TileBkg.png);
	text-decoration: none;
	display: inline-block;
	margin: 25px 15px;
	color: #333333;
	width: 180px;
	height: 180px;
}
.Tile img {
	filter: drop-shadow(2.5px 2.5px 10px rgba(0, 0, 0, 0.7));
	margin: 15px;
}

#About {
	scroll-margin-top: 50px;
	box-sizing: border-box;
	padding: 15px;
}

#PupsAvail {
	scroll-margin-top: 50px;
	background: #EC4F09;
	color: #F7F7E7;
}
#Puppies {
	max-width: 950px;
	display: block;
    margin: auto;
}
.Puppy {
	border-bottom: dotted 1px #F7F7E7;
	padding: 15px 0px;
}
.Puppy > img {
	margin-right: 15px;
}
.Puppy h2{
	display: inline-block;
	margin: 10px;
}
.Puppy span {
	font-size: 18px;
	float: right;
}
.Puppy div {
	display: inline-block;
    vertical-align: top;
	width: 450px;
}
.Puppy div img {
    vertical-align: middle;
	float: right;
}

.Puppy2 {
	border-top: dotted 2px #F7F7E7;
	padding: 15px 0px;
}
.Puppy2 span{
	display: inline-block;
	font-size: 24px;
	font-weight: bold;
}
.Puppy2 div img {
    vertical-align: middle;
}

.Puppy2 .Pics {
	margin-top: 5px;
	text-align: center;
}
.Puppy2 .Pics img {
	margin-right: 15px;
	cursor: pointer;
	width: 250px;
}

#Cost {
	scroll-margin-top: 50px;
	background: #FFFFFF;
	padding: 15px;
}
#Parents {
	background: #0D161C;
	text-align: center;
	padding: 20px 0px;
	color: #F7F7E7;
}
#Parents h1 {
	margin: 0px;
}
#AboutComm {
	scroll-margin-top: 50px;
	box-sizing: border-box;
	padding: 15px;
}
#Apply {
	background: linear-gradient(to bottom, #0D161C 0%, #0D161C 100px, #B4EAF9 100px);
	scroll-margin-top: 50px;
}
#Apply h1 {
	text-align: center;
	display: block;
	color: #F7F7E7;
	height: 50px;
	margin: 0px;
}
#Application {
	flex-direction: column;
	background: #F7F7E7;
	margin: 0px 50px;
}
#FormError {
	background: #990000;
	position: fixed;
	color: #F7F7E7;
	padding: 15px;
	display: none;
	width: 100%;
	left: 0px;
	top: 50px;
}
#FormComplete {
	border: solid 10px #EC4F09;
    background: #ffffff;
    position: fixed;
	display: none;
    padding: 50px;
    top: 50%;
    left: 0px;
}

#Application h3{
	display: inline-block;
	margin: 10px 0px;
}
#AppQuestions {
	padding: 0px 25px;
	max-width: 750px;
	display: block;
    margin: auto;
}

.FormItem {
    line-height: 40px;
	display: block;
	height: 40px;
}
.FormItem label {
	display: inline-block;
	text-align: right;
	width: 350px;
}
.FormItem input {
	box-sizing: border-box;
	line-height: 35px;
	padding: 0px 3px;
	font-size: 24px;
	width: 350px;
	height: 35px;
    border: none;
	border-bottom: solid 1px #AAAAAA;
}
.FormItem select {
	line-height: 35px;
	padding: 0px 3px;
	font-size: 24px;
	height: 35px;
    border: none;
	border-bottom: solid 1px #AAAAAA;
}
.FormArea {
	display: block;
}
.FormArea label {
	text-align: center;
	display: block;
}
.FormArea textarea {
	box-sizing: border-box;
	margin: 5px 0px;
	height: 75px;
	width: 100%;
}
.Questionnaire li {
	border-top: solid 1px #AAAAAA;
	padding-top: 5px;
	margin-top: 25px;
}
.Questionnaire div {
	text-align: center;
}
.Questionnaire input {
	margin-right: 50px;
}

