@charset "UTF-8";
@import url(reset.css);

/**
 * Default font-settings
 */
body {
	line-height: 1.5em; 
	color: #535353;
}

/**
 * Element styles
 */
p {
	margin-bottom: 16px;
}

a { 
	color: #535353;
	text-decoration: underline;
}

h4 {
	font-weight: bold;
	font-size: 108%;
}


input.text,
textarea {
    border: 1px solid #CCCCCC;
    padding: 2px;
	background: white url(/js/ext/resources/images/default/form/text-bg.gif);
	background-repeat: repeat-x;
}

input.text.invalid,
.x-form-field.invalid {
	background-color: #FFDEDE;
	background:  #FFDEDE url(/img/form-text-bg-error.png) repeat-x scroll top left;
}

input[type=text],  input[type=password], textarea {
	-moz-border-radius: 4px 4px 4px 4px;
    -webkit-border-top-right-radius: 4px;
    -webkit-border-top-left-radius: 4px;
    -webkit-border-bottom-left-radius: 4px;
    -webkit-border-bottom-right-radius: 4px;
    border-radius: 4px;	
 }


input[type=text]:focus,
textarea:focus {
	outline-style:none;
	border: 1px solid #999999;
}

.ext-combo-div {
	margin-bottom: 12px;
	float: left;
}

.ext-ie .ext-combo-div {
	margin-bottom: 0;
}

input.ext-combo {
    -moz-border-radius: 4px 0px 0px 4px;
    -webkit-border-top-right-radius: 0px;
    -webkit-border-bottom-right-radius: 0px;
    border-radius: 4px 0px 0px 4x;
    padding: 1px 3px /* needed this to work with IE */
}

input.ext-form-text {
	padding: 0px;
}

/**
 * Layout regions
 */
#wrapper {
	width: 900px;
	margin: 0; /* auto; */	
	position: relative;
}

#header {
	height: 58px;
	background-color: #339933;
	background-image: url(/img/dots.png);
	background-repeat: no-repeat;
	background-position: 3px 42px;
	margin-bottom: 2px;
	margin-left: 121px;
}

#nav {
	width: 118px;
	float: left;
}

#content {
	margin: 0px 0px 2px 121px;
	width: 758px;
}

#footer {
	clear: both;
	padding-top: 16px;
	margin-left: 120px;
	padding-right: 22px;
	color: #CACACA;
	text-align: center;
	font-size: 85%;
}



/**
 * Navigation Classes
 **/
.navinset {
	position: absolute;
	top: 264px;
	width: 121px;
	height: 88px;
	background: transparent url(/img/inset-sprite.jpg) no-repeat scroll top right;
}

.navinset.capabilities {
	background-position: right -88px;
}
.navinset.education {
	background-position: right -176px;
}
.navinset.sustain {
	background-position: right -264px;
}
.navinset.contact {
	background-position: right -352px;
}
.navinset.uploads {
	background-position: right -528px;
}
.navinset.mysexton {
	background-position: right -1320px;
}
.navinset.about {
	background-position: right -1408px;
}

.navcontainer {
	width: 118px;
	text-align: right;
	margin-top: 16px;
}

.navitem {
	line-height: 20px;
	/*margin: 2px 0px;*/
}

.navitem a {
	color: #878787;
	text-decoration: none;
	display: block;
	padding-right:13px;
	/*background: white url(/img/navitembg.png) no-repeat scroll bottom right;*/
}

.navitem a:hover,
.navitem a.active {
	font-size: 120%;
	font-weight: bold;
}

.navitem.index a:hover,
.navitem.index a.active {
	color: #006600;
	background-position: right 0px;
}

.navitem.capabilities a:hover,
.navitem.capabilities a.active {
	color: #333399;
	background-position: right -20px;
}

.navitem.education a:hover,
.navitem.education a.active {
	color: #CC0033;
	background-position: right -40px;
}

.navitem.contact a:hover,
.navitem.contact a.active {
	color: #993300;
	background-position: right -60px;
}

