/* CSS Document */

/*********** reset browser defaults ****************/
a, abbr, acronym, address, applet, article, aside, audio,
b, blockquote, big, body,
center, canvas, caption, cite, code, command,
datalist, dd, del, details, dfn, dl, div, dt, 
em, embed,
fieldset, figcaption, figure, font, footer, form, 
h1, h2, h3, h4, h5, h6, header, hgroup, html, hr,
i, iframe, img, ins,
kbd, 
keygen,
label, legend, li, 
meter,
nav,
object, ol, output,
p, pre, progress,
q, 
s, samp, section, small, span, source, strike, strong, sub, sup,
table, tbody, tfoot, thead, th, tr, tdvideo, tt,
u, ul, 
var { margin: 0px; padding: 0px; border: none; outline: 0; vertical-align: top; }

h1, h2, h3, h4, h5, h6 { font-size: 100%;}

table { border-collapse: collapse;}

/********* HTML5 - Getting the new html5 tags to behave *************/

article, aside, audio, canvas, command, datalist, details, embed, figcaption, figure, footer, header, hgroup, keygen, meter, nav, output, progress, section, source, video { display: block; }
mark, rp, rt, ruby, summary, time { display: inline }

/******************************** MAIN SITE SECTION **************************/

/***** GLOBAL CLASSES ****************/ 
  .note, .sm { font-size: .8em; }
  
  /*** error box for contact form ****/
  .box { height: 25px; padding-top: 5px; background: url(../images/box.png) top center no-repeat; }
  
  .left { text-align: left; }
  .right { text-align: right; }
  .center { text-align: center; margin: auto; }
  
  .red, .error { color: #ff0000; }
  .green, .ok { color: #009900; }
  .white { color: #ffffff; }
  .orange { color: #ff6600; }
  
  .btn { color: #fff; background: url(../images/save.gif); padding-bottom: 3px;}
  .btn:hover { color: #ccc;}

hr { border: none; border-bottom: 1px solid #cccccc; width: 90%; text-align: center; margin: 10px auto; }


/*********************** TYPOGRAPHY - base font family, sizes ***************************/

html { font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif; }

html { font-size: 100%;}
body { font-size: .8em; line-height: 1.5em; }


/************* template specific styles, colors and/or layout are in theme.css *****************************/
h1, h2, h3, h4, h5, h6 { padding: 10px 5px 10px 0px; margin-top: 2px; }

h1 {
	font-size: 1.4em;
	padding: 10px 10px 10px 0;
}
h2 { font-size: 1.3em; padding-left: 0px; }
h3 { font-size: 1.2em; }
h4 {}

ul {
	list-style-type: none;
	list-style-position: inside;
	font-size: 1em;
	line-height: 1.1em;
	padding: 3px;
}
  ul li { list-style-image: url(../images/arrow-image.gif); }
  ul li li { list-style-image: none; }
  
ol { 
	list-style-position: inside;
	font-size: 1em;
	line-height: 1.1em;
	padding: 3px;
	}
	
dl, dt, dd { padding: 4px;}
  dt { font-weight: bold;}

li, dl, dt, dd { margin: 3px;}

  ul li ul li { margin-left: 10px;}

ul.sitemap { padding: 10px 15px; }
  ul.sitemap ul li { text-indent: 10px;}
ul.sitemap, ul.sitemap ul { text-align: left; list-style: none; }
  ul.sitemap li, ul.sitemap li a, ul.sitemap ul li, ul.sitemap ul li a { margin: 5px 0;}

p { padding: 8px 0; }

  pre { padding: 12px; font: .9em Tahoma, Verdana, Arial, Helvetica, sans-serif; font-weight: bold; color: #f7f7f7; display: inline-block; width: 600px; border: 1px solid #ccc; text-align: center; margin: 10px auto 5px auto; }

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

/******* END TYPOGRAPHY *************/

/************* Define MAIN WIDTH for full page elements IN PIXELS for main page
Adjust to percentages for Mobile and handheld implementation **********************/

#container_wrapper, #container, .page_wrapper, #cartbar, #header, #header #logo, #header #logoedit, #marquee_wrapper, #marquee, .mainnav, #navedit, #flashcontent, #container.home #masthead, #container.home #mastheadedit, #subcontainer, #content.widecol, #contentedit.widecol, #footer, #footeredit { /* width: 1050px; */ }

.quick-access, subnav .navbar { /* width: 1000px; */ }

/************* MAIN WIDTH for partial page elements IN PIXELS ******************/
#cart, #cartedit, #media, #mediaedit, .videos { /* width: 500px; */ }

/************* END MAIN WIDTH elements  for mobile *******************************/


/***************** Containers and sections ***************/

/* wrappers */
body {
	text-align: center;
	margin: 0px auto;	
	background: #333 url(../images/bgimages/bkgd-charcoal.jpg) top left repeat;
	overflow-y: scroll;
}

#container_wrapper { 
  float: none;
  width: 1050px; 
  text-align: center; 
  margin: 20px auto 0 auto;
  position: relative;
}
#container {
	float: left;
	width: 1050px;
	text-align: center;
	margin: 0 auto;
	border: 1px solid #999;
	position: relative;
    -moz-box-shadow: 0px 12px 9px rgba(0,0,0,.2);
    -webkit-box-shadow: 0px 12px 9px rgba(0,0,0,.2);
    box-shadow: 0px 12px 9px rgba(0,0,0,.2);
}

.page_wrapper {
  width: 1050px; 
  text-align: center;
  margin: auto;
}

/************ CART SECTION ****************/

/******* top nav section cart, social media ****************/
#cartbar { float: left; width: 1050px; background: #333; }

#cart_wrapper { 
  float: left;
  width: 50%; 
  text-align: center; 
  margin: 5px auto; 
  background: #333;
  color: #bbb;
  font-size: .85em;
  }

#cart, #cartedit  {
  width: 500px; 
  text-align: right;
  margin: 0;
  z-index: 35;
  position: relative;
}
  #cartedit { display: none; height: 40px; }
  
#cart ul, #cart li { margin: 0; padding: 0;}
#cart li { list-style: none; display: inline; padding: 0px 4px 2px 0px;}
#cart li a { color: #ccc; }
#cart li a:hover { color: #fff; text-decoration: none;}
  #cart #viewCart { margin: 0; padding: 0; display: inline;}
    #cart li.email {  }
    #cart li.shipping {  }
	  #cart li.social img { float: right; width: 20px; height: 24px; margin: 0; padding: 0; margin-top: -5px; display: inline; } 
  #cart #viewCart input { text-align: left; background: none; border: none; color: #fff; margin: 0 0 2px 0; padding: 0; }
  #cart .floatleft, #cart .floatleft img { margin-top: -3px; padding: 0; }

#cart li a { padding: 0 14px 0 6px; background: url(../images/bkg_pipe1.gif) center right no-repeat; }
#cart li.last a { padding:0; background:none; }

#cart form.buyNow input.text { width: 30px;}

#cart input.submit {
  color: #fff; 
  font-size: .9em; 
  font-weight: bold; 
  padding: 3px 5px; 
  background: #2b4058 url(/images/buyNow.gif) repeat-x; 
  border: 1px solid #ccc;
}

#cart p, #cart ul { padding: 5px 10px 5px 0px; }

  section.cart ul li, section.cart p, section.cart h1, section.cart h2, section.cart h3, section.cart h4, section.cart h5, section.cart h6, section.cart form { display: inline; }
  section.cart ul { display: inline-block; }
  section.cart ul li img { }

/***** END CART SECTION *******/

/*************** MEDIA SECTION - newsletter, search, rss ******************/
#media_wrapper { 
  float: left;
  width: 50%; 
  text-align: center; 
  margin: auto; 
  background: #333;
  color: #bbb;
  font-size: .85em;
}
  
#media, #mediaedit { 
  width: 500px; 
  text-align: left;
  z-index: 35;
  position: relative;
}
  #mediaedit { display: none; height: 40px; }
	  
#media p, #media ul { padding: 5px 5px 5px 5px; }

/********************** END MEDIA SECTION *********************/

/********** STORE ACCESS - for site with Magento cart *********/

.quick-access { float: left; width: 1000px; height: 20px; background:#444; color:#fff; text-align:right; padding-top: 10px; }
/* .quick-access .welcome-msg { display:inline; margin:0; color:#fff; }
.quick-access .form-language { float:left; }
.quick-access .form-language label { font-weight:bold; padding-right:5px; color:#fff; vertical-align:middle; }
.quick-access .form-language select { padding:0; }
.quick-access .form-language select.flags option { background-position:4px 50%; background-repeat:no-repeat; padding-left:25px; } */
.quick-access .links { padding-left: 8px; }
.quick-access .links,
.quick-access .links li { display:inline; }
.quick-access .links li { padding:0 4px 0 1px; }
.quick-access .links a { color:#ddd; }
.quick-access .links a { padding:0 7px 0 0; background:url(../images/bkg_pipe1.gif) no-repeat 100% 50%; }
.quick-access .links li.last a { padding:0; background:none; }

/************** end Magento cart quick access section **********************/


/*********** ADDRESS SECTION **********/
	
#address, #addressedit {
  width: 220px;
  text-align: left;
  min-height: 20px;
  margin: 5px 5px 0 0; 
  padding: 2px 0px 0px 5px;
  position: absolute;
  top: 5px; 
  left: 6px;
  background: #d2d2d2 url(../images/bg_address.gif) top left repeat-x;
  border: 2px solid #f7f7f7;
  font-size: .9em;
  z-index: 5;
  
}
  #address { 
    -moz-box-shadow: 0px 5px 9px rgba(0,0,0,.4);
    -webkit-box-shadow: 0px 5px 9px rgba(0,0,0,.4);
    box-shadow: 0px 5px 9px rgba(0,0,0,.4);
  }
	/*** rounded corners for tabs ***/
  	#address, #addressedit { 
		border-radius: 5px;
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
	}

