


.hideSmall{
	display: none;
}

.showSmall {
	visibility: visible !important;
}


.centralContent{
	margin-top: 8px !important;
	margin-right: 8px !important;
	margin-left: 8px !important;
	border-width: 2px !important;
}


.toggleMenu {
	display:  none;
	background: #9E0000;
	padding: 10px;
	margin: 0px;
	color: #fff;
}

.navMenuIcon {
	width: 28px;
	height: 28px;
}



@media only screen and (orientation:landscape){

	html {
	    -webkit-text-size-adjust: 100%;
	    -ms-text-size-adjust: 100%;
	}
}





.topLogo {
	float: right;
	margin-right: 15px;	/* logo right margin */
	margin-top: 0px;
	margin-bottom: 0px;
}

/* logo width */
.topLogoMain {
	width: 120px;
	height: 51px;
}



#inLineImg {
	margin-right: 5%;
	margin-top: 5pt;
	margin-bottom: 5px;
}


#inLineImgR {
	float: right;
	margin-left: 5%;
	margin-top: 5pt;
	margin-bottom: 5px;
}

#inLineImgL {
	float: left;
	margin-right: 5%;
	margin-top: 5pt;
	margin-bottom: 5px;
}


.contactProjDetails{
	clear: left;
	width: 64% !important;
}





/* Mobile menu styles */

.container {
	/* margin for top nav menu icon */
	margin: 3px 20px;
}


.nav {
	font-size: 14pt;
	line-height: 18pt;
}


.nav a {
    padding: 12px 15px;
}


.nav > li > .parent {
	width: 240px;	/* menu width */
}



#pageMain #insideLogoAreas {
	/* logo and areas only hidden on main page */
	display: none;
}



#insideAreas {
	margin-top: 5px;
	float: right;
	text-align: right;
	margin-top: 0px;
	margin-right:20px; /* right margin for "Graphic & Web Design, Technology Development, Strategic Consulting */
	margin-bottom: 0px; /* spacing underneath "Graphic & Web Design, Technology Development, Strategic Consulting */

	font-size: 11pt;
	line-height: 22pt;
	/* color: #CCCCCC; */
}


#beginInsideRows {
	clear: right;
}











.redBoxMain {
	margin: 0px 20px;
	margin-bottom: 40px;
	padding: 20px;
	background-color: #C50101;
}

.redBoxMain a {
	color: #ffffff;
	font-size: 13pt;	/* link size in main page red box */
	line-height: 16pt;
}

.manLineBottom {
	margin-bottom: 20px;	/* spacing between links in main page red box */
}



.mainFlower {
	width: 70%;
}





.mainNextArrow {
	float: right !important;
	width: 32px;
	height: 32px;

	padding: 0px;
	margin: 0px;
}



.footer {
	margin: 20px; 0px;

	font-size: 12pt;
	color: #666;
	text-align: center;
	max-width: none;
}



.drivingDirectionsMap{
	width: 97%;
	border-style: solid;
	border-color: #C0C0C0;
	border-width: 5px;
}

.drivingDirections{
	clear: both;
	margin-top: 30px;
}




/* rule */

.contentInside #contentColumn, .contentContact #contentColumn {
	background: url(../images/bg_inside20.gif) repeat-x;
	border-bottom: solid 20px #990016;	/* width of bottom rule */
}

.contentAbout #contentColumn, .contentContact #contentColumn {
	background: url(../images/bg_about20.gif) repeat-x;
	border-bottom: solid 20px #990016;	/* width of bottom rule */
}

.contentDesign #contentColumn, .contentContact #contentColumn {
	background: url(../images/bg_design20.gif) repeat-x;
	border-bottom: solid 20px #6D6E65;	/* width of bottom rule */
}


#pageDesign .contentDesign2 #contentColumn, .contentContact #contentColumn {
	background: url(../images/bg_design20.gif) repeat-x;
	border-bottom: solid 20px #6D6E65;	/* width of bottom rule */
}


.contentTech #contentColumn, .contentContact #contentColumn {
	background: url(../images/bg_tech20.gif) repeat-x; 
	border-bottom: solid 20px #111c24;
}


.contentStrategy #contentColumn, .contentContact #contentColumn {
	background: url(../images/bg_strategy20.gif) repeat-x; 
	border-bottom: solid 20px #002664;
}




.thumbnailColumn {
	margin-bottom: 30px;
}





/* rule backgrounds */

