@charset "UTF-8";
@media all
{
  html * {font-size:100.01%; }
  body {
	background:#fafafa url(../../images/background.jpg) top center no-repeat;
	padding:0;
	font-family:Arial, Helvetica, sans-serif;
	color:#636466;
	font-size:12px;
	height:100%;			
  }
  .body-small {
  color:#000000;
  font-size:11px;
  }
 	a.body-small:link {
	color: #b4231b;
	text-decoration: none;
	padding-left: 0px;
}
	a.body-small:visited {
	color: #b4231b;
	text-decoration: none;
	padding-left: 0px;
}
	a.body-small:hover {color: #000000;
	text-decoration: none;}

  textarea, pre, code, kbd, samp, var, tt {
	font-family:Arial, Helvetica, sans-serif;
  }
  h1,h2,h3,h4,h5,h6 {
    font-family:Arial;
    font-weight:normal;
    margin:0 0 0.25em 0;
  }
 
  h1 { font-size:26px; color:#b4231b; font-weight:bold;}                       /* 30px */
  h2 { font-size:18px; color:#000000;}
 /* h2 { font-size:200%; color:#000000;}                         24px */
  h3 { font-size:12px; color:#b4231b; font-weight:bold;}
  h4 { font-size:150%; color:#b4231b;}                       /* 18px */
 /*  h4 { font-size:133.33%; }                    16px */
  h5 { font-size:116.67%; }                    /* 14px */
  h6 { font-size:116.67%; }                    /* 14px */

  ol li { list-style-type:decimal; }
  ol ol li { list-style-type:lower-latin; }

  li { margin-left:0.8em; line-height:1.5em; }

  dt { font-weight:bold; }
  dd { margin: 0 0 1em 0.8em; }

  /* --- general text formatting | Allgemeine Textauszeichnung ------------------------------------------ */

  p { line-height:1.5em; margin: 0 0 1em 0; }

  blockquote, cite,q {
    font-family:Arial;
    font-style:italic;
  }
  blockquote { margin: 0 0 1em 1.6em; color:#666; }

  strong,b { font-weight:bold; }
  em,i { font-style:italic; }

  pre, code, kbd, tt, samp, var {font-size: 100%; }
  pre, code { color: #800; }
  pre { line-height: 1.5em; margin: 0 0 1em 0; }
  kbd, samp, var { color: #666; }
  var { font-style: italic; }

  acronym, abbr {
    border-bottom: 1px #aaa dotted;
    font-variant: small-caps;
    letter-spacing: .07em;
    cursor: help;
  }

  sub, sup { font-size: 91.6667%; }

  hr {
    color: #fff;
    background:transparent;
    margin: 0 0 0.5em 0;
    padding: 0 0 0.5em 0;
    border:0;
    border-bottom: 1px #eee solid;
  }

  /*--- Links ----------------------------------------------------------------------------------------- */
	 contact{
	 }
	  a.contact:link,
	  a.contact:visited { color:#000000; text-decoration:underline; }
	  a.contact:hover { color:#ffffff; text-decoration:underline; }
	  
  a {
	color: #666;
	background:transparent;
	text-decoration:none;
	}
  a:visited  {
	color: #666;
	}

  a:focus,
  a:hover,
  a:active {
	color:#000;
	text-decoration:none;
	}


  /* --- images (with optional captions) | Bilder (mit optionaler Bildunterschrift) ------------------ */

  p.icaption_left { float:left; display:inline; margin: 0 1em 0.15em 0; }
  p.icaption_right { float:right; display:inline; margin: 0 0 0.15em 1em; }

  p.icaption_left img,
  p.icaption_right img { padding:0; border: 1px #888 solid; }

  p.icaption_left strong,
  p.icaption_right strong { display:block; overflow:hidden; margin-top: 2px; padding: 0.3em 0.5em; background: #eee; font-weight: normal; font-size: 91.667%; }

 /**
  * ------------------------------------------------------------------------------------------------- #
  *
  * Generic Content Classes
  *
  * (en) standard classes for positioning and highlighting
  * (de) Standardklassen zur Positionierung und Hervorhebung
  *
  * @section content-generic-classes
  */

  .highlight { color: #f60; }
  .dimmed { color: #888; }

  .info { background: #f8f8f8; color: #666; padding: 10px; margin-bottom: 0.5em; font-size: 91.7%; }

  .note { background: #efe; color: #040; border: 2px #484 solid; padding: 10px; margin-bottom: 1em; }
  .important { background: #ffe; color: #440; border: 2px #884 solid; padding: 10px; margin-bottom: 1em; }
  .warning { background: #fee; color: #400; border: 2px #844 solid; padding: 10px; margin-bottom: 1em; }

  .float_left { float: left; display:inline; margin-right: 1em; margin-bottom: 0.15em; }
  .float_right { float: right; display:inline; margin-left: 1em; margin-bottom: 0.15em; }
  .center { display:block; text-align:center; margin: 0.5em auto; }

 /**
  * ------------------------------------------------------------------------------------------------- #
  *
  * Tables | Tabellen
  *
  * (en) Generic classes for table-width and design definition
  * (de) Generische Klassen für die Tabellenbreite und Gestaltungsvorschriften für Tabellen
  *
  * @section content-tables
  */

  /*table { width: auto; border-collapse:collapse; margin-bottom: 0.5em; border-top: 1px #ccc solid; border-bottom: 1px #ccc solid; }*/
  table { width: auto; border-collapse:collapse;}
  table caption { font-variant:small-caps; }
  table.full { width: 100%; }
  table.fixed { table-layout:fixed; }

  /*th,td { padding: 0.5em; }*/
  thead th { color: #000; border-bottom: 2px #800 solid; }
  tbody th { background: #e0e0e0; color: #333; }
  tbody th[scope="row"], tbody th.sub { background: #f0f0f0; }

  tbody th { border-bottom: 1px solid #fff; text-align: left; }
  tbody td { border-bottom: 0px solid #eee;}

  /********************* Quick Solution Code by dang.nguyen@giaiphapnhanh.com*************************/
  div#grouptop {
	 width:auto;
	 height:100%;
	 min-height:30px;
	}
	
	div#topmenu {
		float:left;
		width:26%;
		text-align:center;
		}
		
	div#toolbar {
		float:left;
		width:48%;
		text-align:center;
		}
		
	div#login {
		float:right;
		width:26%;
		text-align:center;
		}
		
	div#top {
		width:100%;
		width:100%;
		float:left;
		text-align:center;
		}
		
	div#content-bottom {
		width:100%;
		float:right;
		text-align:right;
		border:red;
		height:75px;
		}
		
	div#bottom {
		width:100%;
		float:left;
		text-align:center;
		}
		
	div#bottom-equal {
		width:100%;
		float:left;
		text-align:center;
		}
		
	div#groupfooter { 	
		width:auto;
	 	height:20px;
		min-height:20px;
		padding-left:216px;
		vertical-align: bottom;
		}
		
	div#client {
		float:left;
		width:50%;
		text-align:left;
		font-size:11px;
		color:#666;
		vertical-align: bottom;
		}
		
	div#footer {
		float:right;
		width:100%;
		text-align:right;
		font-size:11px;
		color:#666;			
		vertical-align: bottom;
		}
		
	/*	<!-- *******************Acticle Detail*********************/
	span.createdate {
		color:#CCC;
		font-size:12px;
	}
	
	span.createby {
		color:#ccc;
		font-size:12px;
	}
	
	span.modifydate {
		color:#ccc;
		font-size:12px;
	}
	
	ul.pagination {
		display:inline;
		text-align:center;
	}
	
	ul.pagination li {
		list-style:none;
		list-style-type:none;
		list-style-image:none;
		list-style-image:none;
		display:inline;
		text-align:center;
	}
	
	div.componentheading {
		padding:5px 5px 10px 5px;
		font-size:25px;}
		
	div.buttonheading {
		padding:10px 5px 10px 5px;}
		
	div.blog_more {
	}
	
	div.blog_more div {
		padding-bottom:15px;
		overflow:hidden;}
	/* --> *********************End Acticle Detail******************** */	
	/* --> *********************Custom CSS for Articles******************** */	
	.contact-left{
		padding:275px 0 0 50px;
		color: #000000;
		width: 430px;
	}

	.contact-right{
		width:446px;
		padding:75px 0 0 40px;
		color: #000000;
	}
	
	.author-input{
		padding: 6px 0 6px 25px;
	}

	.getaquote{
		padding:175px 0 0 50px;
		color: #000000;
		width: 961px;
	}
	
	.quote-column{
		padding:0 1em 0 0;
	}

	.quote-row{
		padding:0.5em 0 0.5em 0;
	}
	
	
	/* --> *********************Custom CSS for Forms******************** */	
	
	.contact-name{
		background: url(http://www.matchboxdesigngroup.com/images/i-name.png) no-repeat scroll 3% 50%;
		background-color:#FFF;
		border: #999 1px solid;
		padding: 6px 0 6px 30px;
	}

	.contact-company{
		background: url(http://www.matchboxdesigngroup.com/images/i-company.png) no-repeat scroll 3% 50%;
		background-color:#FFF;
		border: #999 1px solid;
		padding: 6px 0 6px 30px;
	}
	
	.contact-email{
		background: url(http://www.matchboxdesigngroup.com/images/i-email.png) no-repeat scroll 3% 50%;
		background-color:#FFF;
		border: #999 1px solid;
		padding: 6px 0 6px 30px;
	}
	
	.contact-phone{
		background: url(http://www.matchboxdesigngroup.com/images/i-phone.png) no-repeat scroll 3% 50%;
		background-color:#FFF;
		border: #999 1px solid;
		padding: 6px 0 6px 30px;
	}

	.contact-address{
		background: url(http://www.matchboxdesigngroup.com/images/i-phone.png) no-repeat scroll 3% 50%;
		background-color:#FFF;
		border: #999 1px solid;
		padding: 6px 0 6px 30px;
	}
	
	.contact-rfp{
		background-color:#FFF;
		border: #999 1px solid;
		padding: 6px 0 6px 6px;
		width:300px;
	}

	.contact-city{
		background-color:#FFF;
		border: #999 1px solid;
		padding: 6px 0 6px 6px;
	}
	
	.contact-state{
		background-color:#FFF;
		border: #999 1px solid;
		padding: 5px 6px 5px 3px;
	}

	.contact-zip{
		background-color:#FFF;
		border: #999 1px solid;
		padding: 6px 0 6px 6px;
	}
	
	.contact-deadline{
		background-color:#FFF;
		border: #999 1px solid;
		padding: 6px 0 6px 6px;
	}

	.contact-budget{
		background-color:#FFF;
		border: #999 1px solid;
		padding: 5px 6px 5px 3px;
	}
	
	.contact-budget-cell{
		padding: 0 0 0 15px;
	}

	.contact-role{
		background-color:#FFF;
		border: #999 1px solid;
		padding: 6px 0 6px 6px;
	}
	
	.contact-project{
		background-color:#FFF;
		border: #999 1px solid;
		padding: 4px 10px 0px 6px;
	}

	.contact-list{
		line-height: 2em;
		padding:0.5em 0 0.5em 0;
	}
	
	.contact-button{
		font-size:12px;
		font-family:Arial,sans-serif;
		font-weight:bold;
		color:#FFFFFF;
		width:100px;
		height:28px;
		background-color:#B4231B;
		border-style:none;
		cursor: pointer;   
	}

	.contact-button2{
		font-size:12px;
		font-family:Arial,sans-serif;
		font-weight:bold;
		color:#FFFFFF;
		width:125px;
		height:28px;
		background-color:#B4231B;
		border-style:none;
		cursor: pointer;   
	}

	.contact-reset{
		font-size:12px;
		font-family:Arial,sans-serif;
		font-weight:bold;
		color:#B4231B;
		width:100px;
		height:28px;
		background: transparent;
		border: #B4231B 2px solid;
		cursor: pointer;   
	}
	div.logo {
  		/*background:url(../../images/logo.png) top left no-repeat;*/
  		background:url(../../images/logo.gif) top left no-repeat;
   		width:196px;
	  	height:77px;
	  	position:absolute;
	  	left:0;
	  	top:0;
	  	z-index:10;
	}
	/* --> *********************Custom CSS for pages******************** */	

	.page{
	background-color:#FFF;
	background-image: url(http://www.matchboxdesigngroup.com/images/stories/bg.jpg);
	background-repeat: no-repeat;
	}

	div.page-padding{
	padding: 40px;
}

	div.page-padding-left{
	padding: 20px 0 0 0;
}

	div.page-padding-right{
	padding: 20px 0 0 40px;
}

	div.services-box{
	padding: 0 25px 25px 0;
}

	div.overview{
		font-size:18px;
		font-family:Arial,sans-serif;
		color:#666666;
	}
	
	div.people-thumbs{
		font-size:18px;
		font-family:Arial,sans-serif;
		color:#666666;
	}
	
		div.casestudy-box{
	padding: 0 25px 25px 0;
	/*havent set yet but will be for google landing page case studies*/
}
		div.casestudy-openingparagraph{
	padding: 25px 0 0 0;
	/*havent set yet but will be for google landing page opening paragraph*/
}
		div.casestudy-sidebar{
	padding: 0 0 0 25px;
	/*havent set yet but will be for google landing page sidebar*/
}

/* --> *********************Custom CSS for case studies******************** */	

	#CSText{
	position: absolute;
	top: 160px;
	z-index: 1;
	}
	}