﻿/*-------------------------------------------

              Title :  eCardio
              Usage :  Global Layout
              Author:  Ian Yang (www.xbitech.com)
              Edited:  2009-03-10

---------------------------------------------*/


/*====================TOC====================

                1. Reset
                2. Containers
                3. Skip Links
                4. Branding
                5. Client Login
                6. Site Navigation
                7. Content
                8. Sub Navigation
                9. Text
               10. Information
               11. Video
               12. Corporat Office
               13. Site Map
               14. Contact Us
               15. Company Info

=============================================*/



/* 1. Reset
---------------------------------------------*/
* {
	margin: 0;
	padding: 0;
	}

body {
	line-height: 1;
	}

ol, ul {
	list-style: none;
	}

a {
	text-decoration: none;
	}

a:hover {
	text-decoration: underline;
	}

img, abbr, fieldset {
	border: none;
	}

img {
	vertical-align: top;
	}

strong, em {
	font-style: normal;
	font-weight: normal;
	}

legend {
	display: none;
	}


/* 2. Containers
---------------------------------------------	visibility: hidden;
*/
html {
	display: inline;
	background: url(../images/html_bg.png) repeat-x top left;
	}

body {
	font-family: Verdana, sans-serif;
	}


/* 3. Skip Links
---------------------------------------------*/
#skip {
	position: absolute;
	left: -500em;
	}


/* 4. Branding
---------------------------------------------*/
#branding {
	position: relative;
	margin: 0 auto;
	width: 955px;
	height: 89px;
	background: url(../images/branding_bgNew.png) no-repeat 16px 0;
	}

#branding h1 {
	position: absolute;
	top: 3px;
	left: 1px;
	width: 160px;
	height: 85px;
	}

#branding h1 a {
	display: block;
	height: 100%;
	overflow: hidden;
	color: white;
	text-indent: -500em;
	}

#branding p {
	position: absolute;
	left: -500em;
	}

#branding > a {
	position: absolute;
	top: 51px;
	right: 14px;
	width: 71px;
	color: white;
	font: 0.7em/1.05em Verdana, sans-serif;
	}


/* 5. Client Login
---------------------------------------------*/
#login {
	position: absolute;
	top: 0;
	left: 838px;
	width: 110px;
	height: 26px;
	text-indent: 0;
	}

#login h4 {
	position: absolute;
	left: -500em;
	}

#login a {
	display: block;
	height: 100%;
	color: black;
	font: bold 0.7em/24px Helvetica, Arial, sans-serif;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
	}


/* 6. Site Navigation
---------------------------------------------*/
#site-nav {
	margin: 1px auto 0;
	width: 955px;
	height: 30px;
	}

#site-nav h3 {
	position: absolute;
	left: -500em;
	background: url(../images/bullet_bg_1.gif) no-repeat top left;   /* pre-load image */
	}

#site-nav ul li {
	float: left;
	margin-left: 1px;
	height: 30px;
	}

#site-nav ul li:first-child {
	margin: 0;
	}

#site-nav ul li a {
	display: block;
	height: 100%;
	overflow: hidden;
	text-indent: -500em;
	background: url(../images/site-nav_a_bg.png) no-repeat;
	}

#site-nav > ul li                          a        { background-position:      0 0; width: 158px; }
#site-nav > ul li + li                     a        { background-position: -159px 0; width: 159px; }
#site-nav > ul li + li + li                a        { background-position: -319px 0; width: 159px; }
#site-nav > ul li + li + li + li           a        { background-position: -479px 0; width: 158px; }
#site-nav > ul li + li + li + li + li      a        { background-position: -638px 0; width: 158px; }
#site-nav > ul li + li + li + li + li + li a        { background-position: -797px 0; width: 158px; }

#site-nav > ul li                          a:hover,
#site-nav > ul li                          a:focus  { background-position:      0 -30px; }
#site-nav > ul li + li                     a:hover,
#site-nav > ul li + li                     a:focus  { background-position: -159px -30px; }
#site-nav > ul li + li + li                a:hover,
#site-nav > ul li + li + li                a:focus  { background-position: -319px -30px; }
#site-nav > ul li + li + li + li           a:hover,
#site-nav > ul li + li + li + li           a:focus  { background-position: -479px -30px; }
#site-nav > ul li + li + li + li + li      a:hover,
#site-nav > ul li + li + li + li + li      a:focus  { background-position: -638px -30px; }
#site-nav > ul li + li + li + li + li + li a:hover,
#site-nav > ul li + li + li + li + li + li a:focus  { background-position: -797px -30px; }

