/*
--=.._/(        Miracle Play Systems     )\_..=--
    	  */


/*
Completed by Christoph Saxe, ISITE Design


--------- Notes -----------

* html {anything} addresses IE < 6 browser bugs
*+html {anything} addresses IE 7 browser bugs

------- typography ---------

font-sizes are set in em for resizable goodness.  Here's a basic guide for the stylesheet.
font-size: .75em; 	= 9px
font-size: 0.835em; = 10px
font-size: .9175em; = 11px
font-size: 1em; 	= 12px
font-size: 1.085em; = 13px
font-size: 1.165em; = 14px
font-size: 1.25em;  = 15px
font-size: 1.335em; = 16px
font-size: 1.415em; = 17px
font-size: 1.5em;	= 18px
font-size: 1.585em; = 19px
font-size: 1.665em; = 20px
font-size: 1.75em; = 21px
font-size: 1.835em; = 22px
font-size: 1.915em; = 23px
font-size: 2em; = 24px

font colors:
	base body color: #333333;
		
link colors:
	main content a: #0000ff;
	main content hover: #999999;
	
Problemmatic div names 
content
primary
secondary

*/

/* Basic browser reset  */
body,div,h1,h2,h3,h4,h5,h6,p,ul,ol,li,dl,dd,dt,blockquote,button,fieldset,legend,label,input,textarea,form { margin:0;padding:0;border:0; }
html,input,textarea,select { font-size: 100% } /*keep ie happy*/

body { 
	background-color: #666;
	color: #000;
	font: 75%/1.335 Arial, Helvetica, sans-serif; 	
}
h1, h2, h3, h4, h5, h6	{ font-weight: normal; margin: 0 0 .25em 0;}

h1	{ font-size: 2em; } 	/* 24px */
h2	{ font-size: 1.665em; } /* 20px */
h3	{ font-size: 1.415em; } /* 17px */
h4	{ font-size: 1.25em; } 	/* 15px */
h5	{ font-size: 1em; } 	/* 12px; */
h6	{ font-size: .9175em; } /* 11px; */

p	{ margin-bottom: 1em; }

input, textarea { border: 1px solid #242323; }
button {
	border: 2px solid #666;
	cursor: pointer;
	padding:.1em .3em;
	}
	button:hover {
		background-color:#666;
		border-color:#ccc;
		color:#ccc;
		}

ul, ol 	{ margin: 0 0 1em 3em; }
table	{ border-collapse: collapse; }
td		{ border: 1px solid #ccc; padding: .5em;  }




/*------------------------------------------------------LAYOUT----*/
/*Set full page column width*/
#wrapper {
	background-color: #fff;
	border: 1px solid #000;
	margin: 0 auto 26px;
	padding:40px 0 0;
	position:relative;
	text-align: left;
	width: 816px;
}

#header {
	background:transparent url(../img/dev/bg_header.jpg) 0 0 no-repeat;
	height:171px;
	width:816px;
	}
	#brand {
		background:transparent url(../img/dev/logo.gif) 0 0 no-repeat;
		display:block;
		height:97px;
		margin-top:-40px;
		overflow:hidden;
		position:relative;
		text-indent:-9999em;
		width:193px;
		z-index:10;
		}

#content{
	background: transparent url(../img/dev/bg_content.jpg) right top no-repeat;
	overflow:hidden;
	padding: 15px;
	width:785px;
  /* border: 1px solid #000; */

}


#footer {
	background:#fff url(../img/dev/bg_footer.gif) right top no-repeat;
	border-top:2px solid #ccc;
	clear:both;
	color:#666;
	font-size:.91em;
	height:3.36em;
	margin:12px auto 0;
	padding:.6em .4em;
	padding-right:487px;
	text-align:left;
	width:299px;
	}
	#footer .footer-links {
		display:block;
		padding:1px 0 3px;
		}

/* single column paragraph fix just for ie6. prevents long paragraphs from blowing out the width of #content. */
* html .layout_one-column #content p { width:784px; }

/* two-column layout pages. */
.layout_two-column #wrapper {
	background:transparent url(../img/dev/bg_two-column.gif) 0 0 repeat-y;
	}
	


#primary {
	float:right;
	width:573px;
} 
#secondary {
	float:left;
	padding-bottom:12px;
	width:173px;
	}
	
/* Design Center */

  #content-inner  /* PRIMARY */
  {
   float:right;
   width:573px;
  }

  #sidebar-left-inner  /* Secondary */
  {
	float:left;
	padding-bottom:12px;
	width:173px;
   margin-top:25px;


  }