#addressedit { border: none; display: none; z-index: 25; background: none; }

#address h1 { }
#address h1, #address h2, #address h3 { padding: 0px 3px 5px 18px; margin-top: 5px; }
#address p { padding: 5px 3px 5px 8px; margin-top: 0px; }

#address a:hover { color: #4197e8; text-decoration: none; }

/******** END ADDRESS SECTION ******************/

/****************** HEADER SECTION *********************/
#header_wrapper { float: left; width: 100%; min-height: 150px; text-align: center; margin: auto; background: #ffffff; }
#header_wrapper .page_wrapper { }

#header {
	float: left;
	position: relative;
	width: 1050px;
}
  #header #logo, #header #logoedit { float: left; width: 1050px; min-height: 130px; text-align: right; }
  
    #header #logoedit{ z-index: 45; display:none; position: relative; height: 150px; }
	
	#header #logo img { padding: 5px 10px; }
	
/************ END HEADER SECTION *****************************************/

/*************************** NAV SECTION *******************************/
/* CSS Document */

/* nav_holder */
.mainnav, #navedit {
	float: left;
	text-align: left;
	margin-right: 1px;
	width: 1050px;
	height: 33px;
	position: relative;
	z-index: 15;
}

/***** rounded corners for tabs *****/
.mainnav li a, #navedit li a {
	border-top-left-radius: 3px;
	border-top-right-radius: 3px;
	-moz-border-radius-topleft: 3px;
	-moz-border-radius-topright: 3px;
	-webkit-border-radius-topleft: 3px;
	-webkit-border-radius-topright: 3px;
}