.about      #site-nav > ul li:first-child                          a:hover { background-position:      0 -60px; }
.ps         #site-nav > ul li:first-child + li                     a:hover { background-position: -159px -60px; }
.physicians #site-nav > ul li:first-child + li + li                a:hover { background-position: -319px -60px; }
.patients   #site-nav > ul li:first-child + li + li + li           a:hover { background-position: -479px -60px; }
.news       #site-nav > ul li:first-child + li + li + li + li      a:hover { background-position: -638px -60px; }
.careers    #site-nav > ul li:first-child + li + li + li + li + li a:hover { background-position: -797px -60px; }

            #site-nav > ul li                           a:active,
.about      #site-nav > ul li:first-child                          a { background-position:      0 -60px; }
            #site-nav > ul li + li                      a:active,
.ps         #site-nav > ul li:first-child + li                     a { background-position: -159px -60px; }
            #site-nav > ul li + li + li                 a:active,
.physicians #site-nav > ul li:first-child + li + li                a { background-position: -319px -60px; }
            #site-nav > ul li + li + li + li            a:active,
.patients   #site-nav > ul li:first-child + li + li + li           a { background-position: -479px -60px; }
            #site-nav > ul li + li + li + li + li       a:active,
.news       #site-nav > ul li:first-child + li + li + li + li      a { background-position: -638px -60px; }
            #site-nav > ul li + li + li + li + li + li  a:active,
.careers    #site-nav > ul li:first-child + li + li + li + li + li a { background-position: -797px -60px; }


/* 7. Content
---------------------------------------------*/
#content {
	margin: 18px auto 25px auto;
	width: 955px;
	height: 1%;
	}

#content:after {
	content: ".";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
	
	}


/* 8. Sub Navigation
---------------------------------------------*/
#sub-nav {
	float: left;
	margin-right: 23px;
	padding: 18px 21px 15px;
	width: 171px;
	border: 1px solid #CCC;
	background: #F2F2F2;
	
	}

#sub-nav h3 {
	margin-bottom: 8px;
	color: #E36F1E;
	font: bold 0.75em Verdana, sans-serif;
	text-shadow: #F2F2F2 0 1px 1px;
	}

#sub-nav > ul > li {
	margin-bottom: 9px;
	padding-left: 10px;
	background: url(../images/bullet_bg_1.gif) no-repeat 1px 8px;
	}

#sub-nav ul li a {
	color: black;
	font: 0.7em Verdana, sans-serif;
	}	

#sub-nav ul li ul {
	margin-top: 8px;
	}

#sub-nav ul li ul li {
	margin-bottom: 9px;
	padding-left: 10px;
	background: url(../images/bullet_bg_2.gif) no-repeat 1px 8px;
	}

#sub-nav ul li ul li span {
	display: block;
	margin: 1px -3px 0 0;
	font: italic normal 0.7em Verdana, sans-serif;
	}

#sub-nav ul li a.active {
	color: #00B070;
	font: 0.7em Verdana, sans-serif;
	font-style:italic;
	}	
	
.facebook
{
    background: url(../images/facebookIcon.gif) no-repeat !important;
    height:16px;
}

.twitter
{
    background: url(../images/twitterIcon.gif) no-repeat !important;
    height:16px;
}

/* 9. Text
---------------------------------------------*/
h2 {
	float: left;
	/*margin-bottom: 15px;
	padding: 7px 15px;
	width: 685px;
	border: 1px solid #FFD478;
	font: bold 0.75em Verdana, sans-serif;
	text-shadow: #FEC 0 1px 1px;
	background: #FEC;
*/
	}

h2 div {
	margin: 2px 0 1px;
	font-weight: normal;
	font-size: 0.75em;
	line-height: 1.4em;
	}

#text {
	float: left;
	width: 713px;
	margin-top:0px;
	}

#text h3 {
	position: relative;
	font: bold 0.75em/1.45em Verdana, sans-serif;
	text-shadow: white 0 1px 1px;
	}

#text p {
	margin-bottom: 17px;
	font: 0.75em/1.45em Verdana, sans-serif;
	}

#text ul li {
	padding-left: 10px;
	font: 0.75em/1.45em Verdana, sans-serif;
	background: url(../images/bullet_bg_1.gif) no-repeat 1px 7px;/**/
	list-style-position: outside;
	}

#text ul li h3,
#text ul li p,
#text ul li a {
	font-size: 1em;
	}

