/*
* Punch Communications Site style sheet
*/

html {
    background: #c9c588 url(images/html-bg.jpg) repeat-x;
    width: 100%;
}

body {
	width: 940px;
	/* height: 768px; */
	float: left;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	background: #dbd8b5;
	color: #383636;
}

/*----------------------------------------------------------------------------*/
/* General content section styles and background images for specific pages    */
/*----------------------------------------------------------------------------*/

div#content {
	width: 940px;
	height: 490px;
}
body#welcomePage div#content {
	background: #dbd8b5 url(images/content-bg.jpg);
}
body#aboutPage div#content {
	background: #dbd8b5 url(images/about-content-bg.jpg);
}
body#peoplePage div#content {
	background: #dbd8b5 url(images/people-content-bg.jpg);
}
body#peoplePage1 div#content {
	background: #dbd8b5 url(images/people-content1-bg.jpg);
}
body#careersPage div#content {
	background: #dbd8b5 url(images/careers-content-bg.jpg);
}
body#contactPage div#content {
	background: #dbd8b5 url(images/contact-content-bg.jpg);
}
body#workPage div#content {
	background: #dbd8b5 url(images/work-content-bg.jpg);
}
body#awardsPage div#content {
	background: #dbd8b5 url(images/awards-content-bg.jpg);
}
div#workContent {
	background: #dbd8b5 url(images/work-display-content-bg.jpg);
	width: 940px;
	height: 490px;
}
div#content a {
	color: #383636;
	text-decoration: none;
}
div#content a:hover {
	color: #ca2a2a;
}


/*--------------------------- Home Page ---------------------------------------*/

body#welcomePage div#award {
	width: 195px;
	height: 65px;
	background: transparent url(images/addy-bg.gif);
	position: absolute;
	top:20px;
	left: 705px;
	font-size: 1.2em;
}
body#welcomePage div#award span {
	display: block;
}
div#award p { 
	padding-left: 10px; 
	padding-top: 10px;
}

div#welcome {
	padding: 20px;
	width: 777px;
	height: 331px;
	background: transparent url(images/welcome-bg.jpg) no-repeat;
	position: absolute;
	left: 60px;
	top: 100px;
}

div#welcomenew {
	padding: 20px;
	width: 777px;
	height: 331px;
	background: transparent url(images/welcome-bg-anim.gif) no-repeat;
	position: absolute;
	left: 60px;
	top:120px;
}


div#welcome p {
	width: 600px;
	margin-top: 20px;
}

div#homeheader p {
	color: black;
	font-weight: bold;
	font-size: 1.1em;
	line-height: 1.4em;
}



div#homeheader {
	position:absolute;
	left:80px;
	top:20px;
	width:530px;
	height:200px;
	
}
div#homeheader h1 {
	color: #252726;
	font-weight: bold;
	font-size: 2em;
	margin-bottom:8px;
}
div#homeheader h1 span {
	color: #cd2a2b;
}




/*--------------------------- Awards Page ---------------------------------------*/

body#awardsPage div#awardImages {
	position: absolute;
	top: 160px;
	left: 89px;
	width: 780px;
	height: 260px;
}

body#awardsPage div#awardImages p {
	margin-left: 330px;
	margin-top: 20px;
}
body#awardsPage p#clickMe {
	position: absolute;
	top: 418px;
	left: 400px;
	color: gray;
}

body#awardsPage div#awardImages img {
	margin-left: 18px;
}
body#awardsPage div#awardText {
	position: absolute;
	top:  30px;
	left: 60px;
	width: 820px;
	height: 150px;
	font-size: 1.2em;
	line-height: 1.3em;
}
body#awardsPage h1 {
	margin-bottom: 15px;
	font-weight: bold;
	font-size: 1.3em;
}
body#awardsPage h1 span {
	color: #ca2a2a;
}

/*--------------------------- Work Page ---------------------------------------*/

body#workPage p#awards {
	position: absolute;
	top: 458px;
	left: 68px;
}
body#workPage p#awards a {
	color: #ca2a2a;
	font-weight: bold;
	font-size: 1.2em;
}

/* attributes for all workLinks */

div.workLink {
	width: 360px;
	height: 95px;
	background: transparent;
	border: 3px solid #eeeddb;
	overflow: hidden;
}
div.workLink img {
	position: absolute;
	top: 0px;
	left: 227px;
	border-left: 3px solid #eeeddb;
}
div.workLink p {
	width: 220px;
	margin-top: 5px;
	margin-left: 8px;
	font-weight: bold;
}
div.workLink h1 {
	width: 210px;
	font-weight: bold;
	font-size: 1.3em;
	margin-top: 4px;
	margin-left: 8px;
}