/* numbering/paging */

  .faceted-search-numbering
  {
	 float:left;
  }

  .pager2
  {
	 float:right;
  }


/* design center end */

/*------------------------------------------------------Navigation----*/
#nav {
	background:transparent url(../img/dev/bg_nav.gif) 0 0 repeat-x;
	border-bottom:2px solid #000;
	height:38px;
	line-height:38px;
	list-style:none;
	margin:0;
	position:absolute; top:0; left:0;
	padding:0 0 0 200px;
	width:616px;
	z-index:1;
	}
	#nav li {
		display:inline;
		padding:0 18px 0 0;
		}
		#nav li a {
			color:#fff;
			font-size:1.083em;
			text-decoration:none;
			}
			#nav li.on a {
				cursor:default;
				color:#0a0203;
				}
			#nav li a:hover { text-decoration:underline; }
				#nav li.on a:hover { text-decoration:none; }

/* .nav is for the left nav */
ul.nav {
	border-top:1px solid #ccc;
	list-style:none;
	font-size:1.17em;
	margin:0;
	padding:0;
	}
	.nav li {
		border-bottom:1px solid #ccc;
		padding:.3em;
		}
	.nav li.on, .nav li.ui-tabs-selected { background-color:#dedede; }
	.nav a {
		color:#333;
		display:block;
		text-decoration:none;
		}
	.nav a:hover { text-decoration:underline; }
	.nav .on a:hover, .nav .ui-tabs-selected a:hover {
		cursor:default;
		text-decoration:none;
		}
		
	.nav strong { 
		color:#454545;
		display:block;
	}

	

/*------------------------------------------------------Typography----*/

h1 {
	font-size:2.6em;
	font-weight:bold;
	color:#fff;
	margin:0;
	position:absolute; top:116px; left:15px;
	text-transform:uppercase;
	}
	*+html h1 {top:156px;}
	* html h1 {top:156px; }

h2 {
	font-size:1.33em;
	font-weight:bold;
	text-transform:uppercase;	
	}
h3 {
	font-size:1.17em;
	font-weight:bold;
	margin-top:1em;
	}
	h3 span.note { font-size:.857em; font-weight:normal; }

a { text-decoration:none; }
a:hover { text-decoration:underline; }

a.cad-details { 
	background:#efefef url(../img/dev/CADdetails_logo.png) 0 0 no-repeat;
	border:1px solid #efefef;
	clear:left;
	float:left;
	height:24px;
	line-height:24px;
	margin:1em 0 0;
	padding:0 8px 0 123px;
	}
	
a.linkedin {
	background:transparent url(../img/dev/linked-in.png) 0 0 no-repeat;
	float:left;
	height:32px;
	margin-top:18px;
	text-indent:-9999em;
	width:119px;
	}

/* newsletter signup link */
#signup_bug {
	float:right;
	margin:12px 0 12px 12px;
	overflow: hidden;
	text-align:center;
	width:173px;
	}
#secondary #signup_bug {
	float:none;
	margin:36px 0 0;
	}
	
	.signup {
		background:transparent url(../img/dev/bg_sign-up.gif) 0 0 no-repeat;
		display:block;
		height:53px;
		text-indent:-9999em;
		width:166px;
		}
	.signup:hover { background-position:0 -53px; }

/* testimonials link */
#testimonials_bug {
	float:right;
	margin:12px 0 12px 12px;
	overflow: hidden;
	text-align:center;
	width:173px;
	}
#secondary #testimonials_bug { float:none; margin-left:0;}
	
	.testimonial {
		background:transparent url(../img/dev/btn_testimonials.gif) 0 0 no-repeat;
		display:block;
		height:55px;
		text-indent:-9999em;
		width:168px;
		}
	.testimonial:hover { background-position:0 -55px; }

/* videos link */
#videos_bug {
	float:right;
	margin:12px 0 12px 12px;
	overflow: hidden;
	text-align:center;
	width:170px;
	}
#secondary #videos_bug { float:none; margin-left:0;}
	
	.video {
		background:transparent url(../img/dev/btn_video.png) 0 0 no-repeat;
		display:block;
		height:55px;
		text-indent:-9999em;
		width:170px;
		}
	.video:hover { background-position:0 -55px; }




/*------------------------------------------------------Lists----*/

ul.dp_layout, ul.item_list, ul.resources {
	list-style:none;
	margin:0;
	padding:0;
	}
	.dp_layout li {
		margin: 0 0 1.3em;
		}
	.item_list li {
		margin:0 0 .5em;
		overflow: hidden;
		}
	.item_list img {
		border:1px solid #ccc;
		margin:0 6px 0 0;
	}