#text a {
	color: #E36F1E;
	font: 0.75em Verdana, sans-serif;
	}

#text p a {
	font-size: 1em;
	}


/* 10. The Right-side Information
---------------------------------------------*/
#information {
	position: relative;
	float: right;	
	margin: 1px 24px 0 0;
	
	}

#information h3 {
	margin-bottom: 5px;
	font: bold 0.7em Verdana, sans-serif;
	text-shadow: white 0 1px 1px;
	}

#information ul li {
	position: relative;
	margin-bottom: 4px;
	padding-left: 10px;
	font: 0.7em/1.4em Verdana, sans-serif;
	background: url(../images/bullet_bg_1.gif) no-repeat 1px 7px;
	list-style-position: outside;
	}

#information ul li a {
	color: black;
	}

#information p {
	font: 0.7em/1.45em Verdana, sans-serif;
	}

#information div {
	position: absolute;
	bottom: 0;
	width: 140px;
	}

#information div a {
	position: relative;
	display: block;
	margin: 0 0 4px -3px;
	width: 94px;
	height: 37px;
	overflow: hidden;
	text-indent: -500em;
	background: url(../images/button_bg.png) no-repeat 0 -26px;
	}

#information div span {
	position: relative;
	display: block;
	font: 0.7em/1.35em Verdana, sans-serif;
	}


/* 11. Video
---------------------------------------------*/
#video {
	float: right;
	clear: right;
	margin-top: 25px;
	width: 714px;
	border-left: 1px solid #CCC;
	border-right: 1px solid #CCC;
	border-top: 1px solid #CCC;
	background: #F2F2F2;
	}
	
#vplayer
{
	float: right;
	clear: right;

	padding: 14px 0 11px;
	width: 714px;
	border-left: 1px solid #CCC;
	border-right: 1px solid #CCC;
	border-bottom: 1px solid #CCC;
	background: #F2F2F2;
	}	
	
#vplayer h3 {
	position: absolute;
	left: -500em;
	}

#vplayer img,
#vplayer object,
#vplayer embed {
	display: block;
	margin: 0 auto;
	width: 250px;
	text-align: center;
	}

#vplayer div {
	margin-top: 8px;
	font: 0.7em/1.35em Verdana, sans-serif;
	text-align: center;
	}

/* 12. Corporat Office
---------------------------------------------*/
#office {
	margin: 0 auto;
	padding: 10px 16px 11px;
	width: 921px;
	overflow: hidden;
	border: 1px solid #CCC;
	background: #F2F2F2;
	}

#office > div {
	float: left;
	font: 0.7em/1.5em Verdana, sans-serif;
	}

#office .vcard   { margin-right: 22px; width: 213px; }
#office #support { margin-right: 22px; width: 195px; }

#office div h4 {
	color: #E36F1E;
	text-shadow: #F2F2F2 0 1px 1px;
	}

* + html #office div h4 {
	font-size: 0.95em;
	}

#office .vcard a {
	color: black;
	}

#office .vcard .street-address {
	display: block;
	}

#office .vcard .country-name {
	position: absolute;
	left: -500em;
	}

#office #support ul li a {
	color: black;
	}


/* 13. Site Map
---------------------------------------------*/
#sitemap {
	margin-top: 9px;
	min-height: 27px;
	background: url(../images/sitemap_bg.gif) repeat-x top left;
	}

#sitemap > h4 {
	position: relative;
	top: 5px;
	margin: 0 auto;
	width: 80px;
	height: 22px;
	}

#sitemap h4 a {
	display: block;
	width: 80px;
	height: 22px;
	overflow: hidden;
	text-indent: -500em;
	background: url(../images/sitemap_h4_bg.png) no-repeat 50% 7px;
	outline: none;
	}

#sitemap > ul {
	position: relative;
	margin: 17px auto 0;
	width: 936px;
	display: none;
	}

#sitemap ul > div:first-child,
#sitemap ul > div:first-child + div {
	width: 589px;
	height: 1%;
	background: url(../images/sitemap_div_bg.gif) repeat-y top left;
	}

#sitemap ul > div:first-child       { padding-bottom: 18px; }
#sitemap ul > div:first-child + div { padding-bottom:  7px; }

#sitemap ul div:after {
	content: ".";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
	}

#sitemap ul div > li {
	float: left;
	margin-right: 1px;
	width: 167px;
	list-style-position: outside;
	}

#sitemap ul div > li           { padding-right: 17px; }
#sitemap ul div > li + li      { padding:     0 17px; }
#sitemap ul div > li + li + li { padding-left:  17px; }

