/*
	Theme Name: Meccabuild Development
	Theme URI: http://www.meccabuild.com
	Description: Template designed and created by Ada Lau Design
	Version: 1.0
	Author: Ada Lau
	Author URI: http://www.adalau.com
*/
/*----Global Reset Courtesy of Eric Meyer----*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
}
.hide {display:none;}
a {
	outline:none;
	color:#48AF13;
	text-decoration: none;
}
a:hover { text-decoration: underline;}


/* Images
----------------------------------------------*/
.alignright {float:right; padding:0 0 10px 10px;}
.alignleft {float:left; padding:0 10px 10px 0;}
.aligncenter {margin: 0 auto 0 auto;}
a img {border:0;}
img.alignnone {padding-bottom:20px;}

/* General
----------------------------------------------*/
.green { color:#5baf2f;}
hr { border:1px solid #CCCCCC; margin:50px 0 30px 0;}
img {margin:5px 0;}
.button {cursor: pointer;}


/* Main Layout
-----------------------------------------------*/

html, body {height: 100%;}

#wrap {min-height: 100%;}

body {
	margin: 0px; padding: 0px;
	background:#fff url(images/bg.gif) repeat-x;
	color: #333;
	font:13px/20px Lucida Grande, Arial, Verdana, Helvetica, sans-serif;
}
#wrap {
	width:100%;
}
#wrapper {
	position:relative;
	width: 960px; 
	margin: 0px auto; padding:0;
}



/* Header Area 
-----------------------------------------------------------*/
#header {
	float:left;
	width:960px; height:121px;
	padding:47px 0 0 0;
	background:url(images/header.png) repeat-y;
}
#logo a {
	float:left;
	display:block;
	width: 404px; height: 77px;
	background:url(images/logo.png) top left no-repeat;
}


/* Top Navigation 
-----------------------------------------------------------*/
#menu-main {margin:0; padding:0;}
#top_nav {
	float:right;
	width:660px;
}
#top_nav ul {
	list-style-type:none;
	margin:11px 0 0 0;
}
#top_nav ul li {
	float:right;
	width:118px; height:33px;
	padding:0 0 0 3px;
}
#top_nav ul li a {
	display:block;
	color:#fff;
	text-decoration:none;
	text-transform:uppercase;
	text-align: left;
	background:url(images/tab.gif) 0 -33px no-repeat;
	height:25px;
	padding:8px 0 0 12px;
	font-size:12px;
}

#top_nav ul li a:hover, #top_nav ul li.current-menu-item a, #top_nav ul li.current-page-ancestor a {
	background:url(images/tab.gif) top left no-repeat; 
	color:#333;
}


/* Sub Navigation 
-----------------------------------------------------------*/
#sub_nav {
	float:left;
	width:780px; height:45px;
	padding:26px 0 0 180px;
	border-bottom:1px solid #ccc;
}
#sub_nav h1, #sub-nav-container h1 { 
	position:absolute;
	top:200px; left:0;
	width:200px; height:23px;
	background: url(images/dark-arrow.gif) 140px -1px no-repeat; 
	font-size:16px;
}
#sub_nav h1 {background:none;}
#sub_nav ul {list-style:none; }
#sub_nav ul li {
	background:url(images/divider.gif) top left no-repeat;
}
#sub_nav ul li a { 
	display:block;
	float:left;
	padding:5px;
	margin:0 35px 0 0;
	text-decoration:none;
	color:#5baf2f;
	font-size:12px;
}
#sub_nav ul li a:hover, #sub_nav ul li.current_page_item a, #sub_nav ul li.current-page-ancestor a { 
	background-color:#48af13; 
	color:#fff;
	font-size:12px;
	font-weight:normal;
	-moz-border-radius: 5px; 
	-webkit-border-radius: 5px;
}


/* Main Body Content Area 
-----------------------------------------------------------*/

#main {
	float:left; 
	width:960px;
	margin-top:20px;
	padding-bottom:90px;
}
.page-id-11 #main { margin-top:40px; } /* contact page */ 

#content {
	float:left;
	width:960px;
}
#content h2, h2 { 
	font-size:16px; 
	color:#222;
	padding-left:0;
	margin: 0 0 8px 0;
}
#content h3 {
	font-size:14px;
	font-weight:bold;
	color:#5baf2f;
	margin: 0 0 8px 0;
}
#content p {
	padding:3px 0 20px 0; 
	color:#333; 
}
#content ul, #content ol {
	margin: 5px 20px 40px 20px; 
	list-style-image: url(images/bullet.gif);
}
#content ul.bullets { 
	list-style:none;
	margin: 0 0 15px 0;
}
#content ul.bullets li { 
	background:url(images/arrow-bullets.gif) top left no-repeat;
	padding:0 0 10px 35px;
}

/* Homepage
-----------------------------------------------------------*/
.home #main { margin-top:0;}