/* specific positions for each one by ID */

div#workLink1 {
	position: absolute;
	left: 67px;
	top: 22px;
}
div#workLink2 {
	position: absolute;
	left: 467px;
	top: 22px;
}
div#workLink3 {
	position: absolute;
	left: 67px;
	top: 130px;
}

div#workLink4 {
	position: absolute;
	left: 467px;
	top: 130px;
}

div#workLink5 {
	position: absolute;
	left: 67px;
	top: 238px;
}

div#workLink6 {
	position: absolute;
	left: 467px;
	top: 238px;
}

div#workLink7 {
	position: absolute;
	left: 67px;
	top: 347px;
}

div#workLink8 {
	position: absolute;
	left: 467px;
	top: 347px;
}

#workContent #thumbs img {
	padding: 3px;
}


/*
	for updates to work page (modal image display)
*/
.hiddenfancy{display:none;}
#zoom{z-index:10001;}


/*--------------------------- About Page ---------------------------------------*/

div#aboutPunch {
	position: absolute;
	top: 45px;
	left: 75px;
}
div#aboutPunch p {
	width: 780px;
	margin-bottom: 20px;
	font-size: 1.1em;
	font-weight: bold;
	/* line-height: 1.4em; */
}
div#aboutPunch p em {
	font-weight: bold;
	font-style: italic;
}
div#aboutPunch a {
	color: #ca2a2a;
	font-weight: bold;
}


/*--------------------------- People Page ---------------------------------------*/

body#peoplePage div h1 {
	margin-bottom: 10px;
	font-weight: bold;
	font-size: 1.3em;
}
body#peoplePage1 div h1 {
	margin-bottom: 10px;
	font-weight: bold;
	font-size: 1.3em;
}
body#peoplePage div h1 span {
	font-style: italic;
}
body#peoplePage1 div h1 span {
	font-style: italic;
}
body#peoplePage div p {
	width: 650px;
	margin-bottom: 20px;
	font-size: 1.1em;
	line-height: 1.2em;
}
body#peoplePage1 div p {
	width: 650px;
	margin-bottom: 20px;
	font-size: 1.1em;
	line-height: 1.2em;
}

/* coordinates for top and bottom bios and photos */

div.topBio {
	position: absolute;
	top: 18px;
	left: 80px; 
}
img.topPic {
	position: absolute;
	top: 28px;
	left: 752px;
}
div.bottomBio {
	position: absolute;
	top: 248px;
	left: 80px; 
}
img.bottomPic {
	position: absolute;
	top: 252px;
	left: 752px;
}

a#backPeople {
	font-weight: bold;
	color: red !important;
	position: absolute;
	left: 780px;
	top: 390px;
}
a#morePeople {
	font-weight: bold;
	color: red !important;
	position: absolute;
	left: 780px;
	top: 420px;
}

a#moreWork {
	font-weight: bold;
	color: red !important;
	position: absolute;
	left: 780px;
	top: 458px;
}

/*--------------------------- Contact Page ---------------------------------------*/

body#contactPage p#contactText {
	position: absolute;
	left: 240px;
	top: 122px;
	width: 280px;
	height: 100px;
	color: #ca2a2a;
	font-weight: bold;
	font-size: 1.4em;
	line-height: 1.3em;
}

div#contactInfo {
	position: absolute;
	top: 90px;
	left: 600px;
	width: 262px;
	height: 168px;
	font-weight: bold;
	font-size: 1.2em;
}
div#contactInfo span {
	display: block;
}
div#contactInfo a#emailAddress {
	display: block;
	color: gray;
	margin-top: 10px;
	margin-bottom: 10px;
}

/*--------------------------- Careers Page ---------------------------------------*/

body#careersPage p#errorMessage {
	position: absolute;
	top: 14px;
	left: 64px;
	color: red;
	font-weight: bold;
	margin-bottom: -5px !important;
}

body#careersSentPage {
	background: url(images/careers-sent-bg.jpg);
}

body#careersSentPage div#thankYou {
	font-weight: bold;
	text-align: center;
	font-style: italic;
	font-size: 120%;
	position: absolute;
	top: 200px;
	left: 220px;
}

body#careersPage form#careersForm {
	background: transparent;
	position: absolute;
	top: 37px;
	left: 70px;
	width: 800px;
	height: 400px;
}