#sitemap ul div li h5 {
	color: #E36F1E;
	font: bold 0.7em Verdana, sans-serif;
	text-shadow: white 0 1px 1px;
	}

#sitemap ul div li h5 a {
	text-decoration: none;
	}

#sitemap ul div li ul li {
	padding-left: 10px;
	background: url(../images/bullet_bg_1.gif) no-repeat 1px 8px;
	list-style-position: outside;
	}

#sitemap ul div li ul li a {
	color: black;
	font: 0.7em Verdana, sans-serif;
	}


/* 14. Contact Us
---------------------------------------------*/
#contact {
	position: absolute;
	top: 0;
	right: 0;
	padding-bottom: 30px;
	width: 330px;
	}

#contact h4 {
	margin-bottom: 4px;
	color: #E36F1E;
	font: bold 0.7em Verdana, sans-serif;
	text-shadow: white 0 1px 1px;
	}

#contact #form div:first-child,
#contact #form div:first-child + div {
	float: left;
	margin-bottom: 11px;
	width: 160px;
	}

#contact #form div:first-child {
	margin-right: 10px;
	}

#contact #form div label {
	display: block;
	margin-bottom: 3px;
	font: 0.7em Verdana, sans-serif;
	}

#contact #form div #ctl00_txtName,
#contact #form div #ctl00_txtEmail {
	padding: 2px 2px 0;
	width: 154px;
	height: 16px;
	border: 1px solid;
	font: 0.7em Verdana, sans-serif;
	border-color: #666 #CCC #CCC #666;
	}

#contact #form div textarea {
	margin-top: 1px;
	padding: 2px;
	width: 324px;
	height: 94px;
	overflow: auto;
	border: 1px solid;
	font: 0.7em/1.3em Verdana, sans-serif;
	border-color: #666 #CCC #CCC #666;
	}

#contact #form div #ctl00_btnFooterSubmit {
	float: right;
	margin: 9px -1px 0 0;
	width: 81px;
	height: 24px;
	font: 0.7em Tahoma, sans-serif;
	cursor: pointer;
	}

html:not([xmlns*=""]) #contact #form div #ctl00_btnFooterSubmit {   /* for Firefox */
	padding: 2px;
	width: 84px;
	height: auto;
	}


/* 15. Company Information
---------------------------------------------*/
#com-info {
	width: 450px;
	}
	
	
/* 16. Admin Tags
---------------------------------------------*/
.adminTag
{
	float:right;
	position:relative;
	z-index:1000;
	margin-bottom:-30px;
	font: bold 0.95em Verdana, sans-serif;
	padding:8px;
}	
	
.adminTag a {
	color: #E36F1E;
	font: 0.95em Verdana, sans-serif;
	font-weight:bold;
	}
	

.adminTag1
{
	float:right;
	position:relative;
	margin-bottom:-90px;
	font: bold 0.95em Verdana, sans-serif;
	padding:8px;
}	
	
.adminTag1 a {
	color: #E36F1E;
	font: 0.95em Verdana, sans-serif;
	font-weight:bold;
	}
	
	
.adminLogin
{
	margin-top:-25px;
	margin-left:-110px;
}	


.activeLink
{
	color:#00B070;
}

/* 17. Follow Us
---------------------------------------------*/
#follow {
	float:left;
	margin-right: 23px;
	padding: 18px 21px 15px;
	width: 171px;	
	border: 1px solid #CCC;
	background: #F2F2F2;
	
	}

#follow h3 {
	margin-bottom: 8px;
	color: #E36F1E;
	font: bold 0.75em Verdana, sans-serif;
	text-shadow: #F2F2F2 0 1px 1px;
	}

#follow > ul > li {
	margin-bottom: 9px;
	padding-left: 10px;
	background: url(../images/bullet_bg_1.gif) no-repeat 1px 8px;
	}

#follow ul li a {
	color: black;
	font: 0.7em Verdana, sans-serif;
	}	

#follow ul li ul {
	margin-top: 8px;
	}

#follow ul li ul li {
	margin-bottom: 9px;
	padding-left: 10px;
	background: url(../images/bullet_bg_2.gif) no-repeat 1px 8px;
	}

#follow ul li ul li span {
	display: block;
	margin: 1px -3px 0 0;
	font: italic normal 0.7em Verdana, sans-serif;
	}

#follow ul li a.active {
	color: #00B070;
	font: 0.7em Verdana, sans-serif;
	font-style:italic;
	}	
