@charset "utf-8";

/* CSS Document */



/*HTML Reset*/

html, body, div, span, applet, object, iframe,

h1, h2, h3, h4, h5, h6, p, blockquote, pre,

a, abbr, acronym, address, big, cite, code,

del, dfn, em, img, ins, kbd, q, s, samp,

small, strike, sub, sup, tt, var,

b, u, i, center,

dl, dt, dd, ol, ul, li,

fieldset, form, label, legend,

table, caption, tbody, tfoot, thead, tr, th, td,

article, aside, canvas, details, embed, 

figure, figcaption, footer, header, hgroup, 

menu, nav, output, ruby, section, summary,

time, mark, audio, video {

	margin: 0;

	padding: 0;

	border: 0;

	font-size: 100%;

	font: inherit;

	vertical-align: baseline;

}

html, body {height: 100%;

}



/* HTML5 display-role reset for older browsers */

article, aside, details, figcaption, figure, 

footer, header, hgroup, menu, nav, section {

	display: block;

}

body {

	line-height: 1;

	font: 62.5% Arial, Helvetica, sans-serif;

	background-image:url(../images/body-bg.jpg);

	background-repeat:repeat-x;

	text-align:center;

}

ol, ul {

	list-style: none;

}

blockquote, q {

	quotes: none;

}

blockquote:before, blockquote:after,

q:before, q:after {

	content: '';

	content: none;

}

table {

	border-collapse: collapse;

	border-spacing: 0;

}



h1 { font:3em Arial, Helvetica, sans-serif;

	color:#0078c1;

	}

h2 { font:2.7em Arial, Helvetica, sans-serif;

	color:#000;

	padding:8px 0

	}

h3 {font:1.8em Arial, Helvetica, sans-serif;

	color:#000;

	margin:10px 0;}

h4 {font:1.2em Arial, Helvetica, sans-serif;

	color:#666;

	padding:5px 0;}

p {font: 1.5em Arial, Helvetica, sans-serif;

}

.blue { color:#0079c2;}

.clear { clear:both;}

.btn-myhsa {
  -webkit-border-radius: 8;
  -moz-border-radius: 8;
  border-radius: 8px;
  font-family: Arial;
  color: #ffffff;
  font-size: 12px;
  background: #0079c2;
  padding: 7px 16px 7px 16px;
  text-decoration: none;
  float:left; 
  margin-bottom:10px;
}

.btn-myhsa:hover {
  background: #666;
  text-decoration: none;
}
.btn-float {
	float: right;
	margin-right:11%;
}

.main-content ul {  list-style:disc outside none;

	margin-left:40px; 

   font-size:1.2em;

   }

.main-content ul li {padding:.2em 0;} 

/*Webpage Start*/

	.main-content ul li ul {  list-style:disc outside none;

	margin-left:40px; 

   font-size:1em;

   }

  .main-content ul li ul li {padding:.2em 0;

  font:1em arial;}  



#wrap {min-height: 100%;

	margin:0 auto;

	width:100%;

	font-size:1em;

	}

.header { max-width:1195px;

	margin:0 auto;

	height:30px;

}

/**********Navigation*****See Menu.css********/

#nav { max-width:1195px;

	margin:0 auto;

}

#banner { margin:0 auto;

	position:relative;

	max-width:1195px;

	max-height:425px;

	margin-top:-25px;

}

.greyline { 

	height:1px;

	background-color:#eaeaea;

	margin:10px 0;

	clear:both;

	width:100%;

}

.welcome { 

	position:relative;

	margin:0 auto;

	background-color:#eef2f5;

	padding:10px 0;

	text-align:left;

	min-height:200px;

}

.welcome-content { max-width:1195px;

	margin:0 auto;

}

.welcome-content p { padding:10px 0;

}

.welcome-content img {

	float:left;

	margin:10px 15px 15px 0;

}

.lowercontent { max-width:1195px;

	margin:0 auto;

	padding:10px 0 45px 0;

	margin-bottom:45px;

	position:relative;

	overflow:hidden;

}

