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

   forms.css
   * Sets up some default styling for forms
   * Gives you classes to enhance your forms
   
   Usage:
   * For text fields, use class .title or .text
   * For inline forms, use .inline (even when using columns)
   
-------------------------------------------------------------- */

label       { font-weight: bold; }
fieldset    { padding:1.4em; margin: 0 0 1.5em 0; border: 1px solid #ccc; }
legend      { font-weight: bold; font-size:1.2em; }


/* Form fields
-------------------------------------------------------------- */

input[type=text], input[type=password],
input.text, input.title, 
textarea, select { 
  background-color:#fff; 
  border:1px solid #bbb; 
}
input[type=text]:focus, input[type=password]:focus, 
input.text:focus, input.title:focus, 
textarea:focus, select:focus { 
  border-color:#666; 
}

input[type=text], input[type=password],
input.text, input.title,
textarea, select {
  margin:0.5em 0;
}

input.text, 
input.title   { width: 300px; padding:5px; }
input.title   { font-size:1.5em; }
textarea      { width: 390px; height: 250px; padding:5px; }

input[type=checkbox], input[type=radio], 
input.checkbox, input.radio { 
  position:relative; top:.25em; 
}

form.inline { line-height:3; }
form.inline p { margin-bottom:0; }


/* Success, notice and error boxes
-------------------------------------------------------------- */

.error,
.notice, 
.success    { padding: .8em; margin-bottom: 1em; border: 2px solid #ddd; }

.error      { background: #FBE3E4; color: #8a1f11; border-color: #FBC2C4; }
.notice     { background: #FFF6BF; color: #514721; border-color: #FFD324; }
.success    { background: #E6EFC2; color: #264409; border-color: #C6D880; }
.error a    { color: #8a1f11; }
.notice a   { color: #514721; }
.success a  { color: #264409; }

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

   print.css
   * Gives you some sensible styles for printing pages.
   * See Readme file in this directory for further instructions.
      
   Some additions you'll want to make, customized to your markup:
   #header, #footer, #navigation { display:none; }
   
-------------------------------------------------------------- */

body {
  line-height: 1.5;
  color:#fff;
  background-color: #000;
  font-size: 10pt;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  background-image:url(../gfx/backg.png);
  background-repeat:repeat-x;
  background-position:top;
}


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

.container {
  background: none;
}

hr { 
  background:#ccc; 
  color:#ccc;
  width:100%;
  height:2px;
  margin:2em 0;
  padding:0;
  border:none;
}
hr.space {
  background: #fff;
  color: #fff;
}


/* Text
-------------------------------------------------------------- */

h1,h2,h3,h4,h5,h6 { font-family: "Helvetica Neue", Arial, "Lucida Grande", sans-serif; }
code { font:.9em "Courier New", Monaco, Courier, monospace; } 

img { float:left; margin:1.5em 1.5em 1.5em 0; }
a img { border:none; }
p img.top { margin-top: 0; }

blockquote {
  margin:1.5em;
  padding:1em;
  font-style:italic;
  font-size:.9em;
}

.small  { font-size: .9em; }
.large  { font-size: 1.1em; }
.quiet  { color: #999; }
.hide   { display:none; }


/* Links
-------------------------------------------------------------- */

a:link, a:visited {
  background: transparent;
  font-weight:700;
}

a:link:after, a:visited:after {
  
  font-size: 90%;
}

/* If you're having trouble printing relative links, uncomment and customize this:
   (note: This is valid CSS3, but it still won't go through the W3C CSS Validator) */

/* a[href^="/"]:after {
  content: " (http://www.yourdomain.com" attr(href) ") ";
} */

/* -------------------------------------------------------------- 
  
   reset.css
   * Resets default browser CSS.
   
-------------------------------------------------------------- */

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, code,
del, dfn, em, img, q, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
  margin: 0;
  padding: 0;
  border: 0;
  font-weight: inherit;
  font-style: inherit;
  font-size: 100%;
  vertical-align: baseline;
}

body { 
  line-height: 1.5; 
}

/* Tables still need 'cellspacing="0"' in the markup. */
table { border-collapse: separate; border-spacing: 0; }
caption, th, td { text-align: left; font-weight: normal; }
table, td, th { vertical-align: middle; }

/* Remove possible quote marks (") from <q>, <blockquote>. */
blockquote:before, blockquote:after, q:before, q:after { content: ""; }
blockquote, q { quotes: "" ""; }

/* Remove annoying border on linked images. */
a img { border: none; }

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

   typography.css
   * Sets up some sensible default typography.
   
-------------------------------------------------------------- */

/* Default font settings. 
   The font-size percentage is of 16px. (0.75 * 16px = 12px) */


/* Headings
-------------------------------------------------------------- */

h1,h2,h3,h4,h5,h6 { font-weight: normal; color: #111; }

h1 { font-size: 3em; line-height: 1; margin-bottom: 0.5em; }
h2 { font-size: 2em; margin-bottom: 0.75em; }
h3 { font-size: 1.5em; line-height: 1; margin-bottom: 1em; }
h4 { font-size: 1.2em; line-height: 1.25; margin-bottom: 1.25em; }
h5 { font-size: 1em; font-weight: bold; margin-bottom: 1.5em; }
h6 { font-size: 1em; font-weight: bold; }

h1 img, h2 img, h3 img, 
h4 img, h5 img, h6 img {
  margin: 0;
}


/* Text elements
-------------------------------------------------------------- */

p           { margin: 0 0 1.5em; }
p img.left  { float: left; margin: 1.5em 1.5em 1.5em 0; padding: 0; }
p img.right { float: right; margin: 1.5em 0 1.5em 1.5em; }

a:focus, 
a:hover     { color: #fff; text-decoration: underline;}
a           { color: #fff; text-decoration: none;}

blockquote  { margin: 1.5em; color: #666; font-style: italic; }
strong      { font-weight: bold; }
em,dfn      { font-style: italic; }
dfn         { font-weight: bold; }
sup, sub    { line-height: 0; }

abbr, 
acronym     { border-bottom: 1px dotted #666; }
address     { margin: 0 0 1.5em; font-style: italic; }
del         { color:#666; }

pre 				{ margin: 1.5em 0; white-space: pre; }
pre,code,tt { font: 1em 'andale mono', 'lucida console', monospace; line-height: 1.5; }


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

li ul, 
li ol       { margin:0 1.5em; }
ul, ol      { margin: 0 1.5em 1.5em 1.5em; }

ul          { list-style-type: disc; }
ol          { list-style-type: decimal; }

dl          { margin: 0 0 1.5em 0; }
dl dt       { font-weight: bold; }
dd          { margin-left: 1.5em;}


/* Tables
-------------------------------------------------------------- */

table       { margin-bottom: 1.4em; width:100%; }
th          { font-weight: bold; }
thead th 		{ background: #c3d9ff; }
th,td,caption { padding: 4px 10px 4px 5px; }
tr.even td  { background: #e5ecf9; }
tfoot       { font-style: italic; }
caption     { background: #eee; }


/* Misc classes
-------------------------------------------------------------- */

.small      { font-size: .8em; margin-bottom: 1.875em; line-height: 1.875em; }
.large      { font-size: 1.2em; line-height: 2.5em; margin-bottom: 1.25em; }
.hide       { display: none; }

.quiet      { color: #666; }
.loud       { color: #000; }
.highlight  { background:#ff0; }
.added      { background:#060; color: #fff; }
.removed    { background:#900; color: #fff; }

.first      { margin-left:0; padding-left:0; }
.last       { margin-right:0; padding-right:0; }
.top        { margin-top:0; padding-top:0; }
.bottom     { margin-bottom:0; padding-bottom:0; }

/* Layout styles
-------------------------------------------------------------- */

#mainContainer{width: 941px;margin: auto; }
#header{background-image:url(../gfx/headerBackg.gif);height: 114px; margin-top: 8px; padding-bottom: 7px; background-repeat:no-repeat;}
	#header ul{list-style:none; margin: 0px; padding: 0px; float: right; font-size: 80%; text-transform:uppercase; background-color:#333333; width: 650px;  
	margin-right: 16px; margin-top: 78px; background-image:url(../gfx/tabHead.gif); background-position:top right; background-repeat:repeat-x}
	#header li{float: left;width: 100px; border-right: 4px solid black; background-image:url(../gfx/tabHead.gif); background-position:top right; background-repeat:no-repeat; background-position:top left!important;}
		.item1{background-color: #a4218b;}
		.item2{background-color: #25aae1;}
		.item3{background-color: #13a89e;}
		.item4{background-color: #8cc63f;}
		.item5{background-color: #f7941e;}
			.active{ background-position:top left!important;}
		#header a{font-weight: normal; font-size: 90%; display: block; background-image:url(../gfx/tabHead.gif); background-image:url(../gfx/tabHead.gif); 
					background-position:top right; background-repeat:no-repeat; padding-left: 4px; padding-top: 6px;}
		#header a:hover{background-position:top left; text-decoration:none;}			
#splash{width: 908px; height: 208px; background-repeat:no-repeat; margin: auto; padding: 0px!important;}
	#splash h2{text-indent: -10000px;}
	#splash object{display: none;}
	.image1{background-image:url(../gfx/splash1.jpg);}
	.image2{background-image:url(../gfx/splash2.jpg);}
	.image3{background-image:url(../gfx/splash3.jpg);}
	.image4{background-image:url(../gfx/splash4.jpg);}
#col1{width: 453px; float: left; margin-left: 16px; font-size: 75%; margin-right: 2px;}
#col2a, #col2b{width: 453px; float: left;  font-size: 75%;}
#col1, #col2a, #col2b{background-image:url(../gfx/panelBackg.png); background-repeat:no-repeat; margin-top: 12px;}
	#col1 img, #col1 p, #col2a p, #col2b p, #col2a img, #col2b img{margin-left: 16px; margin-right: 16px;}
	#col1 img{margin-bottom: 20px;}
#footer{clear:both; color: #5e5e5e; font-size: 65%; text-align:center; background-image:url(../gfx/footerBackg.gif); height: 93px; padding-top: 10px; background-repeat:no-repeat; padding-top: 19px;}
	#footer a{color: #5e5e5e; font-weight: normal;}
	h1{background-image:url(../gfx/meesha-graphics-logo.png); background-repeat: no-repeat; height: 118px; width: 200px; text-indent: -10000px; float: left; margin-top: 10px; margin-left: 16px;}
	h3{color: white; padding-top: 10px; padding-left: 8px; padding-bottom: 0px; margin-bottom: 0px; height: 30px; background-repeat:no-repeat; background-position:center left; text-indent: -10000px; margin-left: 6px;}
		.welcome{background-image:url(../gfx/welcome-to-meesha-graphics.png);}
		.portfolio{background-image:url(../gfx/meesha-graphics-portfolio.png);}
	.viewMore{background-image:url(../gfx/viewMore.gif)!important; width: 71px; height: 15px; display: block; float: right; text-indent: -10000px; margin-right: 160px;}
	.ourWork{background-image:url(../gfx/our-work.gif)!important; width: 76px; color: #8cc63f; background-repeat:no-repeat; display: block;float: right; margin-right: 155px; text-indent: -10000px; margin-bottom: 12px;}
	.contact{background-image:url(../gfx/contact-meesha.png); width: 225px; height: 25px;}
	.subimage{margin-bottom: 12px;}
	.phone{background-image:url(../gfx/phone-number.gif); text-indent: -10000px; display: block; float: right; width: 184px; height: 26px; background-repeat:no-repeat; margin-right: 10px; margin-top: 4px; margin-bottom: 4px;}
	.mail{background-image:url(../gfx/send-us-a-mail.gif); background-repeat:no-repeat; display: block; float: right; width: 139px; height: 15px; text-indent: -100000px; margin-top: 4px; margin-bottom: 4px;}
	.info{ display: block; float: right; width: 187px; margin-top: 3px; margin-bottom: 3px;}

/* about page */
#col1_1{width: 597px; float: left; font-size: 75%; margin-top: 12px; margin-left: 16px; background-image:url(../gfx/panelBackg_wide.png); background-repeat:no-repeat; margin-right: 2px;}
	#col1_1 h3{margin-left: 6px;}
	#col1_1 p{margin-left: 16px; margin-right: 16px;}
#col2_1{width: 309px; float: left; font-size: 75%; background-image:url(../gfx/panelBackg_wide.png); background-repeat:no-repeat; margin-top: 12px;}
	.aboutImage{float: right; margin-left: 16px; margin-right: 16px;}
	.contactPanel{background-image:url(../gfx/carousel_small.gif); background-position:bottom right; background-repeat:no-repeat; height: 150px;}
	.contactPanel span{float: left; margin-left: 12px; padding-left: 4px;}
	.aboutHeader{background-image:url(../gfx/about-meesha-graphics.png);}

/* services page */
	.servicesHeader{background-image:url(../gfx/services-header.png);}

/* portfolio page */
	.portfolioHeader{background-image:url(../gfx/portfolio-heder.png);}
	.portfolioSection ul{list-style: none; margin-bottom: 30px; display: table;}
		.portfolioSection li{width: 85px; height: 120px; float: left; margin-right: 8px; margin-bottom: 8px;}

/* contact section */
.contactHeader{background-image:url(../gfx/contactHeder.png);}
.contactImage{margin: 12px; margin-top: 0px; margin-bottom: 22px;}
.fr{float: right;}
.contactLinks a, .contactLinks a:hover, .mapLink, .mapLink:hover{font-weight: normal!important; color: #f7941e!important;}
#sotester{position: relative; top: -31px;}