.navitem.about a:hover,
.navitem.about a.active {
	color: #663366;
	background-position: right -80px;
}

.navitem.uploads a:hover,
.navitem.uploads a.active {
	color: #CC9900;
	background-position: right -100px;
}

.navitem.mysexton a:hover,
.navitem.mysexton a.active {
	color: #66cccc;
	background-position: right -120px;
}



/**
 * Sub Navigation Classes
 **/
.subnav {
	float: left;
	width: 100%;
}

.subnav li {
	float: left;
}

.subnav a {
	display: block;
	padding: 1px 6px;
	color: white;
	background-color: #cccccc;
	border-right: 3px solid white;
	text-decoration: none;
}

.subnav .design a:hover,
.subnav .design a.active {
	background-color: #0099ff;
}
 
.subnav .webservices a:hover,
.subnav .webservices a.active {
	background-color: #66cccc;
}

.subnav .print a:hover,
.subnav .print a.active {
	background-color: #FFCC00;
}

.subnav .digitalprint a:hover,
.subnav .digitalprint a.active {
	background-color: #6699cc;
}

.subnav .fulfillment a:hover,
.subnav .fulfillment a.active {
	background-color: #00CC99;
}

.subnav .support a:hover,
.subnav .support a.active {
	background-color: #9966cc;
}

.subnav .sustainability a:hover,
.subnav .sustainability a.active {
	background-color: #99cc00;
}

/* --- account --- */
.subnav .logout a:hover,
.subnav .logout a.active {
	background-color: #cc6666;
}



 
/**
 * Container Classes / Boxes
 **/
.content-box {
	border: 1px solid #CCCCCC;
}

.dashboard-content .content-box {
	min-height: 400px;
}

.box-strip {
	margin-top: 8px;
	overflow: auto;
}

.box, .right-box {
	float: left;
	margin-right: 8px;
	overflow: hidden;
	border: 1px solid #CCCCCC;
}

.right-box {
	margin: 0;
}

.box p,
.right-box p  {
	font-size: 88%;
	margin-bottom: 0px;
}



#about-box {
	padding: 18px;
}

	#about-box em {
		color: #66cccc;
		font-weight: bold;
		font-size: 112%
	}
	
	
#update-box {
	width: 519px; /* subtract padding and border*/
	min-height: 116px; /* subtract padding and border */
	padding: 18px;
}

#etrends-signup-box {
	background: transparent url(/img/education/pda.jpg) no-repeat scroll bottom right;
	height: 120px;
	width: 450px;
}
	
	form#etrends-subscribe-form {
		font-size: 85%;	
		margin-top: 4px;
	}
		#etrends-subscribe-form table {
			white-space: nowrap;
		}
		
		#etrends-subscribe-form td {
			padding: 5px 0px;
			vertical-align: middle;
		}
		form#etrends-subscribe-form label {
			padding-right: 10px;
		}
		form#etrends-subscribe-form input.text {
			width: 160px;
		}

#trends-signup-box {
	background: transparent url(/img/education/mailbox.jpg) no-repeat scroll 125px bottom;
	height: 120px;
	width: 296px;
	overflow: hidden;
}
	form#trends-form,
	#trends-signup-box #ttsub-button {
		font-size: 85%;
	}
	
	#trends-signup-box p {
		margin-bottom: 8px;
	}
	
	#trends-signup-box dd {
		padding: 5px 0px;
		overflow: auto;
		clear: both;
	}
	#trends-signup-box  input.text, 
	#trends-signup-box select {
		width:170px;
		float: left;
	}
	
	#trends-signup-box  label {
		display:block;
		float:left;
		margin:0px 12px 0px 0px;
		text-align:right;
		width:60px;
	}
	
#integrity-box {
	height: 152px;
	width: 191px;
	background-color: #66cccc;
	border-color: #66cccc;
}