#contentColumn{ 
		/* border-style: solid; border-color: #C0C0C0; border-width: 1px; */
	margin: 0px;
	margin-bottom: 3em; 
	padding: 0 15px 5em 20px;	/* width of main content area */
	font-size: 11pt; 	/* main content font size */
	line-height: 15pt;

}




/* arrow */

#nextArrow {
	float: right;
	margin-right: 0px !important;
}


/* not needed anymore
.contentInside #nextArrow {
	margin-top: 5px;
	background: url(../images/next_inside_ani.png) no-repeat; background-position: top right;
	background-size: 32px 32px;
}

.contentInside #nextArrow:hover {
	background: url(../images/next_inside_over.png) no-repeat; background-position: top right;
	background-size: 32px 32px;
}



.contentAbout #nextArrow {
	margin-top: 5px;
	background: url(../images/next_inside_ani.png) no-repeat; background-position: top right;
	background-size: 32px 32px;
}

.contentAbout #nextArrow:hover {
	background: url(../images/next_inside_over.png) no-repeat; background-position: top right;
	background-size: 32px 32px;
}


.contentDesign #nextArrow {
	margin-top: 5px;
	background: url(../images/next_design_ani.png) no-repeat; background-position: top right;
	background-size: 32px 32px;
}

.contentDesign #nextArrow:hover {
	background: url(../images/next_design_over.png) no-repeat; background-position: top right;
	background-size: 32px 32px;
}



.contentDesign2 #nextArrow {
	margin-top: 5px;
	background: url(../images/next_design_ani.png) no-repeat; background-position: top right;
	background-size: 32px 32px;
}

.contentDesign2 #nextArrow:hover {
	background: url(../images/next_design_over.png) no-repeat; background-position: top right;
	background-size: 32px 32px;
}


.contentTech #nextArrow {
	margin-top: 5px;
	background: url(../images/next_tech_ani.png) no-repeat; background-position: top right;
	background-size: 32px 32px;
}

.contentTech #nextArrow:hover {
	background: url(../images/next_tech_over.png) no-repeat; background-position: top right;
	background-size: 32px 32px;
}



.contentStrategy #nextArrow {
	margin-top: 5px;
	background: url(../images/next_strategy_ani.png) no-repeat; background-position: top right;
	background-size: 32px 32px;
}

.contentStrategy #nextArrow:hover {
	background: url(../images/next_strategy_over.png) no-repeat; background-position: top right;
	background-size: 32px 32px;
}





/* background color for inside pages */

#pagePortfolio #contentWrapper {
	color: #ffffff;
	background: url(../images/bkgnd_inside_pagePortfolioGWD.gif) repeat-x;
	background-position: 0px 31px;
}
*/





/* text styles */

h1 {
	color: #ffffff !important;
	font-size: 10pt !important;
	text-transform: uppercase !important;
	font-weight: normal !important;
	font-family: "Helvetica Bold", "Helvetica", helvetica, arial, sans-serif !important; 
	padding: 9pt 0 10pt 0 !important;
	margin: 0 !important;
}


#h1 {
	color: #ffffff !important;
	font-size: 10pt !important;
	text-transform: uppercase !important;
	font-weight: normal !important;
	font-family: "Helvetica Bold", "Helvetica", helvetica, arial, sans-serif !important; 
	padding: 9pt 0 10pt 0 !important;
	margin: 0 !important;
}



h2 {
	font-size: 12pt;
	line-height: 14pt;
	color: #666666;

	text-decoration: none;
	text-transform: uppercase;
	font-weight: bold;

	padding: 0px;
	margin-bottom: 10pt;
	margin-top: 40px;
}



h3 {
	font-size: 14pt;
	line-height: 20pt;
	font-weight: bold;
}

h4 {
	font-size: 14pt;
	line-height: 20pt;
	font-weight: bold;
}



.mainIntro {			/* main page intro text */
	clear: left;
	margin: 15px 20px;

	font-size: 11pt;
	line-height: 18px;
	font-style: normal;
	font-weight: normal;
	color: #808080;
}



.req {
	font-size: 1.3em;
	color: #990016;
}









/* link styles */

#topContact{
	font-size: 8.5pt;
	line-height: 12pt;
	color: #8e8d8d;
	text-transform: uppercase;
	font-weight: bold;
	margin-top: 0px;
	padding-top: 10px;
}

#topContact a {
	font-weight: bold;
	text-decoration: none
}


.redBoxMain a:hover{
	color: #DC6453;
}




.mainAreas a:hover {
	color: #DC6453 !important;
}


#pagePortfolioGWD #insideAreas .insideArea1 a{
	color: #CB0101 !important;
}

