/* MAF Design and Build Main Stylesheet
 *
 * (c) Tom Duncalf 2007
 * http://www.tomduncalf.co.uk
 * tduncalf@gmail.com */

html
{
   padding: 0 10px;
   padding-bottom:0;
}

body
{
   font-family: Arial, sans-serif;
   font-size:100.01%;
   /*background:url(../images/triangles_bg.png) no-repeat right 345px;*/
}

#container
{
   width:950px;
   margin-left:auto;
   margin-right:auto;
}

.floatLeft
{
   float:left
}

.floatRight
{
   float:right
}

.center
{
   text-align:center
}

.hide
{
   display:none
}

.print
{
   display:none
}

.small
{
   font-size:10px !important;
}

.light
{
   color:#808080;
}

a
{
   text-decoration:none;
   color:black
}

a:hover
{
   text-decoration:underline
}

em
{
   font-style:italic;
}

/* Header styles */

#header
{
   margin-bottom:15px;
}

#headerTop
{
   height:67px;
   padding-top:5px;
   border-bottom:3px solid black;
   font-size:12px;
}

#headerImage
{
   position:relative;
   margin-bottom:3px;
}

#headerTop, #headerTop a
{
   color:#b8b5b3;
}

#headerLogo
{
   float:left
}

#headerContactDetails
{
   width:179px;
   padding-top:2px;
   float:right;
   text-align:right
}

#header ul
{
   list-style:none;
}

#header ul li
{
   float:left;
}

#menu
{
}

#menu li, #menu a
{
   width:117px;
   height:60px;
   display:block
}

#menu li.current
{
   border-bottom:3px solid #c2c2c2;
}

#menu li.current a
{
   background-position:117px 0;
}

#menu li
{
   margin-right:3px;
   background-position:0 0;
}

#header li span
{
   display:none
}

#menu a:hover
{
   background-position:117px 0;
}

#menuHome
{
   background:url(../images/menu_home.jpg);
}

#menuAboutUs
{
   background:url(../images/menu_about-us.jpg);
}

#menuServices
{
   background:url(../images/menu_services.jpg);
}

#menuCaseStudies
{
   background:url(../images/menu_case-studies.jpg);
}

#menuTestimonials
{
   background:url(../images/menu_testimonials.jpg);
}

#menuContact
{
   background:url(../images/menu_contact.jpg);
}

ul#logos
{
   float:left;
   height:60px;
   width:230px;
   background:url(../images/menu_logos.png) 0 0;
}

ul#logos a
{
   height:60px;
   display:block;
}

#logoFMB
{
   width:66px;
}

#logoBNI
{
   width:83px;
}

#logoGMC
{
   width:81px;
}

/* Main styles */

#main
{
   float:left;
   width:717px;
   margin-right:3px;
   font-size:13px;
}

h1
{
   font-size:18px;
   padding-bottom:3px;
   font-weight:bold;
   border-bottom:2px solid #c6c6c6;
   height:21px;
   margin-bottom:15px;
}

#main h2, #main p, #main ul, #right p
{
   line-height:19px;
   padding-right:15px;
   margin-bottom:19px;
}

#main h2
{
   font-size:13px;
   font-weight:bold;
}

#main ul
{
   margin-left:0;
   list-style:none;
}

#main ul li
{
   padding-left:20px;
   /*background:url(../images/li-maf.gif) 0 -2px no-repeat;*/
   background:url(../images/link_li.png) no-repeat 0 8px;
}

#main .dropcap
{
   display:block;
   background:#333;
   color:white;
   float:left;
   height:27px;
   padding:7px 4px;
   padding-bottom:0;
   font-size:36px;
}

p.topMargin
{
   margin-top:19px
}

/* Right styles */

#right
{
   float:left;
   width:230px;
   font-size:13px
}

#right h2
{
   margin-bottom:15px;
   padding-bottom:4px;
   padding-top:4px;
   font-size:13px; /* or 12? */
   font-weight:bold;
   border-bottom:2px solid #d8d8d8;
   height:16px;
   color:#333;
}

#right ol
{
   line-height:19px;
   list-style:none
}

#right div.section
{
   margin-bottom:16px;
   /* 16 or 36? */
}

#right #callback
{
   position:relative
}

#right #callback p
{
   margin-bottom:5px
}  

#right #callback .small
{
   display:block;
   margin-top:-2px;
   padding-bottom: 2px;
}

#right .callbackModal
{
   position:absolute;
   top:0;
   left:0;
   background:#fff;
   width:100%;
   height:100%;
   opacity:0.9;
   filter:alpha(opacity=90);
   display:none;
   height:230px;
}

#right .callbackModal h4
{
   font-weight:bold;
   margin-bottom:10px;
   padding:10px;
   padding-top:25px;
}

