@charset "utf-8";
/* CSS Document */

*{ margin:0; padding:0; }

body{ margin:0; padding:0; background:#f4f1e9; font-size:62.5%; font-family:Verdana, Arial, Helvetica, sans-serif; }

p{ font-size:1.2em; line-height:1.6; }
a{ cursor:pointer; text-decoration:none; }
a:hover{ text-decoration:underline; }
a img{ border:0; }

h2{ margin:0 auto; text-align:center; }
h4{ font-size:1.5em; }

.disabled{ opacity:0.5; }
.clr{ clear:both; }
.large{ font-size:1.6em; }

.tooltip{ display:none; background:url(images/tooltip.png) top center no-repeat; 
			font-size:1.2em; height:80px; width:130px; padding:10px 20px; color:#000; font-weight:bold; line-height:1.6; text-align:center;
			margin-left:115px; margin-top:-25px;
		}
		
#menu-cont{ position:fixed; top:0; left:0; width:100%; height:50px; background:url(images/menu.png) top center no-repeat; color:#FFF; text-align:center; z-index:100; }
#menu{ width:640px; margin:0 auto; position:relative; padding-top:10px; }
#menu li{ display:block; font-size:2em; margin:0; padding:0; float:left; }
#menu li a{ color:#FFF; margin:0; padding:0; display:block; float:left; }
a#menu-home{ background:url(images/menu-home.jpg) no-repeat; width:120px; height:40px; }
a#menu-port{ background:url(images/menu-portfolio.jpg) no-repeat; width:170px; height:40px; }
a#menu-services{ background:url(images/menu-services.jpg) no-repeat; width:140px; height:40px; }
a#menu-contact{ background:url(images/menu-contact.jpg) no-repeat; width:190px; height:40px; }
a#menu-home:hover, #menu li.selected a#menu-home{ background-position:-120px 0; }
a#menu-port:hover, #menu li.selected a#menu-port{ background-position:-170px 0; }
a#menu-services:hover, #menu li.selected a#menu-services{ background-position:-140px 0; }
a#menu-contact:hover, #menu li.selected a#menu-contact{ background-position:-190px 0; }

#header{ width:920px; height:640px; background:url(images/header.jpg) top center no-repeat; margin:0 auto; position:relative; }

#logo{ position:absolute; top:60px; left:320px; width:280px; }

#tagline{ position:absolute; top:370px; left:150px; width:620px; }

#stamp-web{ position:absolute; bottom:0; left:160px; }
#stamp-graphics{ position:absolute; bottom:0; left:370px; }
#stamp-photos{ position:absolute; bottom:0; right:160px; }

#portfolio{ width:920px; height:760px; background:url(images/portfolio.jpg) top center no-repeat; margin:0 auto; position:relative; }
#portfolio h2{ padding-top:0; }
#portfolio-1, #portfolio-2, #portfolio-3{ position:relative; width:280px; padding:0 10px; height:600px; margin-top:10px; float:left; }
#portfolio-2{ margin-left:10px; }
#portfolio-3{ margin-left:10px; }
#portfolio-1 .top, #portfolio-2 .top, #portfolio-3 .top{ position:relative; overflow:hidden; width:280px; height:125px; }
#portfolio-1 .mid, #portfolio-2 .mid, #portfolio-3 .mid{ position:relative; overflow:hidden; width:280px; height:310px; }
#portfolio-1 .bot, #portfolio-2 .bot, #portfolio-3 .bot{ position:relative; overflow:hidden; width:280px; height:165px; }
#portfolio .items{ width:20000em; position:absolute; }
#portfolio .items a{ /*position:relative; display:block;*/ float:left; /*background:red;*/ height:310px; width:280px; }
#portfolio .items a img{ /*display:none;*/ }
#port-prev{ position:absolute; top:400px; left:-30px; z-index:10; }
#port-next{ position:absolute; top:400px; right:-30px; z-index:10; }

#services{ width:930px; height:760px; background:url(images/services.jpg) top center no-repeat; margin:0 auto; position:relative; padding:0; }
#services-menu{  width:930px; height:280px; margin:20px auto 0; padding:0px; }
#services-menu li{ display:block; font-size:2em; margin:0; padding:0; float:left; }
#services-menu li a{ color:#FFF; margin:0; padding:0; color:#333; display:block; }
#services-menu li a.commercial{ background:url(images/services-menu-commercial.jpg) no-repeat; width:310px; height:280px; }
#services-menu li a.industrial{ background:url(images/services-menu-industrial.jpg) no-repeat; width:310px; height:280px; }
#services-menu li a.personal{ background:url(images/services-menu-personal.jpg) no-repeat; width:310px; height:280px; }
#services-menu li a.commercial:hover, #services-menu li.active a.commercial{ background-position:-310px 0; }
#services-menu li a.industrial:hover, #services-menu li.active a.industrial{ background-position:-310px 0; }
#services-menu li a.personal:hover, #services-menu li.active a.personal{ background-position:-310px 0; }
#services-scroll{ width:920px; height:340px; position:relative; overflow:hidden; }
#services-scroll .items{ width:20000em; position:absolute; }
#services-scroll .items div.item{ width:930px; height:510px; float:left; position:relative; text-align:center; }
#services-scroll .items div.item p{ text-align:left; }
#services .prev{ position:absolute; top:400px; left:-30px; z-index:10; }
#services .next{ position:absolute; top:400px; right:-30px; z-index:10; }
#services .services-column{ float:left; margin:15px 0 0 0 !important; padding:0 30px 20px; width:250px; height:310px; }
#services .services-column p{ color:#FFF; }
#services .services-column ul{ list-style:inside; margin:0 0 10px; padding-left:1em; text-indent:-1em; font-size:1.2em; }
#services .services-column ul li{ /*font-size:1.4em;*/ padding:2px; color:#FFF; text-align:left; }
/*
#services .left{ margin-left:5px; margin-right:0px; }
#services .right{ margin-left:0px; margin-right:5px; }
#services .center{ margin-left:10px; margin-right:10px; }
*/

#contact{ width:920px; height:590px; margin:0 auto; background:url(images/contact.jpg) top center no-repeat; position:relative; }
#contact-form{ float:left; width:390px; height:590px; padding:0 30px 0; position:relative; }
#contact-form label{ font-size:1.3em; font-weight:bold; background:#FFF; padding:5px; color:red; border:red; }
#contact-email{ position:absolute; top:197px; left:60px; width:350px; height:15px; display:block; }
#contact_email input{ width:350px; height:15px; }
#contact-subject{ position:absolute; top:275px; left:60px; width:350px; height:15px; display:block; }
#contact_subject input{ width:350px; height:15px; }
#contact-message{ position:absolute; top:355px; left:60px; width:350px; height:110px; display:block; }
#contact_message input{ width:350px; height:110px; }
#contact-submit{ font-size:1.6em; padding:10px; position:absolute; bottom:50px; left:280px; width:140px; height:50px; margin:0;  color: transparent; text-transform: capitalize;
	 border:0; background:url(images/send.jpg) top center no-repeat; cursor:pointer; }
