/* CSS rules for screens less than or equal to 1440px wide */
@media screen and (max-width: 1440px)
{
	*
	{
	background-color: #DCBBAE;
	margin:0;
	padding:0;
	}

	body
	{
		font-family: 'Times New Roman', Times, sans-serif;
		font-size: 16px;
	}

	.logo img
	{
		position:absolute;
	
		width:80px;
		height:auto;
	
		top:15px;
		left:10px;
	}

	.slogan img
	{
		position:absolute;
		border-style:outset;

		width: 256px;
		height:auto;

		left:30%;
		top:10px;
	}

/*--------------------- Navigation Menu Code ------------------------*/
	.topnav
	{
		position:absolute;

		top:56px;
		left:128px;
	}

		.topnav a
	{
		position:relative;
		display:inline;

		box-shadow: 1px 4px 8px 0 rgba(0, 0, 0, 0.2);
		padding:3px 3px;

		text-align: center;
		text-decoration: none;
		font-size: 18px;
	}

	.topnav a:hover /* Change the color of links on hover */
	{                
		background-color:#fad2ca;
		color: black;
	}

	.topnav a.active
	{             
		background-color: #04AA6D;
		color: white;
	}

/* ------------------- Pledge Box -------------------*/
	.bodycontainer
	{
		width: 384px;
		height:auto;

		position:absolute;
		box-shadow: 1px 4px 8px 0 rgba(0, 0, 0, 0.2);
	}

	.biographytitle h3
	{
		position:absolute;
	
		left:25px;
		top:198px;
	
		text-align:center;
		font-size:16px;
	}

	.biographytitle h4
	{
		position:absolute;
	
		left:25px;
		top:224px;

		text-align:left;
		font-size:14px;
	}

	.biographycard img
	{
		position:absolute;
		display:block;
	
		left:224px;
		top:128px;
	
		height:auto;
		width: 144px;
		border:1px solid powderblue;
		box-shadow: 2px 4px 8px 2px rgba(0, 0, 0, 0.2);
	}

	.biographycard p
	{
		position:absolute;
	
		left:25px;
		top:328px;
	
		border:1px solid lightgrey;
		box-shadow: 2px 4px 8px 2px rgba(0, 0, 0, 0.2);
		padding: 5px;
	
		font-size:16px;

		width:320px;
		height:auto;
	}

/*------------------ Social Media Icons ------------------------*/
	.socialmedia
	{
		position:absolute;
		left:92px;
		top:168px;
		height:auto;
		width:auto;
		display:inline;
	}

/*------------------ AAFE Icons ------------------------*/
	.AAFE
	{
		position:absolute;
		left:64px;
		top:256px;
	}

/*------------------ Hone Health Icons ------------------------*/
	.hone img
	{
		position:absolute;
		right:64px;
		top:64px;
		height:192px;
		width:auto;

	}

	/*------------------ After Pay Icons ------------------------*/
	.afterpay img
	{
		position:absolute;
		right:48px;
		top:32px;
		height:32px;
		width:auto;
	}

/*-------------------------  Contact Form ------------------------*/
	.contactform
	{
		position:absolute;
		display:block;
		
		bottom:64px;
		left:48px;

		width:320px;
		height:256px;

		box-sizing: border-box;
		border: 2px solid #bfc4be;
		border-style:outset;
		border:2px solid powderblue;
		background-color:#6e5464;
	}

	.contactform h3
	{
		font-size: 24px;
		text-align:center;
		color:white;
		background-color:#6e5464;
	}

	.lblclientfname label
	{
		position:absolute;
		top:32px;
		left:8px;
		background-color:#6e5464;
		color:white;
	}

	.inpclientfname
	{
		position:absolute;
		top:32px;
		left:128px;
		text-align:left;
		background: rgb(214, 214, 214, 0);
	}

	.lblclientlname label
	{
		position:absolute;
		top:64px;
		left:8px;
		background-color:#6e5464;
		color:white;
	}

	.inpclientlname
	{
		position:absolute;
		top:64px;
		left:128px;
		text-align:left;
		background: rgb(214, 214, 214, 0);
	}

	.lblclientnumber label
	{
		position:absolute;
		top:96px;
		left:8px;
		background-color:#6e5464;
		color:white;
	}

	.inpclientnumber
	{
		position:absolute;
		top:96px;
		left:128px;
		text-align:left;
		background: rgb(214, 214, 214, 0);
	}

	.lblclientemail label
	{
		position:absolute;
		top:128px;
		left:8px;
		background-color:#6e5464;
		color:white;
	}

	.inpclientemail
	{
		position:absolute;
		top:128px;
		left:128px;
		text-align:left;
		background: rgb(214, 214, 214, 0);
	}

	.lblcontactdescription label
	{
		position:absolute;
		top:158px;
		left:8px;
		background-color:#6e5464;
		color:white;
	}

	.inpcontactdescription
	{
		position:absolute;
		top:158px;
		left:128px;
		text-align:left;
		background: rgb(214, 214, 214, 0);
	}

	#buttonHolder
	{
		position:absolute;
		bottom:16px;
		left:112px;
		text-align: center;

		width:64px;
		padding:5px;
		border-color:powderblue;
	}
}