/*************** nav edit section *******************/

  #navedit { display: none; z-index: 50; }

/************* end nav edit section ****************/

.mainnav ul { margin: 0;}
.mainnav ul li {
  	display: inline-block; /* so links don't carry on two lines */
	margin: 0;
	padding: 0;
	font-size: .8em;
	position: relative;
}
  
  
.mainnav ul li a {
	line-height: 26px;
	padding: 9px 18px 10px 18px;
	font-weight: bold;
	text-decoration: none; 
	border: 1px solid #eee;
	background: #fff;
}
/************ tabs **********************/
.mainnav ul li a:hover, .mainnav ul li a.selected, .mainnav ul li a.active { border-bottom: 3px solid #fff;  }
  .mainnav ul li ul li a, .mainnav ul li ul li a:hover, .mainnav ul li ul li a.selected { border: none; }

/************ Drop Down Menu ***********/
.mainnav ul li ul {
  display: none;
  border: 1px solid #666;
  border-top: none;
  background: #fff;
  position: absolute;
  top: 30px;
  left: -1px;
  padding: 2px 0px;
  width: 200px;
  z-index: 55;
  -moz-border-radius-bottomright: 8px;
  -webkit-border-bottom-right-radius: 8px;
  border-bottom-right-radius: 8px;
  -moz-border-radius-bottomleft: 8px;
  -webkit-border-bottom-left-radius: 8px;
  border-bottom-left-radius: 8px;
}
  .mainnav ul li ul li { display: block; text-align: left; margin: 0; font-size: 1em; background: none; }
  .mainnav ul li ul li a { display: block; line-height: 12px; background: none; width: 80%; padding: 10px 5px 10px 17px; }
  
  .mainnav ul li:hover ul, .mainnav ul li.over ul { display: block;}
  
.mainnav ul li a { color: #333; }
  .mainnav ul li li a { color: #729cd8; }
  .mainnav ul li li a:hover { color: #777;} 
  .mainnav ul li li a.selected { color: #729cd8;}
  
.mainnav ul li a:hover, .mainnav ul li a.selected { color: #729cd8; }


/*********** sub nav area ****************/

.subnav { float: left; width: 100%; text-align: center; margin: 0 auto 5px auto; padding-bottom: 5px;  }

.subnav .navbar {
	float: none;
	width: 1000px;
	height: 25px;
	border-top: 1px solid #ccc;
	font-size: .85em;
	text-align: center;
	margin: auto;
}
  .subnav .navbar ul {
	text-align: center;
	padding: 3px 0 5px 0;
}
  .subnav .navbar ul li {
	display: inline-block;
	padding: 0 5px;
	line-height: 1.7em; 
}

  .subnav .navbar ul li a { padding: 3px; color: #333; } 
  .subnav .navbar ul li a:hover { color: #aaa; }
  .subnav .navbar ul li a.selected { color: #1c3d6c;}
  
  .subnav .navbar ul li ul { display: none; }
  
  .subnav .navbar ul li a:hover { text-decoration: none;}
  
/****************************** END NAV SECTION ******************************/
	
/**************** MASTHEAD SECTION - image/slideshow/masthead info ***********************/

#masthead_wrapper { float: left; width: 100%; text-align: center; margin: auto; background: #ffffff; clear: both; position: relative; z-index: 1; }

#masthead_wrapper .page_wrapper { padding:0; }

/**** images/slideshows for the masthead area ****/

#container.home #masthead, #container.home #mastheadedit { 
  float: left; 
  width: 1050px; 
  background: transparent;
  font-size: .9em;
  line-height: 1.2em; 
  position: relative;
  color: #fff;
}

#container.home #mastheadedit { display: none; z-index: 40; }

#masthead img { display: none;}

#container.home #masthead img, #container.home #mastheadedit img { display: block;}
  #container.home #masthead p { padding: 0; margin: 0;}

#masthead { text-align: left; }
#masthead img { }
  #masthead h1, #masthead h2, #masthead h3 { padding-left: 10px; color: #222; }
  
    /********* products embedded in the masthead **************/
.products { float: left; width: 200px; height: 245px; padding: 3px 3px 5px 7px; text-align: center; margin: auto; }
  .products, .products p, .products a { color: #222; }
    .products a:hover { color: #900; } 
  .products img { width: 195px; height: 170px; }
  
#flashcontent { 
  float: left;
  width: 1050px;
  height: 300px;
  text-align: center;
  position: relative;
  z-index: 40;
}
  
/*************** END MASTHEAD SECTION *****************************************/


/***************** MAIN CONTENT AREA  *******************/

#subcontainer_wrapper { float:left; width: 100%; text-align: center; margin: auto; } 
  #subcontainer_wrapper .page_wrapper { }

#container.home #subcontainer { 
  /* insert special bg image if necessary for 3 column homepage */
}
#subcontainer {
	width: 1050px;
	background: #fff;
	min-height: 350px;
	
	/* insert separate bg image if necessary for 1 or 2 column content/inside page(s) */
}

/************ LEFT *************/
#left_col, #left_coledit { 
	float: left;
	width: 240px;
	text-align: left;
}
  #left_coledit { display: none; z-index: 25; position: relative;}

  .heading img, .heading2 img { float: left; vertical-align: top; }

/************** RIGHT ************/
#right_col, #right_coledit {
	float: left;
	width: 240px;
	text-align: left;
}
  #right_coledit { display: none;}
  
  #right_col ul { padding-left: 1px;}
  #right_col ul li { margin-left: 1px;}
  
/* details and pricing for sites */
#details, .details { border: 1px solid #ccc; -moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px; padding: 5px 10px 5px 14px; font-size: .9em; }

/**************** MIDDLE *******************/  
#container.home #content, #container.home #contentedit {
	float: left;
	width: 548px;
	text-align: left;
}
/* for Videos page */
#content.widecol, #contentedit.widecol {
	float: left;
	width: 1050px;
	text-align: left;
	min-height: 200px;
 }
#content, #contentedit {
	float: left;
	width: 798px;
	text-align: left;
	min-height: 200px;
}
  #contentedit { display: none; }

#content img, #left_col img, #right_col img { margin: 3px; }

.inside { padding: 10px 14px 5px 18px; margin: 5px; }
#container.home .inside { padding: 10px 10px; }

#websites { float: right; width: 225px; text-align: center; margin: auto; }

div.services p { float: left; width: 375px; text-align: center; font-weight: bold;}
div.services img { width: 350px; height: 364px;} 

/* youTube Videos */
.videos, .videos-sm { float: left; width: 500px; margin: 10px 0px 20px 0px; }
.videos-sm { width: 365px; }
  
/************** FORMS - form layout section *****************************/

#contactusbox { padding-left: 0px; }

  #contactusbox label#ruhuman, #contactusbox label#ruhman input { display:none; }

  #error, #thankyou { }
  #errordiv, #thankyoudiv { margin-bottom: 25px; }

#contactusbox label { display: block; }

#contactusbox input[type=text], #contactusbox input[type=email] { border: none; width: 270px; height: 33px; background: url(../images/input-bkgd.png) -2px -2px no-repeat; padding-left: 10px; }
#contactusbox input[type=text]:hover, #contactusbox input[type=email]:hover { background: url(../images/input-bkgd.png) -2px -39px no-repeat; }

div.selectbox { position: relative; } /* so I can style the select box */
div.selectbox select { border: none; width: 298px; height: 33px; background: transparent; padding: 10px 0px 0px 10px; }
  #contactusbox option { border: none; padding: 0px 8px; background: #ccc; }
div.selectbox { border: none; width: 280px; height: 33px; overflow: hidden; background: url(../images/input-bkgd.png) -2px -75px no-repeat; }

#contactusbox textarea { border: none; width: 445px; height: 270px; resize: none; overflow: hidden; background: url(../images/input-bkgd.png) -2px -150px no-repeat; padding: 10px 0 0 10px; }

#contactusbox input[type=submit] { border: none; width: 98px; height: 36px; background: url(../images/input-bkgd.png) -2px -429px no-repeat; padding-top: 0px; }
#contactusbox input[type=submit]:hover { background: url(../images/input-bkgd.png) -103px -429px no-repeat; color: #444; }

  label#ruhuman, label#ruhman input { display:none; }


/******************** END FORMS - end form layout section ******************/


/********** FOOTER SECTION ***************/

#footer_wrapper { 
	float: left;  
	width: 100%;
	min-width: 1052px;
	text-align: center;
	margin: 0 auto;
	font-size: .85em;
	background: #333;
	margin-top: 25px;
	border-top: 2px solid #bbb;
}

#footer, #footeredit {
	width: 1050px;
	text-align: center;
	margin: auto;
	padding: 25px 0;
	position: relative;
}
  
