@charset "utf-8";
/* Simple fluid media
   Note: Fluid media requires that you remove the media's height and width attributes from the HTML
   http://www.alistapart.com/articles/fluid-images/ 
*/
img, object, embed, video {
	max-width: 100%;
}
/* IE 6 does not support max-width so default to width 100% */
.ie6 img {
	width:100%;
}

/*
	Dreamweaver Fluid Grid Properties
	----------------------------------
	dw-num-cols-mobile:		5;
	dw-num-cols-tablet:		8;
	dw-num-cols-desktop:	12;
	dw-gutter-percentage:	25;
	
	Inspiration from "Responsive Web Design" by Ethan Marcotte 
	http://www.alistapart.com/articles/responsive-web-design
	
	and Golden Grid System by Joni Korpi
	http://goldengridsystem.com/
*/

/* Mobile Layout: 480px and below. */

.gridContainer    {width:100%; margin:0 auto; background:#fff;}

/* =Header */
.rightHeader,
#compIntro, header             {width:100%; margin:0 auto;}
.rightHeader, .compLogo        {float:none; margin:0 auto 10px;}
.rightHeader                   {text-align:center;}
.rightHeader ul li.btnReqQuote {display:block; margin:10px auto;}

/* =Navigation */
#menu                    {padding:10px 0;}
#menu ul                 {width:98%; margin:0 auto;}
.select                  {display:block; width:95%; margin:0 auto;}
#menu > ul               {display:none;}

/* =Company Introduction */
#compIntro                 {margin:20px auto;}
#compIntro .compVideo,
#compIntro .introdcution   {float:none;} /**/
#compIntro .compVideo      {background:#000; width:100%;}
#compIntro .introdcution   {padding:10px 2.604166666666667% 0; font-size:125%; width:94.79166666666667%;}

/* =Home Page Services */
#rowTwo .services       {width:95%; margin:0 auto; position:relative;}
#rowTwo .services ul    {list-style:none; float:left; margin:0; width:100%;}
#rowTwo .services ul li {border-top:1px solid #fff200; border-bottom:1px solid #ffd000; padding:5px 0 5px 15px; background-position: 0 9px;}
.services                     {border-top:1px solid #ffd000; border-bottom:1px solid #fff200;}
.btnViewAll                   {display:none;}

/* =Home Page Projects */
.homeProjects                     {width:100%; margin:0 auto; text-align:center;}
.homeProjects .projects li        {width:40%; margin:0 5px 10px;}
.homeProjects .projects li        {height:100px;}
.homeProjects ul li .projMetaDeta {display:none;}
.portInfo                         {width:90%;}
.portInfo ul li                   {float:none; text-align:center;}
.portInfo ul li.col1,
.portInfo ul li.col2,
.portInfo ul li.col3              {width:100%; padding-top:10px;}

/* =Row Four */
#rowFour .compInfo                         {background:none; margin-bottom:20px;}
#rowFour .bottomBdr .innerWrap .innerWrap1 {width:95%; margin:20px auto; color:#666;}
.innerWrap1 .colThree ul li strong         {display:block; width:100%;}
.innerWrap1 .colOne h3,
.innerWrap1 .colTwo h3                 	   {font-size:200%;}
.innerWrap1 .colOne,
.innerWrap1 .colTwo                        {width:97%; float:none;}
.innerWrap1 .colTwo                        {margin-bottom:15px;}
.innerWrap1 .colThree                      {width:97%; float:none; clear:both; background-color:#fff; padding:10px 1.5%; border:1px solid #e5e5e5; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -ms-border-radius:5px; -o-border-radius:5px; box-shadow:inset 0 0 2px #e5e5e5; -webkit-box-shadow:inset 0 0 2px #e5e5e5; -moz-box-shadow:inset 0 0 2px #e5e5e5; -ms-box-shadow:inset 0 0 2px #e5e5e5; -o-box-shadow:inset 0 0 2px #e5e5e5;}
.innerWrap1 .colOne                        {text-align:left;}
.innerWrap1 .colOne h3,
.innerWrap1 .colTwo h3                     {background:#4c7c9a; height:40px; line-height:40px; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -ms-border-radius:5px; -o-border-radius:5px;}

/* =Pre Footer */
#preFooterWrap .footer            {width:95%; margin:0 auto;}
#preFooterWrap .footer .col3 .phoneNo {font-size:350%;}
#btnReuestStrip .btnReqQuote          {top:auto; right:auto; /*position:static !important;*/ margin-top:20px; margin:0 auto;}
#btnReuestStrip                       {padding:15px; text-align:center; line-height:1.2em;}

#preFooterWrap .footer .col1,
#preFooterWrap .footer .col2          {float:left; padding-bottom:20px;}
#preFooterWrap .footer .col3          {float:none;}
#preFooterWrap .footer .col1,
#preFooterWrap .footer .col2          {width:48%; font-size:91.66666666666667%;}
#preFooterWrap .footer .col3          {width:100%; text-align:center; border-top:1px dashed #999; clear:left; padding-top:20px;}

/* =Bottom Footer */
#bottomFooterWrap                     {width:95%; margin:0 auto; text-align:center;}
#bottomFooterWrap .fl,
#bottomFooterWrap .fr                 {float:none;}
#bottomFooterWrap .fr                 {padding-top:15px;}
#bottomFooterWrap .fl ul li:first-child {display:none;}

/* =Request A Quote Form */
#requAQuoteWrap                      {width:100%;}
#requestAQuote ul li                 {float:none;}
#requestAQuote li                    {width:100%;}
#requestAQuote .commentBox li        {width:98%;}
#requestAQuote .captchaTxt .textbox  {width:80%;}
#requestAQuote .listmenu             {width:98%; max-width:100%}
#requestAQuote .textbox              {width:93%; max-width:100%}
#requestAQuote .textarea             {width:95%; max-width:100%}
#requestAQuote .serviceProvid li     {width:92%;}
.serviceProvid span                  {float:none; width:98%;}

/* =Breadcrumbs */
#breadcrumbs                         {width:95%; margin:0 auto;}

/* =Content Wrapper */
.servicesWrap ul                      {text-align:center; width:100%;}
#contentWrap .content                 {width:100%; margin:0 auto;}
.servicesWrap ul li                   {width:100%; border-bottom:1px solid #eaeaea;}


/* =Body Text */
aside                                 {float:none; width:96%; margin:0 auto;}
.bodyText                             {float:none; width:98%; color:#666; padding-right:2%; padding-bottom:20px;}
.bodyText h1                          {font-size:291.6666666666667%;}
/* =aside */
.bodyText ul.floatList li             {width:100%;}

/* =Contact Us Address Block */
.addressBlock .address,
.addressBlock .locatioMap              {float:none;}
.addressBlock .locatioMap              {width:92%;}
.addressBlock .address                 {width:92%; margin-bottom:10px;}

/* =Contact Us Form */
.contactUsForm ul li label             {float:none; width:auto;}
.contactUsForm ul li .textbox          {width:90%;}
.contactUsForm ul li .captcha          {width:90%; margin-right:0; margin-bottom:5px; display:block; float:none;}
.contactUsForm ul li .captchaInput     {width:90%;}
.contactUsForm ul li .textarea         {width:90%;}

/* =Portfolio Thumbs */
#protfolioWrap ul li                   {width:48.7%; height:148px;/* max-width:145px;*/}
#protfolioWrap ul li .projMetaDeta     {width:91%; height:154px; display:none;}
#protfolioWrap .projMetaDeta
.buttons a.websiteDetail               {display:none;}

/* =Project Detail */
.detailWraper .projScreeshot           {display:none;}
.detailWraper .projScreeshot,
.detailWraper .projDetail              {float:none; width:inherit;}
#navigatePage, .detailWraper           {width:98%; margin:0 auto;}
.detailWraper .projDetail              {padding-left:0;}

/* =404 Page CSS */
#contentBody,
.errorMan {width:100%; float:none;}
.errorMan {text-align:center;}
.errorContaint          {width:320px; margin:0 auto; float:none;}

/* Mobile Layout: 480px and below. */
.shareThis, .aboutComp {display:none;}


/* ==========================================================================
   =Mobile Layout: 481px to 768px. Inherits styles from: Mobile Layout.
   ========================================================================== */
@media only screen and (min-width: 480px) {

/* =Home Page Services */
#rowTwo .services ul {width:50%;}
#rowTwo .services ul li {border:0; padding:0 0 2px 15px; background-position: 0 4px;}
.services                     {border:0;}

/* =Home Page Projects */
.homeProjects .projects li,
.homeProjects ul li .projMetaDeta {height:150px;}

/* =Contact Us Address Block */
.addressBlock .address,
.addressBlock .locatioMap              {float:left;}
.addressBlock .locatioMap              {width:48%;}
.addressBlock .address                 {width:40%; margin-bottom:0;}

/* =Contact Us Form */
.contactUsForm ul li label             {display:block; float:left; width:10%; padding-top:5px;}
.contactUsForm ul li label             {width:15%;}
.contactUsForm ul li .textbox          {width:57%;}
.contactUsForm ul li .captcha          {width:15%; margin-right:10px; margin-bottom:0; display:block; float:left;}
.contactUsForm ul li .captchaInput     {width:37%;}
.contactUsForm ul li .textarea         {width:80%;}

/* =Portfolio Thumbs */
#protfolioWrap ul li                      {width:32%; height:170px; max-width:170px;}
#protfolioWrap ul li .projMetaDeta        {width:92%; height:170px;}

}

/* ==========================================================================
   =Tablet Layout: 600px to 767px. Inherits styles from: Mobile Layout.
   ========================================================================== */
@media only screen and (min-width: 600px) {

.gridContainer    {width:600px;}
.rightHeader ul li.btnReqQuote {display:inline-block; margin: 0;}

/* =Home Page Projects */
.homeProjects .projects li    {width:30%; margin:0 5px 10px;}
.homeProjects .projects li,
.homeProjects ul li .projMetaDeta {height:150px;}
.homeProjects ul li .projMetaDeta {display:block;}
.portInfo                         {width:90.51020408163265%;}

/* =Row Four */
.innerWrap1 .colOne,
.innerWrap1 .colTwo               {width:48%; float:left;}
.innerWrap1 .colTwo               {margin-bottom:0;}
.innerWrap1 .colOne               {text-align:right;}
.innerWrap1 .colOne h3,
.innerWrap1 .colTwo h3            {background:url(../images/corners.jpg) no-repeat #4c7c9a; height:69px; line-height:69px; border-radius:0;}
.innerWrap1 .colOne h3            {background-position:0 -69px;}
.innerWrap1 .colTwo h3            {background-position:100% 0;}

/* =Request A Quote Form */
#requestAQuote ul li            {float:left;}
.serviceProvid span             {float:left; width:48%;}
.servicesWrap ul                {margin:0;}
.servicesWrap ul li             {width:48%; height:190px; margin-right:2px;}

.servicesWrap ul li.serv11,
.servicesWrap ul li.serv9,
.servicesWrap ul li.serv7,
.servicesWrap ul li.serv5,
.servicesWrap ul li.serv3,
.servicesWrap ul li.serv1             {border-right:1px solid #eaeaea;}

/* =Contact Us Address Block */
.addressBlock .locatioMap              {width:58%;}
.addressBlock .address                 {width:32%;}
#protfolioWrap ul li .projMetaDeta,
#protfolioWrap .projMetaDeta
.buttons a.websiteDetail               {display:block;}

.detailWraper .projScreeshot           {display:block;}
.detailWraper .projScreeshot,
.detailWraper .projDetail              {float:left; width:48%;}
.detailWraper .projDetail              {padding-left:15px;}


}


/* ==================================================================================================
   =Tablet Layout: 768px to a max of 1024px.  Inherits styles from: Tablet Layout.
   ================================================================================================== */
@media only screen and (min-width: 768px) {
	
.gridContainer    {width:768px;}

/* =Header */
header               {width:95%;}
.compLogo            {float:left; margin:0 auto 0;}
.rightHeader         {float:right; width:47.95918367346939%; text-align:right;}

/* =Navigation */
#menu                    {padding:0;}
.select                  {display:none;}
#menu > ul               {display:block;}

/* =Company Introduction */
#compIntro .introdcution   {font-size:160%;}

/* =Home Page Services */
#rowTwo .services ul {width:25%;}

/* =Home Page Projects */
.homeProjects .projects li,
.homeProjects ul li .projMetaDeta {height:200px;}

/* =Row Four */
#rowFour .compInfo                         {background:url(../images/dotted1.jpg) repeat-y 55% 0;}
.innerWrap1 .colOne,
.innerWrap1 .colTwo                        {width:25.51020408163265%; float:left;}
.innerWrap1 .colThree                      {width:42.85714285714286%; float:right; box-shadow:none; border-radius:0; border:0; background-color:transparent; clear:none; padding:0;}

/* =Pre Footer */
#preFooterWrap .footer .col3 .phoneNo {font-size:460%;}
#btnReuestStrip .btnReqQuote          {top:16px; right:15px; position:absolute !important;}
#btnReuestStrip                       {padding:12px 185px 12px 10px;text-align:left;}

#preFooterWrap .footer .col3          {float:left;}
#preFooterWrap .footer .col1,
#preFooterWrap .footer .col2          {width:28%; padding-bottom:0;}
#preFooterWrap .footer .col3          {width:44%; text-align:left; border-top:0; clear:none; padding-top:0;}

/* =Bottom Footer */
#bottomFooterWrap                     {text-align:left;}
#bottomFooterWrap .fl                 {float:left;}
#bottomFooterWrap .fr                 {float:right; padding-top:0;}

/* =Request A Quote Form */
#requestAQuote ul li                  {float:left;}
.serviceProvid span                   {float:left; width:30%;}

/* =Content Wrapper */
.servicesWrap ul                      {background:url(../images/service-devider.png) no-repeat center bottom; padding-bottom:30px; margin:20px 0;}
.servicesWrap ul li a                 {height:245px;}
.servicesWrap ul li                   {width:23.46938775510204%; border:0; height:240px;}
.servicesWrap ul li.serv11,
.servicesWrap ul li.serv9,
.servicesWrap ul li.serv7,
.servicesWrap ul li.serv5,
.servicesWrap ul li.serv3,
.servicesWrap ul li.serv1             {border-right:0;}
.servicesWrap ul li + li a            {border-left:1px solid #eaeaea;}

/* =Body Text */
.bodyText                             {float:right; width:69%;}
.bodyText h1                          {font-size:416.6666666666667%;}
/* =aside */
aside                                 {float:left; width:31%;}
.bodyText ul.floatList li             {width:45%;}

/* =Contact Us Address Block */
.addressBlock .locatioMap             {width:55%;}
.addressBlock .address                {width:34%;}

/* =Portfolio Thumbs */
#protfolioWrap ul li                  {width:32%; height:194px; max-width:215px;}
#protfolioWrap ul li .projMetaDeta    {height:194px;}

/* =404 Page CSS */
#contentBody            {width:800px;}
.errorMan               {width:40%; float:left;}
.errorContaint          {width:60%; float:right;}

.shareThis{display:block;}

}


/* ==================================================================================================
   =Desktop Layout: 1025px to a max of 1380px.  Inherits styles from: Tablet Layout and Small Screen Layout.
   ================================================================================================== */
@media only screen and (min-width: 1024px) {

body               {background-image:url(../images/body-bg.jpg); background-repeat:no-repeat; background-position:top center;}
.gridContainer     {width:1024px;}

/* =Header */
#menu ul, #rowTwo .services,
#compIntro, header {width:980px;}

/* =Company Introduction */
#compIntro .compVideo      {float:left; width:49.59183673469388%;}
#compIntro .introdcution   {float:right; width:47.3469387755102%; padding:0;}
#compIntro .introdcution   {padding-top:0;}

/* =Home Page Services */
.btnViewAll                {display:block;}

/* =Home Page Projects */
.homeProjects              {width:980px;}
.homeProjects .projects li {width:18.36734693877551%; height:150px; margin:0 5px;}
.portInfo                  {width:95.51020408163265%;}
.portInfo ul li            {float:left; text-align:left;}
.portInfo ul li.col1       {width:15.27196652719665%;}
.portInfo ul li.col2       {width:68.56066945606695%; padding-right:1.04602510460251%;}
.portInfo ul li.col3       {width:13.59832635983264%;}
.portInfo ul li.col1,
.portInfo ul li.col2,
.portInfo ul li.col3              {padding-top:0;}	

/* =Row Four */
#rowFour .bottomBdr .innerWrap .innerWrap1 {width:980px;}
.innerWrap1 .colThree ul li strong         {display: inline-block; *display: inline !important; *zoom: 1; width:25%;}
.innerWrap1 .colOne h3,
.innerWrap1 .colTwo h3                 	   {font-size:250%;}

/* =Pre Footer */
#preFooterWrap .footer            {width:980px;}
#preFooterWrap .footer .col3 .phoneNo {font-size:466.6666666666667%;}
#btnReuestStrip .btnReqQuote          {top:10px; right:10px;}

/* =Bottom Footer */
#bottomFooterWrap                     {width:980px; margin:0 auto;}
#bottomFooterWrap .fl ul li:first-child {display:inline-block;}

/*Request A Quote Form*/
#requestAQuote li                    {width:30%;}
#requestAQuote .commentBox li        {width:98%;}
#requestAQuote .captchaTxt .textbox  {width:80%;}
#requestAQuote .listmenu             {width:98%; max-width:100%}
#requestAQuote .textbox              {width:93%; max-width:100%}
#requestAQuote .textarea             {width:100%; max-width:100%}
#requestAQuote .serviceProvid li     {width:97%;}
.serviceProvid span                  {float:left; width:20%;}

/* =Breadcrumbs */
#breadcrumbs                         {width:980px;}

/* =Content Wrapper */
#contentWrap .content                 {width:980px;}
.servicesWrap ul li,
.servicesWrap ul li a                 {height:212px;}

/* =Body Text */
.bodyText                             {width:74.48979591836735% /* =730px */;}

/* =aside */
aside                                 {width:25.51020408163265% /* =250 */;}
.bodyText ul.floatList li             {width:30%;}

/* =Contact Us Address Block */
.addressBlock .locatioMap              {width:65%;}
.addressBlock .address                 {width:25%;}

/* =Contact Us Form */
.contactUsForm ul li .textbox          {width:40%;}
.contactUsForm ul li .captcha          {width:10%;}
.contactUsForm ul li .captchaInput     {width:27%;}
.contactUsForm ul li .textarea         {width:60%;}

/* =Portfolio Thumbs */
#protfolioWrap ul li                   {width:24%; height:194px; max-width:220px;}
#navigatePage, .detailWraper           {width:100%;}

.aboutComp {display:inline-block; *display:inline !important;}
}


/* ==================================================================================================
   =Desktop Layout: from 1380px to above.  Inherits styles from: Desktop Layout.
   ================================================================================================== */
@media only screen and (min-width: 1280px) {

.gridContainer                         {width:100%; max-width:1280px;}

/* =Portfolio Thumbs */
#protfolioWrap ul li                   {width:19%; height:185px; max-width:185px;}	
}