/* CSS rules for screens less than or equal to 1024px wide */
@media screen and (max-width: 1024px)
{
	*
	{
	background-color: #DCBBAE;
	margin:0;
	padding:0;
	}

	body
	{
		font-family: 'Times New Roman', Times, sans-serif;
		font-size: 16px;
	}

	.logo img
	{
		position:absolute;
	
		width:64px;
		height:auto;
	
		top:5px;
		left:20px;
	}

/* ------------------- Pledge Box -------------------*/

	.bodycontainer
	{
		width: 384px;
		height:auto;

		position:absolute;
		box-shadow: 1px 4px 8px 0 rgba(0, 0, 0, 0.2);
	}

	.biographytitle h3
	{
		position:absolute;
	
		left:25px;
		top:198px;
	
		text-align:center;
		font-size:16px;
	}

	.biographytitle h4
	{
		position:absolute;
	
		left:25px;
		top:224px;

		text-align:left;
		font-size:14px;
	}

	.biographycard img
	{
		position:absolute;
		display:block;
	
		left:224px;
		top:128px;
	
		height:auto;
		width: 144px;
		border:1px solid powderblue;
		box-shadow: 2px 4px 8px 2px rgba(0, 0, 0, 0.2);
	}

	.biographycard p
	{
		position:absolute;
	
		left:25px;
		top:328px;
	
		border:1px solid lightgrey;
		box-shadow: 2px 4px 8px 2px rgba(0, 0, 0, 0.2);
		padding: 5px;
	
		font-size:16px;

		width:320px;
		height:auto;
	}

/*------------------ Social Media Icons ------------------------*/
	.socialmedia
	{
		position:absolute;
		left:92px;
		top:168px;
		height:auto;
		width:auto;
		display:inline;
	}

/*------------------ AAFE Icons ------------------------*/
	.AAFE
	{
		position:absolute;
		left:64px;
		top:256px;
	}

/*------------------ Hone Health Icons ------------------------*/
	.hone img
	{
		position:absolute;
		right:64px;
		top:64px;
		height:192px;
		width:auto;

	}

/*------------------ After Pay Icons ------------------------*/
	.afterpay img
	{
		position:absolute;
		right:48px;
		top:32px;
		height:32px;
		width:auto;
	}

/*-------------------------  Contact Form ------------------------*/
	.contactform
	{
		position:absolute;
		display:block;
		
		bottom:64px;
		left:48px;

		width:320px;
		height:256px;

		box-sizing: border-box;
		border: 2px solid #bfc4be;
		border-style:outset;
		border:2px solid powderblue;
		background-color:#6e5464;
	}

	.contactform h3
	{
		font-size: 24px;
		text-align:center;
		color:white;
		background-color:#6e5464;
	}

	.lblclientfname label
	{
		position:absolute;
		top:32px;
		left:8px;
		background-color:#6e5464;
		color:white;
	}

	.inpclientfname
	{
		position:absolute;
		top:32px;
		left:128px;
		text-align:left;
		background: rgb(214, 214, 214, 0);
	}

	.lblclientlname label
	{
		position:absolute;
		top:64px;
		left:8px;
		background-color:#6e5464;
		color:white;
	}

	.inpclientlname
	{
		position:absolute;
		top:64px;
		left:128px;
		text-align:left;
		background: rgb(214, 214, 214, 0);
	}

	.lblclientnumber label
	{
		position:absolute;
		top:96px;
		left:8px;
		background-color:#6e5464;
		color:white;
	}

	.inpclientnumber
	{
		position:absolute;
		top:96px;
		left:128px;
		text-align:left;
		background: rgb(214, 214, 214, 0);
	}

	.lblclientemail label
	{
		position:absolute;
		top:128px;
		left:8px;
		background-color:#6e5464;
		color:white;
	}

	.inpclientemail
	{
		position:absolute;
		top:128px;
		left:128px;
		text-align:left;
		background: rgb(214, 214, 214, 0);
	}

	.lblcontactdescription label
	{
		position:absolute;
		top:158px;
		left:8px;
		background-color:#6e5464;
		color:white;
	}

	.inpcontactdescription
	{
		position:absolute;
		top:158px;
		left:128px;
		text-align:left;
		background: rgb(214, 214, 214, 0);
	}

	#buttonHolder
	{
		position:absolute;
		bottom:16px;
		left:112px;
		text-align: center;

		width:64px;
		padding:5px;
		border-color:powderblue;
	}
}

