@import "common/reset.css";

@import "common/grid.css";



/* =Common

----------------------------------------------------------*/

body {

  position: relative;

  background: transparent url(/public/images/bg-top.jpg) top left repeat-x;

  text-align: center;

  font-size: 50%;

}



#page {

  position: relative;

  border: 1px solid #000;

  background: #fff;

  width: 960px;

  margin: 0 auto 20px auto;

  padding-top: 430px;

  top: 10px;

  text-align: left;

}



p, ul, h1, h2, h3, h4, h5, h6 { font-family: Arial, Helvetica, sans-serif; }



p, pre, ul { font-size: 1.6em; line-height: 1.33em; margin: 0 1em 1em 4em; color: #333;}



h2 { 

  font-size: 2em;

  margin: 1.62em 2em 0.5em 2em; 

}



h3 {

  font-size: 1.5em;

  padding: 0.5em 1em;

}



.clear {

  clear: both;

}

.hide { display: none; }
.show { display: block;}


.error {

  color: #dd0000;

}



div.error {

  border: 1px solid #dd0000;

  width: 86%;

  margin: auto;

  background-color: rgb(251,227,228);

  padding-bottom: 10px;

}



div.error li {

  font-size: 12px;

  padding: 0 1em 0 0;

  margin-left: 30px;

}



.small { 

  color: #999;

  font-size: 1.0em;

  margin: 0;

}



strong {

  font-weight: bold;

}



img { border: none;}



/* Links */



/* Page Rounding */

#page-ul, #page-ur, #page-bl, #page-br {

  position: absolute;

  height: 30px;

  width: 30px;

}



#page-ul {

  top: -2px;

  left: -2px;

  background: transparent url(/public/images/page-ul.jpg) top left no-repeat;

}



#page-ur {

  top: 0em;

  right: -934px;

  background: transparent url(/public/images/page-ur.jpg) top right no-repeat; 

}



/* =Branding

----------------------------------------------------------*/

#branding {



}



h1.logo {
  position: absolute;
  top: 30px;
  left: 13px;
  text-indent: -9999px;
  background: transparent url(/public/images/imes-logo.jpg) top left no-repeat;
  width: 336px;
  height: 134px;
}

h1.mpp-logo {
  position: absolute;
  top: 30px;
  left: 13px;
  text-indent: -9999px;
  background: transparent url(/public/images/mpp-logo.jpg) top left no-repeat;
  width: 350px;
  height: 134px;
}



#branding h2.subLogo {

  position: absolute;

  top: 4.2em;

  left: 16em;

  text-indent: -9999px;

  width: 330px;

  height: 54px;

}



#contactButtons {

  position: absolute;

  top: 20px;

  right: 40px;

  width: auto;

  text-align: center;

}



#contactButtons p {

  font-weight: bold;

  margin: 0;

  padding: 0;

}



#banner {

  position: absolute;

  top: -210px;

  left: 0;

  height: 170px;

  padding-bottom: 10px;

  width: 100%;

  background: #ccc url(/public/images/banner-fade.png) bottom left repeat-x;

  border-top: 1px solid #666;

  z-index: 5;

  text-align: left;

}



#banner .pic {

  position: relative;

  margin-top: 15px;

  margin-left: 18px;

  width: 150px;

  height: 135px;

  *margin-top: 8.5px;

}



#banner div {

  position: absolute;

  right: 1px;

  top: 0;

  width: 320px;

  padding: 0;

  height: 100%;

  vertical-align: bottom;

  text-align: center;

}



#banner div p {

  color: #000;

  font-size: 150%;

  text-indent: 0;

  margin: 0;

  padding: 5px 0 0 0;

}



#banner div ul { 

  position: absolute;

  bottom: 14px;

  * bottom: 2px;

  right: -13px;

  margin-bottom: 0; 

  padding: 0; 

}



#banner div li {

  width: 312px;

  text-align: center;

  display: block;

  background: #325597;

  margin-right: 2px;

  height: 24px;

}