#contact-details{ float:left; width:400px; padding:50px 30px 0; }
#contact-details p{ font-size:1.6em; font-weight:bold; }
#contact-details a{ color:#000; }

#contact p.success, #contact p.error, #contact p.loading{ position:absolute; top:355px; left:60px; width:328px; height:88px; padding:10px; background:#FFF; font-weight:bold; }
#contact p.success{ border:solid 2px #009900; color:#009900; }
#contact p.error{ border:solid 2px #009900; color:#009900; }
#contact p.loading{ border:solid 2px #CC3300; color:#CC3300; }

#footer{ /*background:url(images/footer.jpg) top center no-repeat;*/ width:920px; /*height:60px;*/ margin:10px auto; font-size:1.4em; }
#footer p{ text-align:center; line-height:1.6em; }

/* the overlayed element */
.simple_overlay { display:none; z-index:10000; background:url(images/popup-bg.png) top center no-repeat; width:700px; height:540px;/**/ padding:20px 10px; margin:0; }
.overlay_inner{ width:700px; height:540px; overflow:scroll; }
.simple_overlay .close { background:url(images/popup-close.png); position:absolute; right:-10px; top:-10px; cursor:pointer; height:40px; width:40px; }
.simple_overlay h3{ height:40px; font-size:1.8em; }
.simple_overlay p{ font-size:1.2em; margin-top:15px; }
.simple_overlay ul{ font-size:1.2em; margin:15px 0; }