.circles {  width:175px;

	padding:10px 5px;

	display:inline-block;

	margin:10px 14px;

	text-align:center;

	float:left;

	font-size:1.3em;

	height:250px;



}

.circles img { width:175px;

	padding:0 0 15px 0;

	border:none;

}

.circles a { text-decoration:none;

	color:#000;

}

.circles a:hover { text-decoration:none;

	color:#0079c2;

}

#footer { width:100%;

	margin:0 auto;

	display:block;

	padding:15px 0 0 0;

	text-align: center;

	color:#f0f0f0;

	background:#241e20;

	border-top:3px solid #0079c2;

	bottom:5px;

	position:relative;

	font-size:1em;

}



/* products page content*/

#box-container {

    text-align: justify;

    -ms-text-justify: distribute-all-lines;

    text-justify: distribute-all-lines;

    min-width:1195px;

	font:1em Arial, Helvetica, sans-serif;

	padding-top:15px;

}

.stretch {

    width: 100%;

    display: inline-block;

    font-size: 0;

    line-height: 0

}

.boxes {	

 	width: 210px;

    vertical-align: top;

    display: inline-block;

    *display: inline;

    zoom: 1;

	padding:5px 8px 10px 8px;

	text-align:left;

	border:1px solid #0079c2;

	-webkit-border-radius: 10px;

	-moz-border-radius: 10px;

	border-radius: 10px;

}

.boxes ul {list-style:disc outside none;

	margin-left:15px; 

   font-size:1.1em;

}

.boxes ul li { padding:.2em 0;

}

.largebox { float:left; margin-top:15px; width:1100px;}













/* STICKY FOOTER */

* {margin:0;padding:0;} 



/* must declare 0 margins on everything, also for main layout components use padding, not 

vertical margins (top and bottom) to add spacing, else those margins get added to total height 

and your footer gets pushed down a bit more, creating vertical scroll bars in the browser */



#main { overflow:auto;

	padding-bottom: 45px;

	}  /* must be same height as the footer */

#footer { position: relative;

	margin-top: -45px; /* negative value of footer height - same for all 3 instances */

	height: 45px;

	clear:both;

	font-size:1.2em;} 



/*Opera Fix*/

body:before { content:"";

height:100%;

float:left;

width:0;

margin-top:-32767px;

}

#main-wrapper {

	position:relative;

	margin:0 auto;

	background-color:#eef2f5;

	padding:10px 0;

	text-align:left;

	min-height:200px;

}

.main-content { max-width:1195px;

	margin:0 auto;

	text-align:left;

	font-size:1.2em;

}

.main-content p { padding:10px 0;

	font-size:1.2em;

}

.main-content a { color:#0079c2;

	text-decoration:none;

}

.main-content a:hover { color:#000;

	text-decoration:underline;

}



/* button */

.button {

	-moz-box-shadow:inset 0px 1px 0px 0px #ffffff;

	-webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;

	box-shadow:inset 0px 1px 0px 0px #ffffff;

	background-color:#d6deee;

	-webkit-border-top-left-radius:6px;

	-moz-border-radius-topleft:6px;

	border-top-left-radius:6px;

	-webkit-border-top-right-radius:6px;

	-moz-border-radius-topright:6px;

	border-top-right-radius:6px;

	-webkit-border-bottom-right-radius:6px;

	-moz-border-radius-bottomright:6px;

	border-bottom-right-radius:6px;

	-webkit-border-bottom-left-radius:6px;

	-moz-border-radius-bottomleft:6px;

	border-bottom-left-radius:6px;

	text-indent:0;

	border:1px solid #008cd8;

	display:inline-block;

	color:#0077c1;

	font-family:arial;

	font-size:15px;

	font-weight:bold;

	font-style:normal;

	height:38px;

	line-height:38px;

	width:250px;

	text-decoration:none;

	text-align:center;

	text-shadow:1px 1px 0px #ffffff;

}.button:hover {

	background-color:#ededed;

	text-decoration:none;

	color:#000;

}.button:active {

	position:relative;

	top:1px;

	text-decoration:none;

}