#edu-galleries-box {
	height: 156px;
	width: 756px;	
	background: transparent url(/img/education/microphone.jpg) no-repeat scroll top left;
}

	#edu-galleries-box dl {
		font-size: 88%;
		line-height:16px;
		margin-top: 24px;
		float: left;
	}
	
	#edu-galleries-box dl.seminars {
		margin-left: 180px;
	}
	#edu-galleries-box dl.pubs {
		margin-left: 78px;
	}
	#edu-galleries-box dt {
		color: #000099;
	}
	#edu-galleries-box dl a {
		text-decoration: none;
	}
	#edu-galleries-box dl a:hover {
		text-decoration: underline;
	}

#contact-contact-box {
	background-color: #E7E7E7;
	border: none;
	width: 374px;
	height: 351px;
	margin:0;
	overflow: hidden;
}
	
	#contact-form  .button{
		font-size: 85%
	}

	#contact-contact-box dd {
		padding: 5px 0px;
		overflow: auto;
		clear: both;
	}
	#contact-contact-box  input.text {
		width:230px;
		float: left;
	}
	#contact-contact-box  textarea {
		width: 228px;
	}
	
	#contact-contact-box  label {
		display:block;
		float:left;
		margin:0px 12px 0px 0px;
		text-align:right;
		width:75px;
	}	




#upload-chart-box {
	background: #c5f6f6 url(/img/uploads/sidebar.png) no-repeat scroll right bottom;
	width: 216px;
	height: 380px;
	line-height: 1.2em;
	border-color: white;
}

	#upload-chart-box dt {
		padding:14px;
		margin-bottom: 14px;
		background-color:#95E0E0;
		border-bottom: 2px solid white;
	}
	
	#upload-chart-box dd {
		font-size: 88%;
		line-height: 1.2em;
		padding: 0px 14px;
	}


#upload-upload-box {
	background-color: #E7E7E7;
	border-color: #e7e7e7;
	width: 530px;
	height: 380px;
	margin:0;
	position: relative; /* needed for IE because of scrolling view */
}

#partner-logos {
	position: absolute;
	width: 170px;
}

#partner-logos dt {
	position: relative;
	left: 500px;
	top: -12px;
	font-weight: bold;
	text-align: center;
	font-size: 12px;
	line-height: 2em;
	padding-right: 5px;
	
}

#partner-logos dd
{
	position: relative;
	top: -12px;
	left: 500px;
	height:70px;
	background: transparent url(/img/education/logostrip.png) no-repeat scroll 0px 0px;
}

#partner-logos dd div {
	height:70px;
	background: transparent url(/img/education/logostrip.png) no-repeat scroll 0px -70px;
	
}


/**
 * Inline styles
 */
a.more {
	color: #535353;
	text-decoration: underline;
}

.bulleted-list li {
	list-style-type: disc;
	margin: 8px 0px;
}

.headline {
	font-weight: bold;
	color: #000099;
}


.strip-box {
	margin-right: 8px;
	float: left;
	height: 110px;
	width: 220px;
	background: transparent none no-repeat scroll bottom left;
}


.story-block {
	padding: 16px 32px 0px 16px;	
}




.home-splash img.hidden {
	display: none;	
}

/*.box-container {
	overflow: auto;
	clear: both;
	margin-top: 8px;
}

.box-container .box-wrap {
	float: left;	
}


.box-container .box {
	border: 1px solid #cccccc;
}

.box-container .box-pad {
	margin-right: 8px
}

#update-box {
	width: 555px;
}

#integrity-box {
	background: #CCCCCC url(/img/integrity.png) no-repeat scroll bottom left;
	margin-top: 12px;
	margin-left: 8px;
	width: 191px;
	height: 148px;
}*/

.promos {
	clear: left;
	margin-top: 8px;
	height: 146px;
	overflow: auto;
	background-color: yellow;
}

.promo-first {
	float: left;	
}

.promo {
	float: left;
	margin-left: 8px;
	height: 130px;
}

.home-casestudies-promo {
	width: 216px;
	height: 131px;
}

