/*
	The design elements inside this file is a copyright of BDQWorks
	info(at)bdqworks.com
	
	You may not copy any of the design elements inside file
	However, you may look and learn
*/
/*
body { background:#fff url(images/bg.jpg) no-repeat top center fixed; text-align:left; margin: 0px; }
*/
body { background: #8ed447 url(images/bg.jpg) center top; text-align:left; margin: 0px; color: #555; font: 14px/20px 'PT Sans', "Lucida Grande", Arial, sans-serif; }
.wrapper { width: 980px; margin: 0 auto; }
p { padding: 0px 0px 10px 0px; margin: 0px; }
p.last { padding-bottom: 0px; }
.light-brown { color: #bfa794; }
em, strong, .footer li, .footer p a, .footer li a, .cp a, .brown, .light-brown a, .salmon a { color: #8e6442; }
.yellow { color: #fffd30; }
.frontpage .blurb, .footer p, .footer p a:hover, .footer li a:hover, .cp a:hover, .p-box2 p, a.sidebar-link:hover, .p-box2 a:hover, .green-link a:hover, .orange-link a, .orange, .light-brown a:hover { color: #e48600; }
h6, .content-heading, h1 span, h2 span, h3 span, .emerald, .pullHeading1a span, .pullHeading1a span a:link, .pullHeading1a span a:visited, .pullHeading1a span a:active, .p-box2 a, .comment2, .green-link a, .green-link, .orange-link a:hover, .orange-link span { color: #94bc68; }
.clear:after { display: block; content: " "; clear: both; visibility: hidden; }
.inline-block { display: inline-block; zoom: 1; *display:inline; width: 50px; }
.block { display: block; }
.block2 { display: block; padding: 4px 0px 3px 0px; }
h1, h2, h3, h6, .content-heading { font-size: 24px; line-height:28px; padding: 28px 0px 10px 0px; margin: 0px; font-weight: normal; }
.content-heading2 { font-size: 16px; line-height: 20px; }
.pullHeading1a { font-size: 24px; line-height: 28px; padding: 22px 0px 6px 0px; margin: 0px; }
.pullHeading1a, .pullHeading1b, .content-heading2, h1, h2, h3, h6, .content-heading, .p-sub-box .inside i, .p-sub-box .inside2 i, .creative-brains  { font-family: 'PT Sans', 'Lucida Grande', arial, sans-serif; }
.pullHeading1a a { color: #5289C5; }

/* Headings */
.red-orange-heading { color: #ff7f22; text-shadow: #eee 0px -1px 0px; }
.blue-heading { color: #5289c5; text-shadow: #b0c9e1 0px -1px 0px; }
.brown-heading { color: #916e52; text-shadow: #aaa 0 -1px 0; }
.white { color: #fff; text-shadow: #aaa 0 -1px 0; }
.white-heading, .big-heading, .white-heading a { color: #fff; padding-bottom: 11px; text-shadow: #697b59 0px -1px 0px; font-family: 'PT Sans', Helvetica, Arial, sans-serif; font-weight: 700; font-size: 28px; line-height: 33px; font-style: italic; }
.white-heading a:hover { color: #e8f8d7; }
.big-heading { text-shadow: #fafafa 0px -1px 0px; color: #ff6800; }

/* Footer */
#footer { background: #4484ca url(images/footer.png) repeat-x; height: 163px; padding-top: 4px; }
#footer .pullHeading1a { padding-top: 0; color: orange; text-shadow: #333 0 -1px 0; padding-bottom: 0; }
#footer .wrapper { width: 995px; }

#footer .footer-big { float: left; padding: 0 22px 0; margin: 12px 0 0 0; border-right: solid 1px #265382; border-left: solid 1px #577a9e; height: 110px; color: #eaf6e0; }
#footer #first-footer { border-left: none; padding-left: 0; }
#footer #last-footer { border-right: none; padding-right: 0; font-size: 18px; line-height: 23px; }
#footer .footer-big a { color: #fffd30; }
#footer .footer-big a:hover, #footer .yellow:hover { color: #fff; }
#footer .footer-big .pullHeading1b { text-shadow: #72934e 0 -1px 0; color: #c6ed9a; }

#cp { text-align: center; color: #87a0b9; font-size: 13px; float: left; width: 980px; margin: 0 auto; padding-top: 12px; }
#cp a { color: #93a97b; }
#cp a:hover { color: #a1b987; }

/* Front Page */
#photoShow { height: 450px; width: 978px; border-left: 1px solid #97ba70; border-right: 1px solid #97ba70; border-bottom: 1px solid #97ba70; }
#subtitle-width { width: 250px; }
#subtitle-width2 { width: 191px; }
.widescreen #subtitle-width2 { width: 224px; }

/* Divs */
div { vertical-align: top; margin: 0px; padding: 0px; }
.normal { padding: 0px; color: #a2c978; font: 14px/19px 'PT Sans', "Lucida Grande", Arial, sans-serif; }
a.normal { color: #a2c978; }

/* Side-Bar */
.p-sub-box div p { line-height: 18px; font-size: 13px; }
.small-links { font-size: 12px; line-height: 18px; padding-top: 20px; }
.sidebar-title { padding: 8px 0 0 30px; width: 225px; height: 46px; margin-left: -14px; font: 16px/28px 'Open Sans', Helvetica, Arial, sans-serif; font-style: 600; text-shadow: #444 0px -1px 0px; color: #FFF; }

.p-box2 { float: right; padding: 24px 0 0 40px; margin-right: 5px; width: 225px; line-height: 18px; font-size: 13px; }
.p-box2 p { padding: 0 15px 10px 12px; }

.sidebar-link { display: block; padding: 86px 0 0 23px; margin: 0 15px 10px 9px; height: 40px; }
a.sidebar-link { color: #7bbf39; background: no-repeat top left; }
a.sidebar-link:hover { background-position: 0 -130px; }

#sidebar-work { background-image: url(images/portfolio-web.jpg); }
#sidebar-seo { background-image: url(images/portfolio-seo.jpg); }
#sidebar-modules { background-image: url(images/portfolio-app.jpg); }
#sidebar-blog { background-image: url(images/portfolio-blog.jpg); }
#sidebar-video1 { background-image: url(images/portfolio-video.jpg); }
#sidebar-video2 { background-image: url(images/portfolio-video2.jpg); }

/* Border and Rounds */
.round-a { -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; }
.round-mini { -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; }
.round-b { -webkit-border-bottom-right-radius: 7px; -webkit-border-bottom-left-radius: 7px; -moz-border-radius-bottomright: 7px; -moz-border-radius-bottomleft: 7px; border-bottom-right-radius: 7px; border-bottom-left-radius: 7px; }
.round-t { -webkit-border-top-left-radius: 7px; -webkit-border-top-right-radius: 7px; -moz-border-radius-topleft: 7px; -moz-border-radius-topright: 7px; border-top-left-radius: 7px; border-top-right-radius: 7px; }
.margin-b { margin-bottom: 9px; }
.margin-t { margin-top: 9px; }
.margin-r { margin-right: 9px; }
.margin-t-extra { margin-top: 30px; }
.continue { border-top: 1px solid #ddd; width: 660px; padding-top: 23px; margin-top: 25px; }

/* Common TDs */
.nav { background-color: #FFF; padding: 15px 0px 0px 25px; font-size: 12px; width: 955px; height: 169px; line-height: 17px; }
.nav ul { list-style-type: none; padding: 0px; margin: 0px; }
.nav li { display: block; float: left; padding: 5px 31px 0px 0px; }
.hide, .hide-me, .footer .hide-me { display: none; }
.small { font-size: 13px; line-height: 16px; }

.header-box { background-color: #FFF; background-repeat: no-repeat; background-position: bottom left; }
.content { background: white; padding: 0px 0px 44px 25px; }
.content .half { width: 450px; padding: 0px 25px 0px 30px; }
.content p { width: 660px; }
.content div p { width: auto; }

.canvas { border-bottom: solid 1px #cecece; border-top: solid 1px #cecece; }

.grass { color: #fff; font-size: 19px; line-height: 26px; padding-top: 10px; padding-bottom: 10px; text-shadow: #aaa 0px -1px 0px; }
.grass a { color: #8c7d2a; text-shadow: #aaa 0 -1px 0; }
.grass a:hover { color: #6f6116; text-shadow: #bbb 0 -1px 0; }

.title { padding-top: 18px; font-size: 24px; line-height: 33px; }
.float-r { float: right; }
.float-l { float: left; }
.h-ul, .subtitle ul, .footer ul { list-style-type: none; padding: 0px; margin: 0px; }
.h-li, .subtitle li, .footer li { display: block; float: left; }
.list-tiny { padding-right: 10px; }
.list-s { padding-right: 35px; }
.subtitle ul { height: 38px; }
.subtitle li { font-size: 12px; line-height: 14px; height: 38px; margin-right: 18px; }
.subtitle ul li a, .subtitle span { display: block; padding: 5px 14px 0 39px; height: 30px; background: no-repeat top left; }
.subtitle ul li a:hover, .subtitle span { background-position: 0 -37px; }
.subtitle img { float: left; }

/* Quote Form */
#quote-form li { float: left; padding-right: 28px; }
input.input-text, input#username, input#password, #quote-form textarea { padding: 6px 4px; border: dashed 1px #a17c5f; background: #f9f9f9; width: 150px; font-size: 14px; margin: 0; }
input.input-text:hover { background: #fff; }
#quote-form label { color: #8E6442; font-size: 15px; width: 134px; display: inline-block; zoom: 1; *display:inline; line-height: 40px; }
#quote-form .red { color: red; font-size: 20px; }
#quote-form option { font-size: 12px; padding: 2px 0 2px 2px; }
#quote-form select { font-size: 12px; }
#quote-form .select-wrapper { line-height: 38px; padding-bottom: 20px; }

input.input-submit { background: #6e4726 url(images/bdqcustom/button.png) repeat-x top; border: none; color: #fff; font-size: 16px; padding: 10px 12px 11px; text-shadow: #333 -1px -1px 0; margin-top: 10px; display: block; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; cursor: pointer; }
input.input-submit:hover { background: #FF6800; text-shadow: #777 -1px -1px 0; }
input.input-submit:active { background: #694a31; border-color: #694a31; }
#quote-form input.formError { border-color: red; }

/* Subtitle */
.subtitle { overflow: hidden; padding: 4px 25px 0; height: 42px; margin-bottom: 10px; border-left: solid 1px #95b5d1; border-right: solid 1px #95b5d1; border-bottom: solid 1px #95b5d1; border-top: solid 1px #444; font-family: "Lucida Grande", Arial, sans-serif; background: #4183cb url(images/subtitle.png) repeat-x top center; }
.ui-dialog-titlebar { background: #effbff url(images/subtitle.png) bottom center repeat-x; }
.subtitle a { color: #CCECA6; text-shadow: #888 0px -1px 0px; }
.subtitle a:hover, .subtitle span { color: #fff; text-shadow: #888 0px -1px 0px; }

/* Gray Menu */
.empty { color:#b2b4bc; line-height:16px; padding: 2px 5px 0px 5px; font-size: 12px; width: 160px; }

/* Common img style */
img { border: none; padding:0px; margin: 0px;}
.border { border: solid 1px #97ba70; }
.portfolio-li .border, img.border { border: solid 1px #ddd; }
.border-b { border-right: solid 1px #97ba70; border-left: solid 1px #97ba70; }
.border-t { border-top: solid 1px #97ba70; }
.border-no-b { border-bottom: none; }
.border-no-t { border-top: none; }
.border-a { border: solid 1px #97ba70; }
.border-none { border: none; }
.border-bot { border-bottom: solid 1px #97ba70; }
.float-top-right { float:right; clear: right; padding-left: 12px; }
.float-top-left { float:left; clear: left; padding-right: 12px; }
.alt-border { border-color: #e87b45; }

/* Ask */
.q1 { width: 530px; padding: 8px 15px 0px 0px; float: left; clear: left; overflow: hidden; }
.q1 h3 { padding: 0px; margin: 0px; }
.q1 p { padding-top: 5px; margin: 0px; }
.q2 { width: 160px; padding: 9px 0px 0px 10px; height: 308px; border-left: solid 1px #cecece; float: right; font-size: 12px; line-height: 18px; overflow: hidden; }
.q2 p { padding: 5px 0px 5px 4px; margin: 0px; border-bottom: 1px dotted #cecece; }

#search_button{ margin-left: 70%; }
#search_popup{ position: absolute; top: 76px; left: 12px; }	
#searchField.error{ background-color: #FC0; }
div.suggestions{ width: 265px; background-color: #FFF; cursor: pointer; padding: 8px 4px 4px 10px; border-bottom: 1px solid #cecece; border-right: 1px solid #cecece; border-left: 1px solid #cecece;}
div.suggestions:hover{ background-color: #eafcff; }


/*
    ColorBox Core Style
    The following rules are the styles that are consistant between themes.
    Avoid changing this area to maintain compatability with future versions of ColorBox.
*/
.colorbox-img { display: inline-block; zoom: 1; *display:inline; width: 110px; height: 66px; padding: 7px; margin: 5px 5px 5px 0; background: url(images/color-box.png); no-repeat top left; } 
.colorbox-img:hover { background-position: 0 -80px; }

#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative; overflow:hidden;}
#cboxLoadedContent{overflow:auto;}
#cboxLoadedContent iframe{display:block; width:100%; height:100%; border:0;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}

/* 
    ColorBox example user style
    The following rules are ordered and tabbed in a way that represents the
    order/nesting of the generated HTML, so that the structure easier to understand.
*/
#cboxOverlay{ background:#000; }

#colorBox{}
    #cboxTopLeft{width:25px; height:25px; background:url(images/color-box/border1.png) no-repeat 0 0;}
    #cboxTopCenter{height:25px; background:url(images/color-box/border1.png) repeat-x 0 -50px;}
    #cboxTopRight{width:25px; height:25px; background:url(images/color-box/border1.png) no-repeat -25px 0;}
    #cboxBottomLeft{width:25px; height:25px; background:url(images/color-box/border1.png) no-repeat 0 -25px;}
    #cboxBottomCenter{height:25px; background:url(images/color-box/border1.png) repeat-x 0 -75px;}
    #cboxBottomRight{width:25px; height:25px; background:url(images/color-box/border1.png) no-repeat -25px -25px;}
    #cboxMiddleLeft{width:25px; background:url(images/color-box/border2.png) repeat-y 0 0;}
    #cboxMiddleRight{width:25px; background:url(images/color-box/border2.png) repeat-y -25px 0;}
    #cboxContent{background:#fff;}
        #cboxLoadedContent{margin-bottom:20px;}
        #cboxTitle{position:absolute; bottom: -5px; height: 23px; left:0; text-align:center; width:100%; font-weight: bold; }
        #cboxCurrent{position:absolute; bottom:0px; left:81px; color:#999;}
        #cboxSlideshow{position:absolute; bottom:0px; right:42px; color:#444;}
        #cboxPrevious{position:absolute; bottom:0px; left:0; color:#444;}
        #cboxNext{position:absolute; bottom:0px; left:38px; color:#444;}
        #cboxLoadingOverlay{background:#fff url(images/loading.gif) no-repeat 5px 5px;}
        #cboxClose{position:absolute; bottom: 0; right:0; display:block; color:#444; height: 15px; width: 25px; z-index: 8000; background: url(images/color-box/close.png) no-repeat bottom right; }

/*
    The following fixes png-transparency for IE6.  
    It is also necessary for png-transparency in IE7 & IE8 to avoid 'black halos' with the fade transition
    
    Since this method does not support CSS background-positioning, it is incompatible with CSS sprites.
    Colorbox preloads navigation hover classes to account for this.
    
    !! Important Note: AlphaImageLoader src paths are relative to the HTML document,
    while regular CSS background images are relative to the CSS document.
*/
.cboxIE #cboxTopLeft{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/color-box/borderTopLeft.png, sizingMethod='scale');}
.cboxIE #cboxTopCenter{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/color-box/borderTopCenter.png, sizingMethod='scale');}
.cboxIE #cboxTopRight{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/color-box/borderTopRight.png, sizingMethod='scale');}
.cboxIE #cboxBottomLeft{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/color-box/borderBottomLeft.png, sizingMethod='scale');}
.cboxIE #cboxBottomCenter{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/color-box/borderBottomCenter.png, sizingMethod='scale');}
.cboxIE #cboxBottomRight{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/color-box/borderBottomRight.png, sizingMethod='scale');}
.cboxIE #cboxMiddleLeft{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/color-box/borderMiddleLeft.png, sizingMethod='scale');}
.cboxIE #cboxMiddleRight{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/color-box/borderMiddleRight.png, sizingMethod='scale');}