ul.faq {
	font-size:1.17em;
	font-weight:bold;
	list-style:none;
	margin-left:0;
	}
	.faq dl {
		font-size:.857em;
		font-weight:normal;
		margin:.7em .5em 1.2em;
		}
		.faq dt {font-weight:bold;}
		.faq dd {margin:0 0 .7em;}
			.faq dd ul {
				list-style:disc;
				margin-bottom:0;
				}
			.faq dd ol { margin-bottom:0; }
			.faq dd p { margin:0 0 .3em; }
			
/* News story listing on home page */
#news ul {
	list-style:none;
	margin:0;
	padding:0;
	}
	#news li p { margin-bottom:.3em; }
/* data dl - dt on left and bold */
dl.data { overflow:hidden; }
.data dt, .data dd { margin:0 0 .167em; }
.data dt {
	float:left;
	font-weight:bold;
	padding:0 .5em 0 0;
}

/* DEPRICATED */
/* Design Center lists */
ul.design_center, .design_center ul { clear:both; list-style:none;}
	* html ul.design_center {width: 600px;}
.design_center li {
	font-size:16px;
	font-weight:bold;
	text-transform:uppercase;
	}
.design_center a.cad-details {
	font-size:12px;
	font-weight:normal;
	margin:-8px 0 1em;
	text-transform:none;
	}
	.design_landing .design_center li { text-transform:none; }
	.design_center li p {
		font-size:12px;
		font-weight:normal;
		text-transform:none;
		}
	.design_center li li {
		cursor:pointer;
		font-size:14px;
		margin-top:.5em;
		text-transform:none;
		}
		.design_center li span.over { color:#A41F20; }
		.design_center .file_list li {
			font-size:12px;
			font-weight:normal;
			}
	.design_center .accordian {display:none;}
/* END DEPRICATED STYLES */




/*------------------------------------------------------Portfolio Page----*/

#gallery_image { 
	background:transparent url(../img/dev/bg_gallery-image.gif) 0 0 repeat-x;
	min-height:315px;
	_height:315px;
	padding:6px;
	width:272px;
	}
	#gallery_image img {
		display:block;
		border:1px solid #fff;
		}
		#browse_controls {
			margin-top:12px;
			overflow:hidden;
			}
			#browse_controls a {
				color:#fff;
				font-weight:bold;
				text-transform:uppercase;
				text-decoration:none;
				}
				#browse_controls a:hover { color:#0a0203; }
			#browse_controls .back { float:left; }
			#browse_controls .next { float:right; }
#content_images {
	width:495px;
	float:right;
	list-style:none;
	margin:0;
	padding:0;
	z-index: 1;
}
	#content_images li {
		border:1px solid #771516;
		display:inline; /* for ie6 */
		float:left;
		margin:0 0 10px 10px;
		padding:4px;
		}
	#content_images li.current { 
		border:5px solid #771516;
		padding:0;
		}
		#content_images li a {  }
		#content_images li img { border:none; display:block; height:79px; width:79px;}

.portfolio #signup_bug { float:none; }
.portfolio #testimonials_bug { float:none; }



/*------------------------------------------------------Downloads Page----*/

.section {
	border-bottom:2px solid #ccc;
	margin:0 0 1em;
	padding:0 0 1em;
	}
#links {
	float:left;
	width:310px;
	}

#videos{
    overflow: hidden;
}

#player {
	float: right;
	margin-left: 20px;
    width: 400px;
}
* html #documents {
    clear: both;
}


/*------------------------------------------------------Home Page----*/

.home #header {
	background:none;
	height:0;
	width:0;
	}
.home #content { 
	background:none;
	overflow:visible;
}
	*+html .home .iefix { margin-top:-220px; }

.home .showhide {
	display:none;
	margin-top:-220px;
	}
	*+html .home .showhide { margin-top:0; }
	* html .home #showhide01 { top: -200px !important; position: relative;  }
	.home .showhide .dp_wraparound {
		float:right;
		height:240px;
		width:212px;
		}
/*.home #news {
	margin-top:-220px;
	}
*+html .home #news { margin-top:0; }*/
	.home #news ul {margin-bottom:24px; }
	* html #news ul { float:left; }
	*+html #news ul { float:left; }
	.home #news .dp_wraparound {
		float:right;
		height:190px;
		width:356px;
		}
.home .callouts {
	float:left;
	margin:0 0 18px;
	position:relative;
	z-index:100;
	width:780px;
	}
	.home #news .callouts div { float:left; margin:0 44px 0; }
	.home #news .callouts div { display:inline; }

.home #brand {
	margin:0;
	position:absolute;
	top:0; left:0;
	}