.home-ideas-promo {
	margin-top: 14px;
	height: 130px;
	width: 330px
}
.home-integrity-promo {
	margin-top: 14px;
	height: 131px;
	width: 192px;
	background-color: silver;
}









.update-header {
	background-color: #66CCFF;
	color: #FFFFFF;
	padding: 16px;
	font-size: 140%;
}

.contact-header {
	background-color: #CCFFFF;
	color: #000000;
	padding: 10px;
	font-size: 113%;
}

.contact-google-box {
	background: white url(/img/contact/map.png) no-repeat scroll left -2px;
	width: 376px;
	height: 370px;
}

.contact-google-box a {
	color: #336699;
	text-decoration: none;
}



.dl-block {
	border-bottom: 1px solid #cacaca;
	margin: 0px 30px;
	padding-top: 20px;
}

.dl-thumb{
	float: left;
	text-align: center;
}

.dl-thumb img {
	margin-bottom: 15px;	
}

.dl-description {
	margin-left: 135px;
	min-height: 135px;
}

.dl-short-description {
	margin-left: 135px;
	min-height: 85px;
}

.dl-description dt {
	color: #006699;
	font-size: 116%;
	font-weight: bold;
	margin-bottom: 10px;
}

.dl-description dd {
	line-height: 1.3em;
}

.dashboard {
	width: 690px;
	margin: 10px 30px;	
}

.dash-item {
	padding: 20px 0px;
	border-bottom: 1px solid #CACACA;
	border-bottom: 1px solid #CACACA;
}

.dash-item-title {
	vertical-align: middle;
	text-align: center;
	width: 150px;
	font-size: 108%;
	color: #333399;
	font-weight: bold;
}

.dash-item-description {
	text-align: left;
	font-size: 85%;
	line-height: 1.25em;
}

ul.quicklinks {
	width: 220px;
	float: left;
	margin-right: 20px;
	line-height: 1.6em;
}

/**
 * A utility frame for downloading stuff
 */
#blackhole {
	width: 1px;
	height: 1px;
	position: absolute;
	top: -10px;
	left: -10px;
}


/**
 * Login
 **/
.login-block {
	overflow: auto;
	width: 390px;
	margin-left: 200px;
	font-size: 85%;
	margin-bottom: 90px;
}



.login-block h3 {
	font-size: 122%;
	font-weight: bold;
}

.login-block li {
	padding-left: 30px;
	margin-bottom: 8px;
	text-align: left;
}

.login-block label {
	display: block;
	float: left;
	width: 100px;
	text-align: right;
	margin-right: 6px;
}

.login-block input.text {
	width: 150px;
}

.login-block .error {
	text-align: left;
	font-size: 12px;
	background: #FBE3E4 url(/img/stop_24.png) no-repeat scroll 5px center;
	border: 1px solid #c40808;
	color: #c40808;
	padding: 8px 5px 8px 34px;
   	-moz-border-radius: 5px ;
	-webkit-border-top-right-radius: 5px;
	-webkit-border-top-left-radius: 5px;
	-webkit-border-bottom-left-radius: 5px;
	-webkit-border-bottom-right-radius: 5px;
}

.login-block .success {
	text-align: left;
	font-size: 12px;
	background: #FBE3E4 url(/img/stop_24.png) no-repeat scroll 5px center;
	border: 1px solid #c40808;
	color: #c40808;
	padding: 8px 5px 8px 34px;
   	-moz-border-radius: 5px ;
	-webkit-border-top-right-radius: 5px;
	-webkit-border-top-left-radius: 5px;
	-webkit-border-bottom-left-radius: 5px;
	-webkit-border-bottom-right-radius: 5px;
}


/**
 * Upload Styles
 */
.progressWrapper {
	height: 64px;
	overflow: hidden;
	position: relative;
	
}

.progressFileIcon {
	width: 32px;
	height: 32px;
	background: transparent url(/img/uploads/file_generic.png) no-repeat scroll center center;	
	position: absolute;
	top: 16px;
	left: 16px;
}

