@charset "utf-8";

/*======================*/
body { margin: 0; padding: 0; background:url(../images/bgMainMiddle.gif) repeat 0 0; font-family: Arial, Helvetica, sans-serif; color: #3d4548; }
p, div, ul, li, a, h1, h2, h3, h4, h5, h6, span, img, br,form, fieldset, legend, label, input, textarea { margin:0; padding:0; border:none;}


/*===== layout area ========*/
#outerContainer { background:url(../images/bgMainTop.jpg) repeat-x  0 0; }
#innerContainer{ background:url(../images/bgMainBottom1.png) repeat-x 0 100%;}
.liquidArea{ margin:0; padding:0; width:100%; float:left;}
#fixedArea{ margin:0 auto; padding:0; width:1000px;}


/*===== Banner area ========*/
#bannerArea{ margin:0; padding:0; background:url(../images/imgBanner.png) no-repeat 0 0; width:1000px; height:400px; position:relative;}
* html #bannerArea{ background:url(../images/imgBanner.jpg) no-repeat 0 0;} /* IE6 fix (png not supported */

#bannerArea h1{ color: #fff; padding:15px 25px; font-size: 12pt; }
#bannerArea h1 a{ color: #fff; text-decoration:none;}


/*===== topnav (main navigation) area ========*/
#topNavLinks{ margin:0; padding: 0; width:425px; float:left; position:absolute; top:250px; left:158px;}
#topNavLinks ul { padding: 0; list-style:none; }
#topNavLinks li { display:inline; margin: 0px -2px; padding: 0; }
#topNavLinks li a { margin:0; padding: 12px 10px; display:inline-block; font: italic 400 9pt Georgia, "Times New Roman", Times, serif; color: #fff; text-decoration: none; border-left: 1px solid #272727; border-right: 1px solid #000;}
#topNavLinks li a:hover { text-decoration: none; background:url(../images/bgNavHover.gif) repeat-x 0 0;}
#topNavLinks li a:hover span { text-decoration:none; border-bottom: 1px dotted #fff; padding: 0 0 2px 0;}


/*===== Quotation area ========*/
#designQuotes{ width:auto; float:left; position:absolute; top:315px; left:250px;  background:url(../images/imgQuotes.png) no-repeat 0 -18px;}
* html #designQuotes{ background:url(../images/imgQuotes.gif) no-repeat 0 -18px;} /* IE6 fix (png not supported */
#designQuotes p {font: italic 400 12pt Georgia, "Times New Roman", Times, serif; padding: 5px 30px;  background:url(../images/imgQuotes.png) no-repeat 100% 39px; line-height:18pt;}
* html #designQuotes p { background:url(../images/imgQuotes.gif) no-repeat 100% 39px; line-height:18pt;}/* IE6 fix (png not supported */


/*===== Content Area ========*/
#contentArea{ margin:0 0 50px 0; padding: 10px 13px 10px 12px; width:975px; float:left;}

.blocks { margin: 0 12px 10px 13px; display:block;} 


/*===== page title Area ========*/
#pageTitle{margin: 10px 12px 0 13px; padding-bottom:10px;}
#pageTitle .subtitle{ font: italic 700 9pt Arial, Helvetica, sans-serif; color: #444; }


/*===== column distribution ========*/
#oneColumn{} /* one column approach */

#twoColumn{} /* two column approach divided in two different proportion with larger area(.largeArea) defined with 650px and smaller area (.smallArea) with 275px  */
.largeArea {width:650px; float:left;}
.smallArea {width:275px; float:left;}

#threeColumn{}/* three column approach divided in equal proportion == */
.equalArea {width:300px; float:left;}


/*===== content styling ========*/
.content{ width:auto; float:left; margin-top: 10px;}
.content p{ font-size: 10pt; line-height:14pt; margin:0 0 10px 0;}
.content a { text-decoration:none;  border-bottom: 1px dotted ;}
.content a:hover { text-decoration:none;}
.content ul{ list-style:none;}
.content li{ font-size: 10pt; line-height:14pt; padding: 0 0 0 15px; margin: 8px 0;}

ul.bulletsRed li{background: url(../images/imgBullet.gif) no-repeat 0 6px;}
ul.bulletsGreen li{background: url(../images/imgBullet.gif) no-repeat 0 6px;}
ul.bulletsBlue li{background: url(../images/imgBullet.gif) no-repeat 0 6px;}

.contentHeader { padding-bottom:10px;}
.contentHeader .subtitle{ font: italic 700 9pt Arial, Helvetica, sans-serif; color: #444; padding-bottom:10px; }

.bulletArrowRed{ background: url(../images/imgBulletArrows.png) no-repeat 100% 0; padding: 3px 30px 3px 0; }
.bulletArrowGreen{ background: url(../images/imgBulletArrows.png) no-repeat 100% 50%; padding: 3px 30px 3px 0; }
.bulletArrowBlue{ background: url(../images/imgBulletArrows.png) no-repeat 100% 100%; padding: 3px 30px 3px 0; }
* html .bulletArrowRed{ background: url(../images/imgBulletArrows.jpg) no-repeat 100% 0; }
* html .bulletArrowGreen{ background: url(../images/imgBulletArrows.jpg) no-repeat 100% 50%; }
* html .bulletArrowBlue{ background: url(../images/imgBulletArrows.jpg) no-repeat 100% 100%; }
.bulletArrow{ background: url(../images/arrowPortfolio.gif) no-repeat 0 55%; padding: 3px 0px 3px 15px; }

.fontRed { color:#a50000;}
.fontGreen { color:#008000;}
.fontBlue { color:#004567;}

.headerBGRed{ background: url(../images/bg4.gif) no-repeat 0 5px; padding: 0 10px 0 15px;}
.headerBGGreen{ background:url(../images/bg4.gif) no-repeat 0 -55px; padding: 0 10px 0 15px;}
.headerBGBlue{ background:url(../images/bg4.gif) no-repeat 0 -115px; padding: 0 10px 0 15px;}

.bgLine { background:url(../images/bgUnderline.gif) repeat-x 0 0;}
.bgLineUnder { background:url(../images/bgUnderline.gif) repeat-x 0 100%;}
.portfolioStyle{ background: #fdfdfd url(../images/bgPortfolioItem.jpg) repeat-x 0 100%  !important; width:284px; padding:7px  !important; float:left; display:block; border: 1px solid #bfc0c1; margin: 0 0 10px 0;}

ul.portfolio{ list-style:none; display:block;}
ul.portfolio li{ background: #fdfdfd url(../images/bgPortfolioItem.jpg) repeat-x 0 100%  !important; width:284px; padding:7px  !important; margin-right:16px  !important; float:left; display:block; border: 1px solid #bfc0c1;}
ul.portfolio li a img{ border: 1px solid #c6cace;}
ul.portfolio a img{ text-decoration: none;}
.pImage{ border: 1px solid #fff;}
.pImage img{ border: 1px solid #999;}
.pInfo{ border-bottom: 1px solid #cbced0; display:table; clear:both; width:284px; float:left; padding: 8px 0 5px 0; position:relative;}
.pTitle{ font: 400 10pt Georgia, "Times New Roman", Times, serif; width:165px; float:left; clear:left; display:table-cell; vertical-align:middle;}
.pLinks{ font-size: 7pt ; text-transform: uppercase; width:110px; float:right; text-align:right;display:table-cell; vertical-align:middle;}
.pLinks a{ border:none;}
.iconZoom{ background: url(../images/imgIconLens.gif) no-repeat 0 0; padding-left: 15px;}
.iconWebsite{ background: url(../images/imgIconWebsite.gif) no-repeat 0 0; padding-left: 15px;}


/*===== footer area ========*/
#footerArea{ margin:25px; padding:0; width:950px; float:left; display:block; clear:both; color: #a3aab3; }

/*===== css gallery showcase & google ads promotional area area ========*/

#promotionalArea{ padding-bottom:25px; width:950px; float:left;border-bottom: 1px dashed #000;}
#cssGallery{ margin:0; padding: 0; width:950px; float:left;}
#cssGallery ul{margin:10px 0 0 0; padding:0; border:none;}
#cssGallery li{  border: 1px solid #fff; margin-right:10px; padding:0; display:inline-block;}
#cssGallery li a{ border: 1px solid #8d8d8d; margin:0; padding:0; display:block; text-decoration:none;}
#googleAds{ margin:0; padding:0; width:950px; float:left;}

/*===== footer links area ========*/
#footerLinks{ margin:0; padding: 25px 0; width:950px; float:left;border-top: 1px dashed #2c2f30; border-bottom: 1px dashed #000;}
#footerLinks ul { padding:0; margin:0; list-style:none;  width:475px; float:left;  }
#footerLinks li { text-align:center; display:inline; margin: 0px -2px; padding: 0; }
#footerLinks li a { margin:0; padding: 0 15px 3px 15px; font: italic 400 9pt Georgia, "Times New Roman", Times, serif; color:#cacaca; text-decoration: none; border-left: 1px solid #424a4e; border-right: 1px solid #0d1012;}
#footerLinks li a:hover { text-decoration: none; color: #dbdbdb;}
#footerLinks li a:hover span { text-decoration: none; border-bottom: 1px dotted #dbdbdb; padding: 0 0 2px 0;}


#designerInfo{ width:475px; float:right; margin-top:2px ; padding:0;}
#designerInfo p{ font-size: 10pt; text-align:right; }


/*===== copyright area ========*/
#copyrightArea{  padding-top:25px; width:950px; float:left;border-top: 1px dashed #2c2f30; }
.copyrightText { width:200px; float:left; margin-top:20px; padding-left:10px; border-left: 1px solid #2c2f30;}
.copyrightText p{ font-size: 9pt; font-weight: 400; line-height: 13pt; margin:0; padding:0;}

#footerLogo{ width:165px; float:left; margin-right:5px;}


/*===== validations and browser compatibility area ========*/
#validationLinks{ padding:0; width:200px; float:right; text-align:right; margin-top:6px;}
#validationLinks p{font-size:10pt; font-weight:700; font-style:italic; margin:7px 0;}
#validationLinks ul {list-style:none; text-align:right;}
#validationLinks li { display: inline; background:url(../images/bgValidationList.png) no-repeat 0 0; padding-left:22px;  margin-left:15px;}
#validationLinks li a { margin:0; padding: 2px 0; color: #a9afb4; text-decoration: none; font-size: 9pt; font-weight: 400;}
#validationLinks li a:hover { text-decoration:none;}
#validationLinks li a:hover span { text-decoration:none; border-bottom: 1px dotted #a9afb4;}

#browserCompatibility{ margin: 3px 0 7px 0; width:200px; float:right; text-align:right; margin-top:6px;}
#browserCompatibility p{font-size:10pt; font-weight:700; font-style:italic; margin:7px 0;}



/* ==== Heading font style ==== */
h1, h2, h3, h4, h5, h6 { font-family: Georgia, "Times New Roman", Times, serif; font-style: italic; font-weight: 400; }
h1{ font-size:20pt; margin-bottom:3px;}
h2{ font-size:16pt; margin-bottom:3px;}
h3{ font-size:14pt; margin-bottom:3px;}
h4{ font-size:12pt; margin-bottom:3px;}
h5{ font-size:11pt; margin-bottom:3px;}
h6{ font-size:10pt; margin-bottom:3px;}


/*===== other style ========*/

.strong { font-weight:700;}
.italic { font-style: italic;}
.underline{ text-decoration:underline}

.borderLftNone{ border-left:none !important;}
.borderRthNone{ border-right:none !important;}

.clearLeft{ clear:left;}
.clearRight{ clear:right;}
.clearBoth{ clear:both;}

.padLeftNone{ padding-left:0 !important;;}
.padRightNone{ padding-right:0 !important;;}

.alignRight{ text-align:right;}
.alignCenter{ text-align:center;}

/*===== contact form style ========*/
form{ font-size:10pt; margin: 10px 0;}
label{ font-weight:700; clear:left; width:85px; float:left; margin:7px 0; padding:4px 0;}
input{ width:200px; float:left; margin:7px 0; padding:4px; background:url(../images/bgTextArea.gif) repeat 0 0; border:1px solid #6d8a99;}
textarea{ width:375px; float:left; padding:3px;  background:url(../images/bgTextArea.gif) repeat 0 0; border:1px solid #6d8a99;}
.btn{ width:auto; float:left; padding: 3px 7px; margin-right:10px; display:block; background: url(../images/bgButton.png) repeat-x 0 0; color:#fff; font-weight:700; border-top: 2px solid #ca0000; border-right: 2px solid #750000; border-bottom: 2px solid #750000; border-left: 2px solid #ca0000; }


/*===== after contact form submission message style ========*/
.MsgSent, .MsgError { display: block; padding: 10px 100px; margin: 40px auto;	width: 400px; float:left;}
.MsgSent { background: url(../images/MsgSent.png) no-repeat 0 10px;}
.MsgError { background: url(../images/MsgError.png) no-repeat 0 0;}

.MsgSent h1, .MsgError h1 { height: 40px;}


/*===== tooltip style ========*/
.tipsbox .tipsbox_top{ background : url(../images/bgTooltip.png) no-repeat 0 0; height:15px;}
.tipsbox .tipsbox_mark{	background : url(../images/bgTooltip.png) no-repeat 0 100%; height:30px;}
.tipsbox .tipsbox_inner, .tipsbox .tipsbox_inner_ie6{ background : url(../images/bgTooltip.png) no-repeat 0 38%; width:275px; padding: 0 15px; display: table;}
.tipsbox .tipsbox_error { background : url(../images/error.png) no-repeat 50% 50%; width: 40px; height:40px; display: table-cell; vertical-align:middle;}
 .tipsbox {	color : #FFF;}
.tipsbox p { padding-left: 15px; vertical-align:middle; margin: 5px 0;}
.tipsbox p span { color: yellow;}