/* --------------------------- */
/* Stylesheet Imports 		   */
/* --------------------------- */
@import url(import/reset.css);
@import url(import/typography.css);






/* --------------------------------------------------------------------- */
/* GENERAL RULES ------------------------------------------------------- */
/* --------------------------------------------------------------------- */

body {background: url(../../skin/images/metal.gif) repeat; padding:0; margin:0;
	
}

/*** HEADER **  LIGHT BLUE PAPER BG **/
#header {position:absolute; top:0; left:0; width:100%; height:198px; min-height:198px; background:url(../../skin/images/header-bg.png) top left repeat-x;}

#header #h-frame {width:1100px; position:relative; margin:0 auto;}
/* --------------------------------------------------------------------- */
/* MENU ------------------------------------------------------------- */
/* --------------------------------------------------------------------- */

#advert {float:left; position:absolute; top:100px;}
#logo {position:absolute; left:300px; margin:0 auto;}

#navigation /**** NAV IMG BG SPRITE **/
{width:360px; height:86px; position:absolute; top:116px; *top:96px; left:776px;
 }

ul#menu {width:360px; position:relative;  margin: 0px auto; list-style:none;}

ul#menu li { display: inline;*overflow:hidden; }

ul#menu li a {display:block; float:left; height:67px; background:url(../../skin/images/nav.png);  text-indent:-9999px;}

/** menu up **/
ul#menu li a.p1 {width:55px; background-position:0 0; }
ul#menu li a.p2 {width:80px; background-position:-50px 0; }
ul#menu li a.p3 {width:60px; background-position:-130px 0; }
ul#menu li a.p4 {width:60px; background-position:-190px 0; }
ul#menu li a.p5 {width:50px; background-position:-252px 0; }
ul#menu li a.p6 {width:50px; background-position:-300px 0; }

/** menu hover **/
ul#menu li a.p1:hover {width:55px; background-position:0 -70px; }
ul#menu li a.p2:hover  {width:80px; background-position:-50px -70px; }
ul#menu li a.p3:hover  {width:60px; background-position:-130px -70px; }
ul#menu li a.p4:hover  {width:60px; background-position:-190px -70px; }
ul#menu li a.p5:hover  {width:50px; background-position:-252px -70px; }
ul#menu li a.p6:hover  {width:50px; background-position:-300px -70px; }




#frame {margin:0 auto; width:1100px; }

/* WHITE PAGE BG */
.inner {width:1100px; min-height:100%;  background:url(http://www.buildingblocksusa.net/bbp/skin/images/pagebackground.png) repeat top center; padding:0;  margin-top:200px; *position:relative; *top:0px;  }


.rounded {
	-webkit-border-radius: 6px;
	-khtml-border-radius: 6px;	
	-moz-border-radius: 6px;
	border-radius: 6px;
	border: 1px solid #e8e8e8;
}

li {
	list-style-image: circle;
	margin:0 0 5px 0;
}



/* --------------------------- */
/* Intro & Text Content   */
/* --------------------------- */

#content-frame {width:1000px; position:relative; top:25px; margin:0 auto ; color: #000;  padding-bottom:15px;  }
#content-frame .floatL {float:left; padding:0px 0px 0px 0px;}
#content-frame p {padding:0 5px 0 5px;}
#content-frame h1 {background:url(../../skin/images/h1_bg.png) bottom left repeat-x;  margin:15px auto 20px auto;  text-align:center; font-size:24px; letter-spacing:3px;  width:1000px; }
#content-frame h1.short {border-bottom:thin silver solid; position:relative; margin:5px auto 20px auto; *margin-top:40px; float:left; text-align:center; font-size:24px;  letter-spacing:2px;}





/********** SUB BLOCK*****/

#sub-block { position:relative; margin:25px 10px 1px 10px; padding:5px 0 0 5px; clear:both;  min-height:140px;}
#sub-block span {padding:7px 5px 5px 20px ; float:right;}
#sub-block span a:hover{opacity:.5;  filter: alpha(opacity = 50);}



/********** Check Marks UL *****/
#checks {position:relative; float:left; padding-top:13px;  }
#checks img {float:left; padding-right:10px; margin-left:45px;}
#checks li {color:#242424; font-size:16px; letter-spacing:3px; font-family:Arial, Helvetica, sans-serif; line-height:30px; font-style:italic; }


/* --------------------------- */
/* IntroDuction Text   */
/* --------------------------- */
#intro {clear:both; position:relative; margin:80px 0 0 0;  padding:35px 0 100px 0; min-height:400px; /* ie 7 */ *margin:0; *padding:0 0 100px 0; }
#intro h1 {width:1000px; text-align:center; font-size:24px; letter-spacing:5px; color: #900;  }
#intro p {margin:20px 0 0 0; padding:10px 10px 10px 15px; font-size:16px; }


/
/* --------------------------------------------------------------------- */
/* GRID CONTAINER STYLING ---------------------------------------------- */
/* --------------------------------------------------------------------- */

#grid-content {position:relative; left:0px; min-width:1100px; max-width:1100px;
	min-height:500px; margin:20px auto ;  overflow:hidden; /* background: url(../../Building%20Blocks/skin/images/paperbg.jpg);  background: #0FF;*/
}
#grid-content .box { /* Polaroid */ float:right;
	width:201px; max-width:201px;
	height:185px; max-height:185px;
	overflow: hidden;
	background: url(../../skin/images/woody.jpg);  
	margin: 5px;
	padding: 9px 9px;
	}