#right .callbackModal p
{
   margin-bottom:10px;
   padding:10px;
}

#right .callbackModal button
{
   float:none;
   width:auto;
   margin-top:10px;
   padding:3px 10px;
}

#right #links ul
{
   font-size:11px;
   list-style:none;
   line-height:19px;
}

#right #links ul li
{
   background:url(../images/link_bg.png) no-repeat;
   padding-left:25px;
   padding-top:1px;
   margin-bottom:-1px;
}

/* Latest projects on homepage */

#right #latestProjects h2
{
   margin-bottom:19px
}

#right #latestProjects ul
{
}

#right #latestProjects li 
{
   list-style:none;
   width:226px;
   height:54px;
   overflow:hidden;
   border:1px solid #707070;
   border-bottom:0;
   padding:1px;
   position:relative;
}

#right #latestProjects img
{
   opacity:0.6;
   filter:alpha(opacity=60)
  
}

#right #latestProjects li:hover img
{
   opacity:1;
   filter:alpha(opacity=100)
}

#right #latestProjects li:hover h3
{
   display:block
}

#right #latestProjects li.last
{
   border-bottom:1px solid #707070;
}

#right #latestProjects li a
{
   overflow:hidden
}

#right #latestProjects li h3
{
   display:none;
   position:absolute;
   bottom:0;   
   right:0;
   margin:1px;
   padding:1px 5px;
   background:black;
   color:white;
   font-size:12px;
   font-weight:bold;
   text-align:right;
}

#right #latestProjects li h3 span
{
   font-weight:normal;
   display:block;
}

/* Form styles */

input, textarea, button
{
   font-family: Arial, sans-serif;
   font-size:11px;
   border:1px solid #A0A0A0;
}

button
{
   cursor:pointer
}

label
{
   font-size:11px;
   display:block
}

#right label
{
   margin-top:-2px;
   height:21px;
}

#right label span
{
   display:block;
   width:60px;
   float:left;
   clear:both;
}

#right input, #right textarea
{
   padding:1px 2px;
   float:left;
   width:164px;
   margin-top:-2px;
}

#right input.checkbox
{
   width:auto;
   border:0;
   margin-top:-1px;
   padding:0;
   float:right;
}

#right label.long span
{
   width:auto;
   padding-right:10px;
}

#right button
{
   float:right;
   width:170px;
   margin-top:-4px;
   background:#eaeaea;
}

/* Right hand gallery */

#right #gallery
{
   margin-bottom:11px;
}

#right #gallery ul
{
   list-style:none;
   padding-top:5px
}

#right #gallery li
{
   display:block;
   width:68px;
   height:64px;
   border:1px solid #aaa;
   margin-right:10px;
   margin-bottom:10px;
   float:left;
   overflow:hidden;
}

#right #gallery li.last
{
   margin-right:0
}

/* Latest blog posts styles */

#right #latestBlogPosts 
{
   margin-bottom:1px;
}

#latestBlogPosts ol
{
   margin-top:-2px;
   margin-bottom:1px
}

#latestBlogPosts li
{
   background:url(../images/blog-post_bg.png) no-repeat;
   padding-top:2px;
   padding-left:25px;
   clear:both;
   margin-bottom:36px;
}

#latestBlogPosts li.last
{
   margin-bottom:0
}

#latestBlogPosts .blogTitle a
{
   font-size:14px;
   font-weight:bold;
   color:#333;
}

#latestBlogPosts .blogTitle a:hover
{

}

#latestBlogPosts .blogDate, #latestBlogPosts .blogComments
{
   font-size:10px;
}

#latestBlogPosts .blogDate, #latestBlogPosts .blogDate a
{
   color:#636363;
}

#latestBlogPosts .blogDate
{
   float:left;
}

#latestBlogPosts .blogComments
{
   float:right;
   color:#909090;
}

#latestBlogPosts .blogComments a
{
   color:#909090;
}

#latestBlogPosts .blogLink
{
   float:right;
   font-size:11px;
   padding:0;
   padding-top:13px;
   margin-bottom:0;
}


/* Image styles */

.image
{
}

.imageRight
{
   float:right;
   margin-right:7px;
   padding-left:15px;
}

.threeCol
{
   width:343px;
}

.twoCol
{
   width:237px
}

.image img
{
   border:1px solid #A0A0A0;
   padding:3px;
   background:white
}

#main .image p
{
   float:right;
   font-size:11px;
   margin-right:-8px;
   margin-top:-1px;
   padding:0px 5px;
   border:1px solid #A0A0A0;
/*   background:url(../images/image_caption-bg.png) repeat-x;*/
   background:#f8f8f8;
/*   border-bottom:2px solid #909090; */
}

#main .image p, #main .image a
{
   color:#777;
}