#banner div a {

  display: block;

  font-size: 1.1em;

  color: #fff;

  width: 100%;

  text-decoration: none;

  padding: 2px 0;

  border: 1px solid #666;

}



#t_imes:hover, 

#t_service:hover, 

#t_logistics:hover, 

#t_consult:hover, 

#t_parts:hover {

  font-weight: bold;

}







/* =Navigation

----------------------------------------------------------*/



/* nav_main */

#nav_main {

  position: absolute;

  top: 195px;

  left: 15px;

  width: 100%;

  margin: 0;

  padding: 0;

}



#nav_main li {

  float: left;

  background: url(/public/images/tab_right.jpg) no-repeat right top;

  margin: 0;

  padding: 0;

}



#nav_main a:link, #nav_main a:visited, #nav_main a.active {

  display: block;

  padding: 5px 10px;

  text-decoration: none;

  background: url(/public/images/tab_left.jpg) no-repeat left top;

  color: #666;

}



#nav_main a:hover, #nav_main li.active a {

  color: #1e1e1e;

  background: url(/public/images/tab_active_left.jpg) no-repeat left top;

  z-index: 50;

}



#nav_main li.active, #nav_main li:hover {

  background: url(/public/images/tab_active_right.jpg) no-repeat right top;

  margin-bottom: -5px;

}



#nav_main a:hover {

  border-bottom: 1px solid #666;

}









/* =Content

----------------------------------------------------------*/

#content {

  position: relative;

  width: 100%;

  background: #fff url(/public/images/content-bg.jpg) top right repeat-y;

  margin: 0;

  padding: 0;

}



/* Main Content */

#content_main {

  position: relative;

  top: 10px;

  width: 620px;

  float: left;

  margin: 0;

  * margin-top: -10px;

  * text-align: left;  

}



#content_main ul {

  position: relative;

  list-style-type: square;

  * padding-left: 30px;

}



#content_main ol {

  list-style-type: decimal;

}



#content_main li {

  margin-top: 5px;

  margin-left: 10px;

}



/* Sub Content */

#content_sub {

  position: relative;

  float: left;

  width: 300px;

  height: 100%;

  text-align: center;

  margin-left: 25px;

  * top: -10px;

  overflow: hidden;

  padding-bottom: 20px;

}



#content_sub p {

  margin: auto;

}



/* =Forms

----------------------------------------------------------*/

form {

  width: 90%;

  font-size: 1.4em;

  margin: auto;

}



form div {

  margin: 1em;

}



form input, form textarea, form select {

  width: 100%;

  padding: 3.3px 5px;

  font-size: 1.2em;

  font-family: Arial, Helvetica, sans-serif;

}



form input.button {

  width: auto;

  padding: 3.3px 3px;

  float: right;

  font-family: Arial, Helvetica, sans-serif;

  margin-right: 5px;

}



form input.checkbox {

	width: auto;

}



fieldset {

  border: 1px solid #ccc;

  margin-bottom: 20px;

}



fieldset input {

  width: 96%;

}



legend {

  margin-left: 16.2px;

  font-weight: bold;

  color: #aaa;

  font-size: 12px;

}



form #pic1, form #pic2, form #pic3 {

  position: relative;

  margin-top: 15px;

  margin-left: 18px;

}



.box input {

  position: relative;

  /*

  margin-top: -1em;

  * margin-top: -1.5em;

  */  

  width: 150px;

  /* float: left; */

  display:inline;

  font-size: 1.2em;

  padding: 0;

  /*

  margin-left: 3.3em;

  * margin-left: 7em;

  */

}



.box label {

  display: inline;

  /* float: left;*/

  width: 50px;

  margin: 0;

  padding: 0;

  padding-left: 2px;

  * padding-left: 10px;

}



.box input.button {

  position: relative;

  background: white;

  border: 1px solid #3399cc;

  color: #3399cc;

  padding: 2.5px;

  margin: 7.5px 20px 0 0;

  font-size: 1em;

}



.box h3 { width: 85%; }