/* CSS rules for screens less than or equal to 768px wide */
@media screen and (max-width:768px)
{
	*
	{
	background-color: #DCBBAE;
	margin:0;
	padding:0;
	}

	body
	{
		font-family: 'Times New Roman', Times, sans-serif;
		font-size: 16px;
	}

	.logo img
	{
		position:absolute;
	
		width:64px;
		height:auto;
	
		top:5px;
		left:20px
	}

/* ------------------- Pledge Box -------------------*/
	
	.bodycontainer
	{
		position:relative;

		box-shadow: 1px 4px 8px 0 rgba(0, 0, 0, 0.2);
	}

	.biographytitle h3
	{
		position:absolute;
	
		left:25px;
		top:198px;
	
		text-align:center;
		font-size:16px;
	}

	.biographytitle h4
	{
		position:absolute;
	
		left:25px;
		top:224px;

		text-align:left;
		font-size:14px;
	}

	.biographycard img
	{
		position:absolute;
		display:block;
	
		left:320px;
		top:128px;
	
		height:auto;
		width: 144px;
	
		border:1px solid powderblue;
		box-shadow: 2px 4px 8px 2px rgba(0, 0, 0, 0.2);
	}

	.biographycard p
	{
		position:absolute;
	
		left:64px;
		top:328px;
	
		border:1px solid lightgrey;
		box-shadow: 2px 4px 8px 2px rgba(0, 0, 0, 0.2);
		padding: 5px;
	
		height:auto;
		width:420px;
	
		font-size:32px;
	}
/*------------------ Social Media Icons ------------------------*/
	.socialmedia
	{
		position:absolute;
		left:92px;
		top:168px;
		height:auto;
		width:auto;
		display:inline;
	}

/*------------------ AAFE Icons ------------------------*/
	.AAFE
	{
		position:absolute;
		left:64px;
		top:256px;
	}

/*------------------ Hone Health Icons ------------------------*/
	.hone img
	{
		position:absolute;
		right:64px;
		top:64px;
		height:192px;
		width:auto;

	}

/*------------------ After Pay Icons ------------------------*/
	.afterpay img
	{
		position:absolute;
		right:48px;
		top:32px;
		height:32px;
		width:auto;
	}

/*-------------------------  Contact Form ------------------------*/
	.contactform
	{
		position:absolute;
		display:block;
		
		top:256px;
		left:348px;

		width:320px;
		height:256px;

		box-sizing: border-box;
		border: 2px solid #bfc4be;
		border-style:outset;
		border:2px solid powderblue;
		background-color:#6e5464;
	}

	.contactform h3
	{
		font-size: 24px;
		text-align:center;
		color:white;
		background-color:#6e5464;
	}

	.lblclientfname label
	{
		position:absolute;
		top:32px;
		left:8px;
		background-color:#6e5464;
		color:white;
	}

	.inpclientfname
	{
		position:absolute;
		top:32px;
		left:128px;
		text-align:left;
		background: rgb(214, 214, 214, 0);
	}

	.lblclientlname label
	{
		position:absolute;
		top:64px;
		left:8px;
		background-color:#6e5464;
		color:white;
	}

	.inpclientlname
	{
		position:absolute;
		top:64px;
		left:128px;
		text-align:left;
		background: rgb(214, 214, 214, 0);
	}

	.lblclientnumber label
	{
		position:absolute;
		top:96px;
		left:8px;
		background-color:#6e5464;
		color:white;
	}

	.inpclientnumber
	{
		position:absolute;
		top:96px;
		left:128px;
		text-align:left;
		background: rgb(214, 214, 214, 0);
	}

	.lblclientemail label
	{
		position:absolute;
		top:128px;
		left:8px;
		background-color:#6e5464;
		color:white;
	}

	.inpclientemail
	{
		position:absolute;
		top:128px;
		left:128px;
		text-align:left;
		background: rgb(214, 214, 214, 0);
	}

	.lblcontactdescription label
	{
		position:absolute;
		top:158px;
		left:8px;
		background-color:#6e5464;
		color:white;
	}

	.inpcontactdescription
	{
		position:absolute;
		top:158px;
		left:128px;
		text-align:left;
		background: rgb(214, 214, 214, 0);
	}

	#buttonHolder
	{
		position:absolute;
		bottom:16px;
		left:112px;
		text-align: center;

		width:64px;
		padding:5px;
		border-color:powderblue;
	}

}

