/* 
  ------------------------------------------------
  PVII CSS Layout Magic
  Copyright (c) 2007 Project Seven Development
  www.projectseven.com
  10: 1Col_Fixed
  ------------------------------------------------
*/img {
height: auto;
width: auto;
max-width: 100%;
 
}

body {
	color: #FF0;
	margin: 0 20px;
	padding: 0;
	font: 100% Arial, Helvetica, sans-serif;
	background: #000 url(../images/bodyback.jpg) repeat;
}
#masthead {
	color: #999999;
	background-color: #000000;
	padding: 0px;
	margin: 0;
	height: 160px;
	background-image: url(../images/mastheadback.jpg);
	background-repeat: repeat-x;
}
#wrapper {
	margin: 0 auto 10px auto;
	border-top: 2px none #2A2A2A;
	border-right: 2px solid #2A2A2A;
	border-bottom: 2px solid #2A2A2A;
	border-left: 2px solid #2A2A2A;
	max-width: 770px;
}
#center {
	/* [disabled]width: 770px; */
	background-repeat: no-repeat;
	max-width: 770px;
}
#center .content {
	padding: 20px 24px;
	font-size: 1em;
	line-height: 1.65em;
	border: 1px solid #000;
}
#masthead .content {
	padding: 0px 0px;
}
#footer .content {
	padding: 12px 20px;
	background: url(../images/mastheadback.jpg) repeat-x;
	border-top: 1px solid #262626;
}
#footer {
	color: #999999;
	padding: 0px;
	margin: 0;
	font-size: 0.7em;
	background: #000000 url(../images/footer.gif) repeat-x top;
	height: 150px;
}
.menulist {
	margin: 6px 0 12px 0;
	padding: 0;
	list-style-type: none;
}
#center a:link {
	color: #669999;
}
#center a:visited {
	color: #333333;
}
#center a:hover {
	color: #000000;
}
#wrapper .menulist a, #wrapper .menulist a:visited {
	color: #000000;
	border-left: 6px solid #FFFFFF;
	padding: 0 0 0 3px;
}
#wrapper .menulist a:hover {
	border-color: #000000;
}
#footer a:link {
	color: #999999;
}
#footer a:visited {
	color: #666666;
}
#footer a:hover {
	color: #FFFFFF;
}
.p7uberlink {
	font-weight: bold !important;
	letter-spacing: 0.15em;
	border-color: #000000 !important;
}
h1 {
	font-size: 1.8em;
	margin: 0;
}
h2 {
	font-size: 1.6em;
	margin: 30px 0 0 0;
}
h3 {
	font-size: 1.25em;
	margin: 30px 0 0 0;
}
h4 {
	font-size: 1.1em;
	margin: 20px 0 0 0;
}
.nomargintop {
	margin-top: 0;
}
.content p {
	margin: 12px 0px;
	color: #FFF;
}
.logo {
	margin: 0px;
	padding: 0px;
	left: 0px;
}
 .floatLeft {
	margin: 4px 10px 4px 4px;
}
 .floatRight {
	float: right;
	margin: 12px 8px 8px 8px;
}
.imgcenter {
	display: block;
	margin-right: auto;
	margin-left: auto;
	border: 0px double #8C9BB3;
}
#p7bod #wrapper #center .content #apDiv1 p a #button_s1 {
	margin-left: -10px;
}
#p7bod #wrapper #center .content #apDiv1 p {
	color: #E9E7B7;
}
 #footer .content p {
	color: #999;
	margin-left: 500px;
	margin-top: 40px;
}
#SEO {
	background-image:url(../images/bodyback.jpg);
	background-repeat:repeat;
	font:11px Arial, Helvetica, sans-serif;
	color: #999;
	width: 750px;
	margin: 8px auto;
	padding-top: 10px;
}
 .floatLeft {
	float: left;
	margin: 4px 10px 4px 4px;
}
 .floatRight { 
    float: right; 
    margin: 4px; 
}
.imgcenter {
	display: block;
	margin-right: auto;
	margin-left: auto;
	border: 2px double #8C9BB3;
}
/* 
	Max width before this PARTICULAR table gets nasty
	This query will take effect for any screen smaller than 760px
	and also iPads specifically.
	*/
	@media 
	only screen and (max-width: 760px),
	(min-device-width: 768px) and (max-device-width: 1024px)  {
	
		/* Force table to not be like tables anymore */
		#center table,  #center thead,  #center tbody, #center  th, #center td, #center tr { 
			display: block; 
		}
		
		/* Hide table headers (but not display: none;, for accessibility) */
		#center thead tr { 
			position: absolute;
			top: -9999px;
			left: -9999px;
		}
		
		#center tr { border: 1px solid #333; }
		
		#center td { 
			/* Behave  like a "row" */
			border: none;
			border-bottom: 1px solid #333; 
			position: relative;
			/*padding-left: 50%; */
		}
		
		#center td:before { 
			/* Now like a table header */
			position: absolute;
			/* Top/left values mimic padding */
			top: 6px;
			left: 6px;
			width: 45%; 
			padding-right: 10px; 
			white-space: nowrap;
		}
		
		/*
		Label the data
		
		td:nth-of-type(1):before { content: "First Name"; }
		td:nth-of-type(2):before { content: "Last Name"; }
		td:nth-of-type(3):before { content: "Job Title"; }
		td:nth-of-type(4):before { content: "Favorite Color"; }
		td:nth-of-type(5):before { content: "Wars of Trek?"; }
		td:nth-of-type(6):before { content: "Porn Name"; }
		td:nth-of-type(7):before { content: "Date of Birth"; }
		td:nth-of-type(8):before { content: "Dream Vacation City"; }
		td:nth-of-type(9):before { content: "GPA"; }
		td:nth-of-type(10):before { content: "Arbitrary Data"; }
	}
	*/

	/* Smartphones (portrait and landscape) ----------- */
	@media only screen
	and (min-device-width : 320px)
	and (max-device-width : 480px) {
		body { 
			padding: 0; 
			margin: 0; 
			width: 100%; }
textarea {max-width: 320px;}
		}
	
	/* iPads (portrait and landscape) ----------- */
	@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
		body { 
			width: 495px; 
		}
	}
	
 
#center .content .drop { z-index: -700; float: left;}
 