#buying h2, #contact h2, #featured h2 {

  text-indent: -9999px;

  background: transparent url(/public/images/buying.jpg) top left no-repeat;

  width: 284px;

  height: 66px;

  margin: 0;

  margin-left: -12px;

  padding: 0;

}

#register h2
{
	text-indent: -9999px;
	background: transparent url(/public/images/register.jpg) top left no-repeat;
	width: 284px;
	height: 66px;
	margin: 0;
	margin-left: -12px;
	padding: 0;
}



#contact h2 {

  background: transparent url(/public/images/contact.jpg) top left no-repeat;

}

#featured { text-align: center !important; float: left;  * margin-right: 10px; z-index: 100; }



#featured h2 {

  background: transparent url(/public/images/featured.jpg) top left no-repeat;

}



#featured div img {

  width: 220px !important;

  margin-left: 15px !important;

  padding: 5px;

  border: 1px solid silver;

}





.box {

  position: relative;

  width: 264px;

  margin-left: 15px;

  * margin-left: 10px;

  margin-bottom: 15px;

  padding: 0 10px;

}



.box .back {

  background: transparent url(/public/images/box_bg.jpg) top left repeat-y;

  width: 284px;

  height: auto;

  margin: 0 0 0 -10px;

  padding: 0;

}



.box .foot {

  background: transparent url(/public/images/box_bottom.jpg) top left no-repeat;

  height: 31px;

  width: 284px;

  margin-left: -10px; 

  margin-bottom: -10px;

  * margin-bottom: 0;

}



.box address {

  padding-top: 10px;

  font-size: 140%;

}



/* =Tables

----------------------------------------------------------*/

table {

  font-size: 1.6em;

  width: 95%;

  margin: 1em auto;

}



table p {

  font-size: 1em;

  margin-left: 0;

}



td {
 	border: 0px solid #ccc;
  padding: 0.33em 0.5em;

}



th {
	border: 1px solid #ccc;
	font-weight: bolder;
	padding: 1px;
	
}






/* =Admin

----------------------------------------------------------*/

.admin {

  background: #3e3e3e;

  border: 2px solid #666;

}



#admin {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 3em;

  * height: 4em;

  border-left: none;

  border-right: none;

  border-top: none;

  z-index: 50;

  font-size: 1em;

  padding-top: 1em;

}



.admin ul {

  margin: 0;

  padding: 0;

}



.admin li {

  float: left;

}



.admin a:link, .admin a:visited {

  padding: 1em;

  color: #ccc;

  text-decoration: none;

}



.admin a:hover {

  text-decoration: underline;

}



/* =Product Display

----------------------------------------------------------*/

div.product {

  margin-left: 5%;

  width: 90%;

  line-height: 1em;

  font-size: 1.5em;

  *font-size: 1em;

}



div.product h2 {

  margin-left: 0;

  display: block;

  font-size: 1.4em;

  *font-size: 1.8em;

}



div.product img {

  float: right;

  border: 1px solid silver;

  padding: 4px;

  margin-left: 1em;

  margin-right: -15px;

  width: 35%;

}



div.product ul {

  font-size: inherit;

  margin-left: 1em;

}



div.product li {

  font-size: inherit;

  margin: 0;

  padding: 0;

}



div.product li li {

  *font-size: 0.62em;

  line-height: 1.2em;  

}



div.product p {

  font-size: inherit;

  margin-left: 0;

}



div.product div {

  margin-left: 45%;

}



/* Testimonials */
.testimonial p { 
	color: #777;
	font-style: italic;
	font-family: Georgia, "Times New Roman", serif;
	text-align: left;
	line-height: 1.5em;
}

.testimonial cite {
	text-align: right;
	font-size: 1.25em;
	display: block;
	margin-bottom: 15px;
	margin-top: 7px;
}

.testimonial p:before{
	content: "\"";
}

.testimonial p:after {
	content: "\"";
}


.testimonial blockquote {
	border-bottom: 1px solid #ccc;
	margin: 0 15px 15px 15px;
}

.testimonial blockquote.last {
	border: 0;
}