.linkbox { display:inline-block;

	width:30%;

	float:left;

	margin:10px 10px 0 0;

	padding:8px;

}

.contactbox { display:inline-block;

	float:left;

	padding:10px 15px;

}

.contactbox:first-of-type { 

	width:380px;

}

.contactbox:last-of-type { 

	width:250px;

	float:right;

}
.img-right {float:right;
	clear:both}
.left {float:left;}



/* #Media Queries

================================================== 

 ipad portrait */

@media only screen and ( min-width: 768px) and ( max-width: 980px ) {



.welcome-content { padding:0 15px;}

.circles { margin:5px;}

.main-content { padding:0 15px; }

.largebox { width:740px;}

.boxes {margin:5px; display:block; width:500px; float:left;}

.stretch { width:500px;}

#cssmenu > ul li a {

  display: block;

  padding: 12px 8px 11px 8px;

  text-decoration: none;

  color: white;

}

.linkbox { display:inline-block;

	width:100%;

	float:left;

	margin:10px 3px 0 0;

	padding:8px;

}

.contactbox { display:block;

	float:left;

	padding:10px;

	width:100%;

}

.contactbox:first-of-type { 

	width:100%;

}

.contactbox:last-of-type { 

	float:left;

	padding:10px;

	width:100%;

}

.circles { width:22%;}



}





@media only screen and ( max-width: 767px) { 



#wrap {min-height: 100%;

	margin:0 auto;

	width:100%;

	font-size:1em;

	}

.header { max-width:767px;

	margin:0 auto;

	height:30px;

}

#nav { max-width:750px;

	margin:0 auto;

}

#banner { margin:0 auto;

	position:relative;

	max-width:767px;

	margin-top:-45px;

}

#banner img { width:100%; height:auto;}

.welcome-content { padding:0 15px;}

.circles { display:block; width:175px; margin:0 0 5px 0; padding:0 50px;}

.circles img { margin:0;padding:0;}

.main-content { padding:0 15px; width:auto; }

.largebox { width:740px;}

.boxes {display:block; width: 400px;margin:5px 0;}

.stretch { width:auto;}

.linkbox { display:block;

	width:100%;

	float:left;

	margin:10px 3px 0 0;

	padding:8px;

}

.contactbox { display:block;

	float:left;

	padding:10px;

	width:100%;

}

.contactbox:first-of-type { 

	width:100%;

}

.contactbox:last-of-type { 

	float:left;

	padding:10px;

	width:100%;

}

}

/* iPads (portrait and landscape) ----------- */

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {



.welcome-content { padding:0 15px;}

.circles { margin:5px;}

.main-wrapper { margin:15px;}

.main-content { padding:0 35px; }

.largebox { width:740px;}

.boxes {margin:5px; display:block; width:500px; float:left;}

.stretch { width:500px;}

#cssmenu > ul li a {

  display: block;

  padding: 12px 8px;

  text-decoration: none;

  color: white;

  font-size:.9em;

}

.linkbox { display:inline-block;

	width:100%;

	float:left;

	margin:10px 3px 0 0;

	padding:8px;

}

.contactbox { display:block;

	float:left;

	padding:10px;

	width:100%;

}

.contactbox:first-of-type { 

	width:100%;

}

.contactbox:last-of-type { 

	float:left;

	padding:10px;

	width:100%;

}

.circles { width:22%;}

}



@media only screen and ( max-width: 767px) and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-resolution: 240dpi)  { 



.lowercontent { width:auto;}

.circles { display:block; width:175px; margin:0 0 5px 0; padding:0 50px;}

.circles img { margin:0;padding:0;}

.linkbox { display:-block;

	width:100%;

	float:left;

	padding:8px;

}

.contactbox { display:block;

	float:left;

	padding:10px;

	width:100%;

}

.contactbox:first-of-type { 

	width:100%;

}

.contactbox:last-of-type { 

	float:left;

	padding:10px;

	width:100%;

}

}