#content-home {
	float: left;
	width:960px; 
	padding-bottom:50px;
}
#content-home h1 {
	font-size:20px;
	font-weight: normal;
	margin: 0 0 8px 0;
}
#content-home h2 {
	font-size:16px;
	color:#222;
	margin: 0 0 8px 0;
}
#content-home h3 { 
	font-size:14px; line-height: 18px; 
	font-weight:normal;
	border-bottom:1px solid #ccc;
	color:#333;
	padding-bottom:15px;
	margin: 0 0 8px 0;
}

#welcome { 
	float:left; 
	width:960px; height:245px; 
    margin:20px 0 0 0; padding:15px 0 50px 0;
	border-top:1px solid #ccc; border-bottom:1px solid #ccc;
	color:#333;
}

#intro { float:left; width:638px; }
#intro p { 
	font-size:13px; line-height:18px;
	padding-top:10px;
}
#intro a {
	display:block;
	width:155px; height:39px;
	background:url(images/company-overview.gif) top left no-repeat;
}

#current-projects {
	float:left;
	width:960px;
	margin:20px 0;
}
#current-projects ul {list-style:none; position:relative;}
#current-projects li {
	float:left;
	width:314px; height:185px;
	margin-right:9px; padding:50px 0 0 0;	
}
#current-projects li.featured-project1 { background:url(images/featured-proj1-bg.jpg) top left no-repeat;}
#current-projects li.featured-project2 { background:url(images/featured-proj2-bg.jpg) top left no-repeat;}
#current-projects li.featured-project3 { 
	background:url(images/featured-proj3-bg.jpg) top left no-repeat;
	margin-right:0;
}
#current-projects p { 
	font-size:12px; line-height:16px;
	padding: 0 17px;
}
#current-projects a {
	position:absolute;
	top:185px;
	background:url(images/view-projects-btn.gif) top left no-repeat;
	width:176px; height:39px;
	display:block; 
}
#current-projects li.featured-project1 a { left:17px;}
#current-projects li.featured-project2 a { left:340px; background:url(images/coming-soon.png) top left no-repeat;}
#current-projects li.featured-project3 a { right:120px; background:url(images/coming-soon.png) top left no-repeat;}

#newsletter { 
	float:right; 
	width:269px; height:280px;
	background:url(images/newsletter.gif) top left no-repeat;
	padding:10px 20px 0 25px;
}
#newsletter h2 {
	font-size:18px; 
	margin:0; padding:5px 0;
}
#newsletter p {padding:0 0 10px 0; color:#333;}
.newsletter-form li#field_1_1, .newsletter-form li#field_1_2, .newsletter-form li#field_1_3 { margin:0; padding:0; height:45px;}
.newsletter-form li#field_1_3 {height:35px;}
.gfield_label {width:100px; float:left; color:#333;}
.gform_wrapper input.button {
	float:right;
	background:url(images/submit.gif) top left no-repeat;
	width:75px; height:45px;
	text-indent:-9999em;
	border:1px solid #f8f7f7;
	margin:0 10px 0 0; padding:0;
}
.gform_body ul {list-style:none;}
.gform_body li {height:45px;}
.gform_body li#field_1_3 {height:30px;}
.gform_wrapper a {outline: 0;}
.gform_wrapper .validation_message {
	color:red;
	font-size:11px;
}
.gform_wrapper .validation_error {display:none;}

#gforms_confirmation_message {
	color:green;
}


/* Company Info Page
-----------------------------------------------------------*/
#content-about {
	float:left;
	width:635px;
}
#content-about p {
	padding:3px 10px 20px 0; 
	color:#333; 
}
#about-sidebar {
	float:right;
	width:314px;
}


/* Projects Page
-----------------------------------------------------------*/
#content ul.featured-project {
	position:relative;
	list-style: none;
	margin:0; padding:0;
}
#content ul.featured-project li {
	float:left;
	width:314px; height:235px;
	padding:0 6px 0 0;
}
#content ul.featured-project li#project1 { background:url(images/featured-proj1-bg.jpg) top left no-repeat; }
#content ul.featured-project li#project2 { background:url(images/featured-proj2-bg.jpg) top left no-repeat; }
#content ul.featured-project li#project3 { background:url(images/featured-proj3-bg.jpg) top left no-repeat; }

#content ul.featured-project a { 
	position:absolute;
	top:180px;
	display:block;
	width:113px; height:39px;
}
#content ul.featured-project li#project1 a { left:17px; background:url(images/view-projects-btn.gif) top left no-repeat;}
#content ul.featured-project li#project2 a { left:335px; background:url(images/coming-soon.png) top left no-repeat;}
#content ul.featured-project li#project3 a { left:655px; background:url(images/coming-soon.png) top left no-repeat;}

#content ul.featured-project p { padding:50px 10px 0 17px; 	font-size:12px; line-height:16px;}

#content-project {
	float:right;
	width:715px;
}
#content-project h2 {
	background:#e5e5e5;
	width:705px; height:45px;
	color:#333;
	padding:30px 0 0 10px;
}