/* CSS rules for screens less than or equal to 481px wide */
@media screen and (max-width:481px)
{
	*
	{
	background-color: #DCBBAE;
	margin:0;
	padding:0;
	}

	body
	{
		font-family: 'Times New Roman', Times, sans-serif;
		font-size: 16px;
	}

	.logo img
	{
		position:absolute;
	
		width:80px;
		height:auto;
	
		top:15px;
		left:10px;
	}

/* ------------------- Pledge Box -------------------*/
	.bodycontainer
	{
		width: 384px;
		height:auto;

		position:absolute;
		box-shadow: 1px 4px 8px 0 rgba(0, 0, 0, 0.2);
	}

	.biographytitle h3
	{
		position:absolute;
	
		left:25px;
		top:198px;
	
		text-align:center;
		font-size:16px;
	}

	.biographytitle h4
	{
		position:absolute;
	
		left:25px;
		top:224px;

		text-align:left;
		font-size:14px;
	}

	.biographycard img
	{
		position:absolute;
		display:block;
	
		left:224px;
		top:128px;
	
		height:auto;
		width: 144px;
		border:3px solid powderblue;
		box-shadow: 2px 4px 8px 2px rgba(0, 0, 0, 0.2);
	}
/*
	.biographycard p
	{
		position:absolute;
	
		left:37px;
		top:352px;
	
		border:3px solid powderblue;
		box-shadow: 2px 4px 8px 2px rgba(0, 0, 0, 0.2);
		padding: 5px;
	
		font-size:10px;

		width:320px;
		height:auto;
*/
	}

/*------------------ Social Media Icons ------------------------*/
	.socialmedia
	{
		position:absolute;
		left:92px;
		top:168px;
		height:auto;
		width:auto;
		display:inline;
	}

/*------------------ AAFE Icons ------------------------*/
	.AAFE
	{
		position:absolute;
		left:64px;
		top:256px;
	}

/*------------------ Hone Health Icons ------------------------*/
	.hone img
	{
		position:absolute;
		left:64px;
		top:64px;
		height:192px;
		width:auto;
		display:none;
	}

/*------------------ After Pay Icons ------------------------*/
	.afterpay img
	{
		position:absolute;
		left:48px;
		bottom:5px;
		height:32px;
		width:auto;
		display:none;
	}

/*-------------------------  Contact Form ------------------------*/
	.contactform
	{
		position:absolute;
		display:block;
		
		top:356px;
		left:72px;

		width:320px;
		height:256px;

		box-sizing: border-box;
		border: 2px solid #bfc4be;
		border-style:outset;
		border:2px solid powderblue;
		background-color:#6e5464;
	}

	.contactform h3
	{
		font-size: 24px;
		text-align:center;
		color:white;
		background-color:#6e5464;
	}

	.lblclientfname label
	{
		position:absolute;
		top:32px;
		left:8px;
		background-color:#6e5464;
		color:white;
	}

	.inpclientfname
	{
		position:absolute;
		top:32px;
		left:128px;
		text-align:left;
		background: rgb(214, 214, 214, 0);
	}

	.lblclientlname label
	{
		position:absolute;
		top:64px;
		left:8px;
		background-color:#6e5464;
		color:white;
	}

	.inpclientlname
	{
		position:absolute;
		top:64px;
		left:128px;
		text-align:left;
		background: rgb(214, 214, 214, 0);
	}

	.lblclientnumber label
	{
		position:absolute;
		top:96px;
		left:8px;
		background-color:#6e5464;
		color:white;
	}

	.inpclientnumber
	{
		position:absolute;
		top:96px;
		left:128px;
		text-align:left;
		background: rgb(214, 214, 214, 0);
	}

	.lblclientemail label
	{
		position:absolute;
		top:128px;
		left:8px;
		background-color:#6e5464;
		color:white;
	}

	.inpclientemail
	{
		position:absolute;
		top:128px;
		left:128px;
		text-align:left;
		background: rgb(214, 214, 214, 0);
	}

	.lblcontactdescription label
	{
		position:absolute;
		top:158px;
		left:8px;
		background-color:#6e5464;
		color:white;
	}

	.inpcontactdescription
	{
		position:absolute;
		top:158px;
		left:128px;
		text-align:left;
		background: rgb(214, 214, 214, 0);
	}

	#buttonHolder
	{
		position:absolute;
		bottom:16px;
		left:32px;
		text-align: center;

		width:64px;
		padding:5px;
		border-color:powderblue;
	}
}