.progressFileIcon.gif {
	background-image: url(/img/uploads/file_gif.png)		
}
.progressFileIcon.jpg,.progressFileIcon.jpeg {
	background-image: url(/img/uploads/file_jpg.png)	
}
.progressFileIcon.tif,.progressFileIcon.tiff {
	background-image: url(/img/uploads/file_tiff.png)	
}
.progressFileIcon.png {
	background-image: url(/img/uploads/file_png.png)		
}
.progressFileIcon.pdf {
	background-image: url(/img/uploads/file_pdf.png)	
}
.progressFileIcon.bmp {
	background-image: url(/img/uploads/file_bmp.png)	
}
.progressFileIcon.psd {
	background-image: url(/img/uploads/file_psd.png)	
}

.progressBarStatus{
	position: absolute;
	top: 32px;
	left: 64px;
	font-size: 11px;
}

.progressName {
	position: absolute;
	top: 18px;
	left: 64px;
	white-space: nowrap;
	width: auto;
	line-height: 1em;
	color: black;
	font-size: 12px;
}

.progressBar {
	position: absolute;
	top: 30px;
	height: 9px;
	#width: 370px;
	overflow: hidden;
	left: 64px;
	background-color: silver;
	right: 64px;
	border: 1px inset #eeeeee;
	-moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-top-right-radius: 5px;
    -webkit-border-top-left-radius: 5px;
    -webkit-border-bottom-left-radius: 5px;
    -webkit-border-bottom-right-radius: 5px;
	border-radius: 5px 5px 5px 5px;	
}

.progressQueued .progressBar,
.progressComplete .progressBar {
	display: none;
}

.progressRunning .progressBar {
	display: block;
}

.progressRunning .progressName {
	top: 13px;	
}

.progressRunning .progressBarStatus {
	top: 39px;	
}


.progressBarInProgress {
	height: 9px;
	background: #509634 url(/img/uploads/progress.png) repeat-x scroll top left;
	width: 0%;
	-moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-top-right-radius: 5px;
    -webkit-border-top-left-radius: 5px;
    -webkit-border-bottom-left-radius: 5px;
    -webkit-border-bottom-right-radius: 5px;
	border-radius: 5px 5px 5px 5px;	
}

.progressAction {
	width: 16px;
	height: 16px;
	position: absolute;
	background: transparent url(/img/uploads/shared_single.png) no-repeat scroll 100px 100px;
	right: 16px;
	top: 26px;
}

.progressQueued .progressAction,
.progressRunning .progressAction {
	background-position: -32px -1056px
}

.progressComplete .progressAction {
	background-position: -32px -1024px;
}



.upload-button-box {
	margin-top: 8px;
	width: 100%;
}
    .upload-button-box #leftButtons {
        width: 25%;
    }
	
    .upload-button-box #middleButtons {
        width: 50%;
    }
	
    .upload-button-box #middleButtons #SWFUpload_0  {
       float: left;
        margin-left: 65px;
    }
   
   .upload-button-box #middleButtons #x-upload-clear-button {
       float: left;
        margin-left: 5px;
    }
	
	.upload-button-box #rightButtons .x-btn-wrap {
	    width: 25%;
		float: right;
	}

.scrollView {
	overflow-y: auto;	
	height: 290px; /*total container is 380px; header 24px; border:1px buttons: 48px (380-(24+48+2)=334 */
	border: 1px solid #C0C0C0;
	position:relative;  /*needed for all IE, doesn't matter for W3C */
}

#fsUploadProgress {
	background: transparent url(/img/uploads/progressbox_bg.png) repeat scroll 0 0;
	min-height: 290px; /*total container is 380px; header 24px; border:1px buttons: 48px (380-(24+48+2)=334 */
	
}

#upload-form label {
	clear: left; 
	display: block; 
	float: left; 
	width: 75px; 
	text-align:right; 
	margin: 0px 12px 12px 3px;
}

#upload-form input.text,
#upload-form select,
#upload-form textarea {
	margin-bottom: 10px;
	width: 260px;	
}


#upload-form li {
	clear: left;
}