#pagePortfolioTD #insideAreas .insideArea2 a{
	color: #CB0101 !important;
}

#pagePortfolioSC #insideAreas .insideArea3 a{
	color: #CB0101 !important;
}

#pageDesign #insideAreas .insideArea1 a{
	color: #CB0101 !important;
}

#pagePortfolio #insideAreas .insideArea1 a{
	color: #CB0101 !important;
}

#pageTech #insideAreas .insideArea2 a{
	color: #CB0101 !important;
}

#pageStrategy #insideAreas .insideArea3 a{
	color: #CB0101 !important;
}



#pagination {
	clear: left;
	float: right;
	font-size: 9pt;
	text-transform: uppercase;
	margin: 13pt -40pt 0pt 0pt;
	color: #ffffff;
}



#headNav {
	display: block;
	width: auto;
	margin: 0;
	padding: 0;

	font-size: 9pt !important;
	font-weight: bold;
	text-transform: uppercase;
	list-style-type: none;
	background: none;
z-index: 0 !important;
}

#headNav li {
	display: block;

	float: left;
	padding-left: 0;
	margin-top: 2px; /* push portfolio menus down a little */
	background: none;
z-index: 0 !important;
}

#headNav li a:link, ul#headNav li a:visited { 
	/* unselected portfiolio menu item styles */
	display: block;
	float: left;
	padding: 0 1em;
	margin: 10px 0 0 0;

	color: #ffffff; font-size: 0.9em;
	text-transform: uppercase;
	font-weight: normal;
	font-family: "Helvetica Bold", "Helvetica", helvetica, arial, sans-serif;
	background: none;
	text-decoration: none;
z-index: 0 !important;
}

#headNav li a:hover, ul#headNav li a:active {
	/* hover portfolio menu item styles */
	color: #ffffff;
	background: #8a9e99;
z-index: 0 !important;
}


#portfolioWeb #headNav .headNavWeb{
	background: #8a9e99;
}

#portfolioPrint #headNav .headPrint{
	background: #8a9e99;
}

#portfolioCorporate #headNav .headCorporate{
	background: #8a9e99;
}


.footer .links {
	margin-bottom: 10px;

	font-size: 12pt;
	font-style: normal !important;
	font-weight: normal !important;
}


.contact .map {
	width: 100% !important;
	height: 240px;
}

.contact .address {
	clear: left !important;
}




/***** Form Styles *****/


.feedbackform {
padding: 5px;
}



div.fieldwrapper label.styled { /* label elements that should be styled (left column within fieldwrapper DIV) */ float: left; width: 150px; /*width of label (left column)*/ text-transform: uppercase; border-bottom: 1px solid #990016;
margin-right: 15px; /*spacing with right column*/ text-align: right; }


div.fieldwrapper label.styled2 { /* label elements that should be styled (left column within fieldwrapper DIV) */ float: left; width: 150px; /*width of label (left column)*/ text-transform: uppercase; margin-right: 15px; /*spacing with right column*/ text-align: right; }


div.fieldwrapper div.thefield { /* DIV that wraps around the actual form fields (right column within fieldwrapper DIV) */ float: left; margin-bottom: 10px; /* space following the field */ }

div.fieldwrapper div.thefield input[type="text"] { /* style for INPUT type="text" fields. Has no effect in IE7 or below! */ width: 250px; }

div.fieldwrapper div.thefield textarea { 
	/* style for TEXTAREA fields. */ 
	width: 150% !important; 
	height: 200px;
}


div.buttonsdiv { /*div that wraps around the submit/reset buttons*/ margin-top: 5px; /*space above buttonsdiv*/ }

div.buttonsdiv input { /* style for INPUT fields within 'buttonsdiv'. Assumed to be form buttons. */ width: 80px; background: #e1dfe0;
}

.thefield ul {
list-style-type: none;
background: none;
}

.thefield ul li {
list-style-type: none;
background: none;
}

.formbutton {
cursor: pointer;
border: solid 1px #ccc;
background: #fff;
color: #666;
font-weight: normal;
padding: 1px 2px;
}






.leftPromo {
	width: 90% !important;
	margin-left: 20px !important;
	margin-bottom: 50px !important;
}


#clearMiddle {
	clear: both !important;
	margin-bottom: 10px;
}


.rightPromo img {
	margin-top: 0px !important;
}

.rightPromo {
	float: left !important;
	width: 90% !important;
	padding-left: 0px !important;
	margin-left: 0px !important;

	margin-right: 30px !important;
}