.box a:hover {opacity:.75;  filter: alpha(opacity = 75);}

.box div.ceebox img {
margin-bottom:-6px !important;
}

#grid-content .proof {
	height: 19px;
	overflow: hidden;
	}
	
#grid-content .proof {
	color: #999;
	font-size: 12px;
	font-style: italic;
	text-transform: capitalize;
	}

#grid-content .company {
	font-style:italic;
	}
	
#grid-content .company a:hover {background-color: #666;

	color:#FFF; cursor:default;
	}

.box img{
	padding: 1px;
	border: 1px solid  #999;
}

.box h2 {
	margin:8px 0 0 0;
}

.pagination{background: white; padding: 10px;}
.pagination span, .pagination a{margin-right: 5px}


/*** BORDERS ***/
.red-border {border:10px solid red;}
.yellow-border {border:10px solid yellow;}
.green-border {border:10px solid green;}
.orange-border {border:10px solid  #C30;}
.red-border {border:10px solid red;}
.blue-border {border:10px solid  #09C;}
.gray-border {border:10px solid gray;}
.purple-border {border:10px solid  #636;}

/* --------------------------------------------------------------------- */
/* FOOTER -------------------------------------------------------------- */
/* --------------------------------------------------------------------- */

#footer{background: url(../../skin/images/footer-bg.png) repeat; height:330px; max-height:330px; width:100%; bottom:0px; left:0px; margin-top:20px; position:relative;}

/*******************************FBG************************/
.FBG { width:1000px; margin:0 auto;  }
.FBG h2 { font:normal 24px Arial, Helvetica, sans-serif; color:#ffffff; padding:5px 0 5px 40px; }
.FBG p { font:normal 12px Arial, Helvetica, sans-serif; color:#a3a3a3; line-height:14px; }

/*****Testimonials*****/
.Testimonials { width:290px; position:relative; left:15px; top:15px; float:left; }
.Testimonials h2 { background: url(../../skin/images/h2_test.png) left no-repeat; }
.Testimonials a { float:right; font:bold 11px Tahoma, Geneva, sans-serif; color:#fff; text-decoration:none;  padding-right:25px; margin-top:-10px;}
/**********Partner NEWS********/
.Company { width:300px; position:relative; left:100px; top:15px;padding:0 10px; float:left;  }
.Company h2 { background: url(../../skin/images/h2_company.png) left no-repeat; }
.Company .data { margin:2px 0; padding:0; background:url(images/bg_data.gif) no-repeat left; width:74px; height:21px; float:left; text-align:center; font:bold 13px Tahoma, Geneva, sans-serif; color:#727272; }
/********Con******/
.Con { width:300px; position:relative; left:100px; top:15px; padding:0 10px; float: right; }
.Con a { font:normal 11px Arial, Helvetica, sans-serif; color:#097a9a; text-decoration:none; }
.Con h2 { background: url(../../skin/images/h2_contact.png) left no-repeat; }
.Con p {line-height:13px;}


/**************SUBLINKS************/
.sublinks {clear:both; height:68px; position:relative; top:35px; width:1000px; margin:0 auto; padding:20px 0px 5px 0;  *padding-top:20px; background: url(../../skin/images/tape.png) repeat-x top center;}
.sublinks span { margin:0 20px; letter-spacing:3px; }
.sublinks span a:hover{ color:#666;} 



/********** footer details & info**********/
.details {position: relative;  top:10px; width:1000px;  text-align:center; margin:0 auto;}
.details div p {width:600px; margin:0 auto; letter-spacing:3px;}
.details #facebook {position:relative; width:200px; float:right; display:inline; top:30px; left:30px; *left:23px; }
.details #url {position:absolute; width:600px; margin:0 auto; top:39px; left:150px;}
.details #leapfish {position:absolute; width:200px; float:left; display:inline; top:13px; left:-10px;}

.details #copyright {position:relative; left:100px;}
.ian-logo{position:absolute; top:-2px;  left:273px;}



img.bordered{border:1px solid #C8C8C8;padding:2px;}
.gallery-hider{display: none !important;}


/********** STANDARDS *****/

.floatL {float:left;} .floatR {float:right;}

.blue {color:#03c;}
.yellow {color:#FF0;}
.red {color:#F00;}
.orange {color:#C60;}
.gray {color:#666;}
.black {color:#000;}


.v-spacer {height:200px;}
.horizon {border-top: thin dashed silver; width:100%; min-width:650px; min-height:5px;}
.margin25 {margin-top:25px; position:relative;}
.clear  {width:100%; border-bottom:thin silver solid;}

/*PNG white overlay w/dashed border */
.overlay {background:url(../../skin/images/overlay.png) repeat; border:thin dashed #CCC; }

/*************************** SUB PAGE SPECIFIC CSS ********************************************/

/**** About Us / History ***/
#mid-container {position:relative; *margin-top:20px;}
#mid-container p{font-size:13px;}

/* Content
------------------------------------------------------*/

.sub-content {background:white; border:thin dotted silver; padding:5px; margin:10px 0; min-height:120px;}

#left-content {width:650px; float:left; background:url(assets/images/left-divider.png) top left repeat-y; padding:0 5px 0 25px; margin-bottom:45px; position:relative;}
#left-content .shadow-link {position:inherit; float:left; top:10px; *top: 0px; right:5px;  margin-right:15px; width:100px; height:20px; background: #D7D7D7; border:thin dashed black;  font-size:9px; text-align:center;}
#left-content .shadow-link a:hover{color:#06C;}

#right-content {width:280px; float:right; margin:10px 0 0 0; padding:0 0 0 40px; background:url(assets/images/right-divider.png) top left repeat-y; min-height:400px;}
#right-content h3{text-decoration:underline;}

h4 {letter-spacing:3px; margin:2px 0;}	

.f-group{ border:thin dotted silver; margin:10px 0;
	padding:10px 0 5px 10px;
	float:left;
}

front-content{
	width:250px;
	float:left; 
}

.front-content span{float:left; width:670px; }

.front-content span h3{float:left; margin:2px 0 -20px 15px; clear:both;}
.front-content span p {position:relative; float:left; clear:both; margin-top:-10px;}

#quote{
	width:630px;
	margin:20px 30px 10px 0px;
	float:left;
}
#quote h4{
	color:#9e9e9e;
	line-height:22px;
	font-style:italic;
}
#quote p {float:right; font-size:11px;}

.imgcenter-border{
	float:left; 
	margin:0px 0px 10px 0px;
	padding:2px;
	border:1px solid #d3d3d3;
}
blockquote{
	font-style:italic;
	margin:0px;
	color:#6e7a7f;
	padding:0px 4px 2px 38px;
	background-image: url(assets/images/quote.gif);
	background-position:0px 5px;
	background-repeat:no-repeat;
	float:left;
}
.ads-list {margin:2px 0 0 0;}
.ads-list a{color: #666; letter-spacing:2px; padding:5px;} 
.ads-list a:hover {color:#FFF; background:#666;}
.hide {display: none;}
.i-frame{width:500px;height:400px;overflow:auto; border:thin solid silver; padding:10px; font-style:italic;} /*fancybox popup dimensions */
.i-frame h4 {margin:8px 0 2px 0; text-decoration:underline; letter-spacing:2px;}

#closing {position:relative; top:50px; width:980px;}


/*END PORTFOLIO ITEMS*/

/*Contact Page*/
.contact-details {
	width: 620px;
	float:left;
	
}

#contact-wrapper {
	width:620px; background:url(../../skin/images/metal.gif) repeat; border:thin dotted white;
}
#contact-wrapper div {
	clear:both;
	margin:1em 0;
}
#contact-wrapper label { min-width:45px;
	display:block;
	float:left;
	width: auto;
	padding:0px 5px; margin-right:5px; color:#FFF; 
}
form#contactform input {
	background: #f6f6f6;
	border: 1px solid #e7e7e7;
	width: 540px;
	padding:3px;
	color: #000;
}
form#contactform textarea {
	font-family:Arial, Tahoma, Helvetica, sans-serif; 
	font-size:100%; 
	width: 540px;
	padding: 3px;
	background: #f6f6f6; color: #000;
	border: 1px solid #e7e7e7;
}

form#contactform .contactsubmit {
	width: 61px; float:left;  position:relative; top:10px; *top:50px;
	height: 30px;
	display: block;
	background: url(../images/submit.png) right top no-repeat; *background:none; *color:black;
	cursor: pointer;
	border: 0;
	text-indent: -9999px;
}
/*End Contact Page*/