/* Page specific styles */

#homepageServicesUl li
{
   width:143px;
   float:left;
}

/* Footer styles */

#footer
{
   border-top:3px solid #333;
   font-size:14px;
   padding:10px 0;
   clear:both;
   position:relative;
   top:10px;
   padding-top:20px;
}

#footer ul
{
   display:block;
   list-style:none;
   width:120px;
   float:left;
   clear:right;
   line-height:13px;
}

#footer #footerUlContact
{
   width:117px;
}

#footer h4
{
   font-weight:bold;
   font-size:14px;
   width:120px;
   float:left
}

#footerContact
{
   border-bottom:1px solid #919191;
   height:54px;
   margin-bottom:15px
}

#footerContact div
{
   width:120px;
   float:left;
}

#footerContact div span
{
   display:block;
   font-size:11px;
   margin-top:2px;
   color:#404040;
}

#footerMain
{
   clear:both;
   border-bottom:1px solid #d8d8d8;
   padding-bottom:24px;
}

#footer ul li.top, #footer ul li.more, #footer ul li.less
{
   font-weight:bold;
   color:black
}

#footer ul li.less
{
   display:none
}

#footerSitemap
{
   float:left;
   width:717px;
   margin-right:3px;
   font-size:11px;
}

#footerSitemap div, #footerLinks div
{
   clear:left;
}

#footerSitemap, #footerSitemap a, #footerLinks, #footerLinks a
{
   color: #222;
}

#footerLinks
{
   float:left;
   width:230px;
   font-size:11px;
}

#footerLinks ul
{
   width:230px
}

#footerLinks li
{
/*   padding-left:20px;
   background:url(../images/link_li.png) no-repeat 0 6px;*/
}

#footerLinks h4
{
   width:230px;
}

#footerLinks h4, #footerSitemap h4
{
   padding-bottom:4px;
   padding-top:4px;
   border-bottom:1px solid #cdcdcd;
   margin-bottom:6px;
}

#footerSitemap h4
{
   width:717px;
   border-bottom:1px solid #c5c5c5;
}

#footerBottom
{
   clear:both;
   padding-top:7px;
   padding-bottom:10px;
}

#footerBottom div
{
   float:left;
   font-size:11px;
}

#footerMaf
{
   font-weight:bold;
   width:240px;
}

#footerAddress
{
   width:480px;
   color:#404040;
}

#footerCredit, #footerCredit a
{
   color:#666666;
}

/* Services */

#servicesDiv .service
{
   width:308px;
   height:115px;
   border:1px solid #666;
   position:relative;
   margin-right:10px;
   float:left;
   margin-bottom:10px;
   overflow:hidden;
   cursor:pointer;
}

#servicesDiv .endService
{
   margin-right:0;
}

#servicesDiv .serviceImage
{
   width:102px;
   height:80px;
   overflow:hidden;
   float:left;
   border-right:1px solid #666;
   background:black;
}

#servicesDiv .image2
{
}

#servicesDiv .image3
{
   border-right:0
}

#servicesDiv .serviceImage img
{
   opacity:0.85;
   filter:alpha(opacity=85)
}

#servicesDiv .service:hover .serviceImage img
{
   opacity:1;
   filter:alpha(opacity=100)
}

#servicesDiv .serviceText
{
   border-top:1px solid #777;
   height:38px;
   background:#fff;
   clear:both
}

#servicesDiv h3
{
   font-weight:bold;
   background:white;
   padding:3px 6px;
   font-size:14px;
   position:absolute;
   bottom:0;
   right:0;
   border:1px solid #999;
/*   width:92px;*/
   text-align:right;
   border-bottom:0;
   border-right:0;   
   width:90px;
}

#servicesDiv .wide h3
{
   min-width:90px;
   width:auto;
}

#servicesDiv h3 a
{
   color:#222;
}

#servicesDiv a.clickable
{
   position:absolute;
   top:0;
   left:0;
   width:308px;
   height:115px;
}

#servicesDiv a span
{
   display:none
}

#servicesDiv a:hover
{
   text-decoration:none
}

/* Grid testing - remove this */

#gridtest
{
   padding-top:13px;
}

#gridtest div
{
   float:left;
   background:#ccc;
   width:308px;
   border:1px solid black;
   height:115px;
   margin-right:10px;
   margin-bottom:10px;
   opacity:0.5;
}

#gridtest div.last
{
   margin-right:0
}

#gridtest2
{
   padding-top:11px;
}

#gridtest2 div
{
   float:left;
   background:#ccc;
   width:304px;
   height:115px;
   margin:0;
   margin-right:18px;
   margin-bottom:7px;
   opacity:0.5;
}

#gridtest2 div.last
{
   margin-right:0;
   width:306px;
}