#footeredit { display: none; }
  
  footer a:hover { text-decoration: none; }
  footer p { padding: 4px; }
/************ END FOOTER SECTION ***************************/
  

/************************ COLORS SECTION ***************************/
/* CSS Document */

body { color: #333; }

h1,h2, h3, h4, h5 { color: #333; }
h2, h2 a, h3, h3 a, h4 { color: #1c3d6c; }
h2 a:visited, h3 a:visited { color: #999; }

a { color: #1c3d6c; }
a:hover, h2 a:hover, h3 a:hover { color: #aaa; }

section.cart a, section.media a { color: #ccc; }
section.cart a:hover, section.media a:hover { color: #fff; text-decoration: none; }

#subcontainer { }

#footer, #footer a { color: #ccc;}
#footer a:hover { color: #fff;}

/************************ END COLORS SECTION ***************************/


/*************** clear, floats and fixes *************************/

.clear {
	clear:both;
	height:0px;
	line-height:1px;
	font-size:1px; 
}

.floatleft {
	float:left;
	vertical-align:top;
	padding: 3px;
}

.floatleft img {
	margin: 2px;
}

.floatright {
	float:right;
	vertical-align:top;
	padding: 3px;
}

.floatright img {
	margin: 2px;
}


/* clearfix */
.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}

.clearfix {display: block;}
/* End hide from IE-mac */