body#careersPage p {
	margin-top: 15px;
	font-size: 15px;
}

body#careersPage p#requiredNote {
	margin-top: 15px;
	font-size: 15px;
	position: absolute;
	top: 370px;
	left: 0px;
}
body#careersPage span {
	color: #ca2a2a;
	font-weight: bold;
}
body#careersPage form#careersForm p.first {
	font-weight: bold;
}
body#careersPage form#careersForm li {
	font-size: 1.1em;
	margin-top: 10px;
}
body#careersPage input {
	background-color: #eaead8 !important;
	height: 20px;
}
body#careersPage textarea {
	background-color: #eaead8 !important;
}
body#careersPage textarea#dreamjob {
	display: block;
}

body#careersPage input#name {
	width: 540px;
}
body#careersPage input#position {
	width: 444px;
}
body#careersPage input#email {
	width: 486px;
}
body#careersPage input#portfolio {
	width: 436px;
}
body#careersPage input#linkedin {
	width: 374px;
}
body#careersPage textarea {
	width: 594px;
	margin-top: 8px;
}
body#careersPage #submitButton {
	position: absolute;
	top: 322px;
	left: 670px;
	width: 5em;
	background-color: #dad7b4 !important;
	color: red;
	font-weight: bold;
}

/*--------------------------- Work Display Pages -----------------------------------*/

div#workDescription {
	position: absolute;
	top: 15px;
	left: 50px;
	width: 710px;
	height: 410px;
}
div#workDescription h1 {
	font-size: 1.2em;
	font-weight: bold;
	margin-bottom: 10px;
}
div#workDescription h2 {
	font-weight: bold;
}
div#workDescription p {
	margin-bottom: 10px;
}

div#workContent div#thumbs {
	position: absolute;
	top: 360px;
	left: 50px;
	height: 110px;
}
div#workContent div#thumbs img {
	margin-right: 2px;
}
div#workContent div#preview {
	position: absolute;
	top: 15px;
	left: 520px;
	width: 342px;
	height: 360px;
	/* border: 1px solid black; */
	
	display:none;/* new modal image display doesn't need this element */
}
div#workContent div#preview img {
	margin-left: auto;
	margin-right: auto;
	display: block;
	margin-bottom: 10px;
}
div#workContent div#preview a#fullLink {
	margin-left: 10px;
	display: block;
	margin-left: auto;
	margin-right: auto;
	border: 1px solid red;
}

div#workContent div#preview a {
	position: absolute;
	display: block;
	text-decoration: none;
	color: #5e5c5c;
}
div#workContent div#preview a#clickToEnlarge {
	top: 350px;
	left: 120px;
}
div#workContent div#preview a#clickNext {
	top: 350px;
	left: 265px;
}
div#workContent div#preview a#clickPrev {
	top: 350px;
	left: 40px;
}

div#preview a#fullSizeLink {
	width: 100%;
	display: block;
}

/*--------------------------- Navigation Menu -------------------------------------*/

div#menu {
	background: #c9c588 url(images/menu-bg.jpg) repeat-x;
	height: 100px;
	width: 940px;
	margin: 0 auto;
	position: relative;
	z-index:1000;
	
}

div#menu span#companyName {
	display: block;
	float: left;
	padding-left: 60px;
	color: #ca2a2a;
	font-size: 16px;
}
div#menu span.big {
	font-size: 400%;
	font-weight: bold;
	color: #ca2a2a;
}

div#menu ul {
	/*
	padding-top: 50px;
	margin-left: 20px;
	margin-right: 10px;
	padding-left: 180px;
	*/
	position: absolute;
	top: 48px;
	left: 450px;
	color: white;
}
div#menu ul li {
	color: #d0c9c9;
	display: inline;
	list-style-type: none;
	font-size: 14px;
	padding-left: 25px;
}
 
div#menu a, div#menu a:visited, div#menu a:hover, div#menu a:active {
	text-decoration: none !important;
	color: #d0c9c9;
	border: none;
}
div#menu a:hover {
	border: none;
	color: #ca2a2a;
}

body#welcomePage a#homePage, 
body#aboutPage a#aboutPage, 
body#workPage a#workPage, 
body#peoplePage a#peoplePage, 
body#careersPage a#careersPage, 
body#contactPage a#contactPage
{
	color: #ca2a2a;
}

div#menu a {
	outline: none;
}
:focus {
  -moz-outline-style: none;
}