/*-----------------------------------------------Testimonials Page----*/

ul.testimonials{ list-style-type: none; margin: 0; padding: 0;}
	ul.testimonials li {
		border-bottom: 1px solid #ddd;
		margin-bottom: 1.5em;
		overflow: hidden;
		padding: 1.5em 1em;
	}
	
	ul.testimonials li img {float: left; margin: 0 10px 10px 0; }
	* html ul.testimonials li {height: 1%;}
	* html ul.testimonials li img {width: 175px;}
	* html ul.testimonials blockquote { float:  left; width: 560px; }
	* html #wrapper #content ul.testimonials p { float:  left; width: 560px;}

	div.author { margin-left: 185px;}


/*------------------------------------------------------Contact Page----*/

.contact-page p img{float: left; margin: 0 10px 10px 0;}
.contact-page p {overflow: hidden; clear: left;}
* html .contact-page #signup_bug { position: relative; }
* html body.contact-page #wrapper #content p{width: auto;}  /* otherwise <p>s are getting a width of 784px....from....?? */


/*------------------------------------------------------Login Form----*/

/* DEPRICATED */
/* Login will be removed from CSS after new Design Center is integrated */
.home form { width:300px; }

form ol {
	list-style:none;
	margin:0;
	padding:0;
	}
	form li {
		overflow:hidden;
		padding:0 0 .7em 0;
		}
.home fieldset {
	font-size:1.17em;
	margin:-.4em 0 0 0;
	padding:30px 0 0 12px;
	}
.home legend {
	text-indent:-9999em;
	margin-top:-1em;
	}
.home label {
	float:left;
	font-weight:bold;
	padding-right:.3em;
	text-align:right;
	width:5.7em;
	}
.home input { width: 133px; }
button.login {
	background:transparent url(../img/dev/btn_login.gif) 0 0 no-repeat;
	border:none;
	height:33px;
	text-indent:-9999em;
	width:62px;
	}
	*+html button.login { float:left; }
	* html button.login { float:left; }
	button.login:hover { background-position: 0 -33px;}

.home form li.action { padding-left:6em; }
.forgotpassword { font-size:.75em; }

/* END DEPRICATED */



/*------------------------------------------------------ search form ----*/

.search {
	padding: 1em 0 0;
}
.search input {
	border:1px solid #ccc;
	padding:2px;
	width:167px;
}
.search button.btn { float:right; }





/*------------------------------------------------------ Buttons ----*/

button.btn {
	background:transparent url(../img/dev/bg-button-left.png) left 1px no-repeat;
	border:none;
	padding:0 0 0 12px;
}
button.btn:hover { 
	background-position:left -32px;
	color:#000;
}
a.btn {
	background:transparent url(../img/dev/bg-button-left.png) left top no-repeat;
	color:#000;
	border:none;
	float:left;
	padding:0 0 0 14px;
}
a.btn:hover { background-position:left -33px; text-decoration:none; }
.btn span {
	background:transparent url(../img/dev/bg-button-right.png) right top no-repeat;
	display:inline-block;
	padding:7px 14px 7px 0;
}
.btn:hover span { background-position:right -33px; }
*+html button.btn { background-position: left 2px; margin-right:-8px; padding-left:8px; }
*+html .btn:hover { background-position: left -31px; margin-right:-8px; padding-left:8px; }


/*------------------------------------------------------Tabs----*/

.ui-tabs-hide { display:none; }

.tabs .sub { padding-left:.6em; }


/*------------------------------------------------------ Design Center ----*/

.filters .nav { font-size:1em; }
.filters  { }
.faceted-search-facet h3 { 	
	font-size:1.17em;
	font-weight:bold;
	margin-top:1em; 
	}
/*landing (browse) page specific*/
.design-center p.contact {
	float:right;
	margin-top:-2em;
}

.results-inner { 
 /* margin-top:32px; */
	
	 }
.result-count { 
	clear:both;
	float:left;
	margin:0;
	width:49%;
}
.result-count a { padding-left:1em; }

/*
.pager {
	float:right;
	text-align:right;
	width:49%;
}
.pager ul,
.pager li { border:none; }

.pager-item
{
	margin:0;
	padding:0;	
	
}
*/