td { font-size:12px; line-height:16px; padding:5px 0;}
td.info {padding-right: 30px;}
table.project-info {margin:0 0 0 10px;}
table.project-info img {margin-left:77px;}
table.project-info p { padding:15px 0 0 77px;}
table.project-info p a { 
	background:url(images/download.gif) no-repeat;
	display:block;
	width:180px; height:39px;
}

/* Unique Project Page
-------------------------------------------*/
.home-features { margin-top:30px;}
.home-features h3 {
	background:#e5e5e5;
	padding:10px;
	font-size:14px;
	font-weight:normal;
	margin-bottom:10px;
}

#home-features-content{
	padding:10px;
}
.home-features ul {margin:5px 0 20px 0;}
.home-features li {margin-left:13px;}

/* Project sidebar 
-------------------------------------------*/
#sidebar {
	float:left;
	width:225px;;
}
#sidebar h2 {
	font-size:16px;
	color:#222;
	margin:15px 0 0 0;
	padding-left:10px 0;
}
#sidebar ul, #project-sidebar li { list-style:none;}
#sidebar ul { border-bottom:1px solid #ddd;}
#sidebar li a { 
	background: url(images/projects.gif) bottom left no-repeat;
	width:170px; height:31px;
	display:block;
	padding: 20px 0 0 55px;
	font-size:12px; color:#222;
	text-decoration: none;
	border-top:1px solid #ddd;

}
#sidebar li.current_page_item a, #sidebar li a:hover {background-position: top left;}



/* Promotion
-------------------------------------------*/
ul#promotion {
	list-style:none;
	margin:15px 0 20px 0; padding:0;
}
ul#promotion li {
	float:left;
	width:235px; height:140px;
	border-right:1px solid #eee;
	padding:0 10px 0 55px;
	margin-right:19px;
}
ul#promotion li.one {background:url(images/1.gif) top left no-repeat;}
ul#promotion li.two {background:url(images/2.gif) top left no-repeat;}
ul#promotion li.three {background:url(images/3.gif) top left no-repeat; border:none;}


/* Contact Page
-------------------------------------------*/
#address {
	float:left;
	width:350px;
}
#address h2 {padding-left:0;}
#content-contact h2 { padding:0 0 10px 0;}
#address table {padding:10px 0; color:#333; font-size:12px;}
/*#address table {border-collapse: collapse;}*/
#address td {padding:0 15px 0 0;}
#content-contact {
	float:right;
	width:610px;
}
#content-contact p { width:450px; }
.message {padding-top:30px;}
.message .gfield {padding-bottom:5px;}
.message #input_2_1, .message #input_2_2, .message #input_2_3, .message #input_2_4 {margin-top:5px; width:200px;}
.message #input_2_5 { width: 400px; margin-top:10px;}
.message input.button { margin-right: 95px;}

/* Send-us-a-message form
-------------------------------------------*/
.gform_wrapper form.send-us-a-message li {
	height:auto;
	padding-bottom:15px;
}
.gform_wrapper form.send-us-a-message li#field_2_1 {margin-top:20px;}
.gform_wrapper form.send-us-a-message input.button { margin-right:40px;}


/*Refer-a-friend Form
-------------------------------------------*/
.gform_wrapper form.refer-a-friend li {
	height:auto;
	padding-bottom:15px;
}
.gform_wrapper form.refer-a-friend li#field_3_1 {margin-top:20px;}
.gform_wrapper form.refer-a-friend input.button { margin-right:40px;}
.gform_wrapper form.refer-a-friend .top_label .gfield_label {margin:0; width:150px;}

/*Book-your-appointment Form
-------------------------------------------*/
.gform_wrapper form.book-appointment li {
	height:auto;
	padding-bottom:15px;
}
.gform_wrapper form.book-appointment li#field_4_1 {margin-top:20px;}
.gform_wrapper form.book-appointment input.button { margin-right:40px;}
.gform_wrapper form.book-appointment .top_label .gfield_label {margin:0; width:150px;}
.gform_wrapper form.book-appointment ul.top_label .clear-multi {clear:none;}
.gform_wrapper form.book-appointment .datepicker {vertical-align: top;}
.gform_wrapper form.book-appointment img.ui-datepicker-trigger {top:0;}
.gform_wrapper form.book-appointment select { padding:0;}

/* Footer area
------------------------------------------------------------*/

#foot {
	position: relative;
	background: url(images/footer.gif) repeat-x;
	margin-top: -90px;
	height: 90px;
	clear:both;
}
#foot p {
	float:right;
	font-size:11px; 
	font-weight:normal;
	color:#666;
	padding-right:10px;
}
#footer {
	width:960px;
	margin:0 auto;
	text-align:right;
	font-size:11px;
	font-weight: normal;
}
#footer a {
	text-decoration:none;
	color:#666;
}
#footer a:hover {
	text-decoration:underline;
	color:#666;
}
#footer ul {list-style: none; padding-top:70px;}
#footer ul li {
	float:right; 
	padding:0 10px;
	border-left:1px solid #666;
}
#footer ul li.copyright {padding-left:35px;}