.results-inner ul {
	border-top:2px solid #ccc;
	clear:both;
	list-style:none;
	margin:0;
	padding:0;
	zoom:1; /* IE7 */
}
	.results-inner li {
	/*	border-bottom:2px solid #ccc; */
		margin:0;
		overflow:hidden;
		padding:1em 6px 1em 156px;
	}
	.results-inner li img {
		border:1px solid #771516;
		float:left;
		margin:0 0 0 -150px;
		padding:2px;
	}
	.results-inner li h3 { margin:0 0 .5em; }
	.results-inner li a.btn { float:right; }
	
	/* custom data list */
	.results-inner .data { margin-bottom:.5em; }
	.results-inner .data dt, .results-inner .data dd {
		float:none;
		display:inline;
		margin:0;
		padding-right:.25em;
	}
	.results-inner .data dd { padding-right:.75em; }
	.results-inner .data dd:last-child { padding-right:0; }

/*----------------------------------------- Design details ---------*/

#design { overflow:hidden; }
#details {
	float:left;
	width:279px;
}
#details .data { font-size:1.083em; margin-bottom:1em; }
#images #gallery_image {	
	float:right;
	background-color:#771516;
	background-position:left bottom;
	margin:0 0 1em 10px;
	min-height:196px;
	width:272px;
}
	#browse_controls .count {
		float:left;
		text-align:center;
		width:184px;
	}
	#images .js .image-link { display:none; }
	#images .js a.on { display:block; }
#dimensions { 
	float:left;
	margin:0 0 18px;
	padding:0 10px 0 0;
	width:281px;
}
#downloads {
	float:left;
	margin:0 0 18px;
	width:282px;
}

#concept-ready-designs { 
	border:2px solid #ccc;
	border-width:2px 0;
	clear:both;
	margin:18px 0;
	overflow:hidden;
	padding:12px 0 12px 2px;
}
#concept-ready-designs .item_list { 
	overflow:hidden;
	margin:12px -5px 0 0;
	width:576px;
}
#concept-ready-designs .item_list li {float:left; text-align:center;}
#concept-ready-designs .item_list img { border-color:#771516; display:block; padding:2px; }
#concept-ready-designs .item_list a { color:#000; font-weight:bold; }
#concept-ready-designs .item_list a:hover {text-decoration:none;}

p.questions { font-size:1.167em; font-weight:bold; }



/*----------------------------------------- Widgets ---------*/

.pager ul, .pager li {
	display:inline;
	list-style:none;
	margin:0;
}
.pager li { 
	color:#5f5f5f;
	font-weight:bold;
	padding:0 .083em;
}
.pager a { font-weight:normal; }
.pager .prev { font-weight:normal; padding:0 .25em 0 0; }
.pager .next { font-weight:normal; padding:0 0 0 .25em; }

#image-zoom {
	background:#fff none;
	padding:12px 12px 0;
	position:absolute; top:50%; left: 50%;
}
#image-zoom .close {
	font-size:14px;
	font-weight:bold;
	overflow:hidden;
	padding:4px 0 6px;
}
#image-zoom .close span {
	background:transparent url(../img/dev/bg_close.gif) right top no-repeat;
	cursor:pointer;
	float:right;
	height:16px;
	padding-right:18px;
	
}
#image-zoom .close span:hover { background-position:right -16px; }




/* DEPRICATED */
/* this will be removed after integration of new design center */
#sign-up-form {
	margin: 0 auto;
    width: 300px;
}

#sign-up-form form ul{
    list-style-type: none; margin: 0;
	}
#sign-up-form form li{
    margin-bottom: .6em;
	}
#sign-up-form input, #sign-up-form select, #sign-up-form textarea, #sign-up-form label, #sign-up-form button {
    display: block;
	}
#sign-up-form input{
	border: 1px solid #bbb;
    padding: 2px 1px;
	width: 200px;
}
#sign-up-form button{
    cursor: pointer;
	}
#sign-up-form input[type=hidden]{
    border: none;
	display: none;
}
/* END DEPRICATED */


/*------------------------------------------------------jqModal for Newsletter signup----*/

.jqmWindow {
    background-color: #fff;
    border: none;
    color: #000;
    display: none;
	height:224px;
    margin-left: -177px;
	overflow:hidden;
    padding: 0 2px;
    position: fixed; top: 17%; left: 50%;
    width: 342px;
}
.jqmOverlay { background-color:#000; }
.wbx-gw-wrapper {display:none;}
.jqmHeader {
	height:16px;
	overflow:hidden;
	padding:2px 0 6px;
	width:342px;
	}
span.jqmClose {
	background:transparent url(../img/dev/bg_close.gif) 0 0 no-repeat;
	cursor:pointer;
	display:inline;
	float:right;
	height:16px;
	text-indent:-9999em;
	width:16px;
	}
	span.over { background-position: 0 -16px; }


/*------------------------------------------------------Utilities----*/

.showhide {display:none;}
.left { float:left; }