/*-------------- Reseting ---------------- */ html, body, div, span, object, h1, h2, h3, h4, h5, h6, p, a, abbr, acronym, img, s, small, strike, sup, sub, dl, dt, dd, ol, ul, li, form, fieldset, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; background: transparent } :focus, :active { outline: 0 } html { font-size: 100.01%; height: 100% } body { font-size: 62.5%; height: 100%; color: #000; background: #e6e6e6} /*-------------- Common ---------------- */ h1, h2, h3, h4, h5, h6 { font-weight: bold; color: #0b69b1 } h1 { font-size: 2.0em; line-height: 1.125em; margin-bottom: 0.5em; color: #0066CC;} h2 { font-size: 1.1em; line-height: 1.2em; margin-bottom: 1.7em; color: #333 } h3 { font-size: 1em; line-height: 1.2857em; margin-bottom: .5em} h4, h5, h6 { font-size: 1em; line-height: 1.5em; margin-bottom: 0.5em } p, pre, code, label, th, td, dd, dt, select, li { font-size: 1.1em; line-height: 1.5em; margin-bottom: 1.0em } ul, ol { margin-bottom: 1.8em } ul { list-style: square } ol { list-style: decimal } li { margin-left: 3.6em; color: #999; } li p { color: #000 } legend { display: none } small { font-size: 0.85em } sup { position:relative; bottom:0.3em; vertical-align: baseline } sub { position:relative; bottom:-0.2em; vertical-align: baseline } acronym, abbr { cursor: help; letter-spacing: 1px; border-bottom: #999 1px dashed } label { cursor: pointer } /*---------------- Fonts -----------------*/ h1, h2, h3, h4, h5, h6 { font-family: Verdana, Arial, Helvetica, sans-serif} p, a, pre, label, th, td, li { font-family: Georgia, "Times New Roman", Times, serif } /*---------------- Links -----------------*/ a:link, a:visited, a:hover, a:active { font-weight: normal; text-decoration: none; color: #000} a:hover { text-decoration: underline } a img { border: 0 } /*----------- Global Classes -------------*/ .clear { clear: both } .floatLeft { float: left } .floatRight { float: right } .textLeft { text-align: left } .textRight { text-align: right } .textCenter { text-align: center } .textJustify { text-align: justify } .bold { font-weight: bold !important } .italic { font-style: italic } .underline { border-bottom: 1px solid } .highlight { background: #ffc } .noPadding { padding: 0 !important} .noMargin { margin: 0 !important } .noIndent { margin-left: 0; padding-left: 0 } .noBullet { list-style: none; list-style-image: none } .noBorder { border: none !important } .noBackground { background: none !important } .clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden } /*-------------- Wrapper ------------------*/ #wrap { width: 768px; overflow: visible; margin: 0 auto; min-height: 100%; position:relative; background: #fff; border-left: 1px solid #999999; border-right: 1px solid #999999 } #wrapH { width: 768px; overflow: visible; margin: 0 auto; background: #fff; border-left: 1px solid #999999; border-right: 1px solid #999999 } /*-------------- Layout -------------------*/ #header { width: 768px; height: 104px; margin: 0 auto; overflow:hidden; background: #fff9cc } .logo { float:left; background:url('/_assets/images/sub-logo.gif') no-repeat; width: 212px; height: 104px; display:block; overflow:hidden} .logo1 { float:left; background:url(/_assets/images/sub-logo.gif) no-repeat; width: 212px; height: 104px; display:block; overflow:hidden} .home .logo { background-image: url('/_assets/images/home-logo.gif'); } #headMenu { float:right; margin:0; margin-top: 37px; overflow:hidden} #headMenu li { float:left; list-style: none; margin:0; height: 29px; overflow:hidden;} #headMenu li a { float:left; display:block;line-height: 1em; height: 29px; overflow:hidden} .navLearn { background:url('/_assets/images/nav-learn.png') no-repeat; width: 104px} .navDifference { background:url('/_assets/images/nav-difference.png') no-repeat; width: 122px} .navBuy { background:url('/_assets/images/nav-buy.png') no-repeat; width: 74px} .navNews { background:url('/_assets/images/nav-news.png') no-repeat; width: 110px} .navAbout { background:url('/_assets/images/nav-about.png') no-repeat; width: 146px} .lang_jp .navLearn { background-image:url('/_assets/images/jp-nav-learn.png');} .lang_jp .navDifference { background-image:url('/_assets/images/jp-nav-difference.png');} .lang_jp #headMenu .navBuy { display:none; } .lang_jp .navNews { background-image:url('/_assets/images/jp-nav-news.png'); } .lang_jp .navAbout { background-image:url('/_assets/images/jp-nav-about.png'); } .hidden { display: block; height:100%;text-indent: -10000em; } .navDifferenceA { background:url(/_assets/images/nav-difference-2.gif) no-repeat !important; width: 122px} .navBuyA { background:url(/_assets/images/nav-buy-2.gif) no-repeat !important; width: 74px} .navNewsA { background:url(/_assets/img/nav-news-2.gif) no-repeat !important width: 110px} .navAboutA { background:url(/_assets/img/nav-about-2.gif) no-repeat !important; width: 146px} .navLearn:hover, .navDifference:hover, .navBuy:hover, .navNews:hover, .navAbout:hover { background-position: 0 -29px; } .learn .navLearn, .difference .navDifference, .buy .navBuy, .news .navNews, .about .navAbout { background-position: 0 -58px; } .login li { display: inline; margin-left:0;} .login li a { display:block; margin-top:9px; margin-left:12px;} .login { background:url(/_assets/images/navbar-bottom-home.gif) no-repeat; width: 540px; height: 30px; float:right; list-style:none; overflow:hidden; margin-right:16px; } .lang_jp .login { background: url('/_assets/images/navbar-bottom-home.png') no-repeat; } .login2 { background:url(/_assets/images/navbar-bottom.gif) no-repeat !important;} .loginButton { width: 68px; height: 21px; overflow:hidden; float:right; } .button2 { width: 68px; height: 21px; overflow:hidden; float:right; } .lang_jp .loginButton { display:none; visibility: hidden;} /*-----------------------------------------*/ #content { overflow: hidden; width: 768px; margin:0 auto; padding-bottom: 136px} #content h1 { padding-left: 255px } .other1 { padding: 59px 17px 0 0; width: 751px !important; background:url(/_assets/images/sub-photo-learn.jpg) left top no-repeat} .other2 { padding: 59px 17px 0 0; width: 751px !important; background-position: left top; background-repeat: no-repeat;} .learn .other2 { background-image: url('/_assets/images/sub-photo-learn.jpg'); } .difference .other2 { background-image: url('/_assets/images/sub-photo-learn.jpg'); } .buy .other2 { background-image: url('/_assets/images/sub-photo-learn.jpg'); } .news .other2, .resources .other2, .about .other2, .about .other1 { background-image: url('/_assets/images/sub-photo-news.jpg'); } .left2 { float:left; width: 160px; background: url(/_assets/images/sub-subnav_bg.jpg) left 33px no-repeat; padding: 56px 30px 170px 26px} .left2 h2 { margin-bottom: 14px} .right2 { float:right; width: 519px; padding-top: 55px} .right2 h2 { font: bold 1.3em/1.2em Georgia, "Times New Roman", Times, serif; margin-bottom: 18px} .right2 p { font: normal 1.3em/1.4em Georgia, "Times New Roman", Times, serif; color: #333; margin-bottom: 30px;} .right2 a { color: #263999; text-decoration:underline} .right2 a:hover { text-decoration:none !Important; color: #ffcc00!Important} .rightFoto { float:right; overflow:hidden; margin:0 0 20px 20px; border: 1px solid #999} .small2 { font-size: 0.9em !Important} .line { float: left; clear:both; padding:20px 0 20px 0; width: 430px; position:relative} .line img { vertical-align: middle} .line a:hover { text-decoration:none; color: #ffcc00} .imgCont { float:left; text-align:center; width: 200px } .textLink { display:block; font: normal 1.3em/1.4em Georgia, "Times New Roman", Times, serif !important; position:absolute; left: 210px; top: 50%; margin-top: -7px} .flags { float:right; border: 1px solid #333333; position:absolute; right: 0px; top: 50%; margin-top: -7px} /*-----------------------------------------*/ .left { float:left; background: url('/_assets/images/home-photo-1.jpg') no-repeat; width: 514px; height: 496px; overflow:hidden} .right { float:right; width: 254px; background: url('/_assets/images/home-text-1.gif') no-repeat; padding-top: 415px} .right a { background:url('/_assets/images/home-button-cartilage.gif') no-repeat !important; width: 178px; height: 44px; display:block; overflow:hidden; margin: 0 0 0 7px} .lang_jp .left { background: url('/_assets/images/jp-home-photo-1.jpg') no-repeat; } .lang_jp .right { background: url('/_assets/images/jp-home-text-1.gif') no-repeat; } .lang_jp .right a { background:url('/_assets/images/jp-home-button-results.gif') no-repeat !important; } /*-----------------------------------------*/ #footer { width: 770px; height: 100px; background:url(/_assets/images/footer.gif) repeat-x; position:absolute; left:-1px; bottom:0; overflow:hidden; padding-top: 18px} #footer p { font: normal 0.9em/1.1em Georgia, "Times New Roman", Times, serif; color: #666666; text-align:center} .logo2 { display:block; width: 184px; height: 74px; background: url(/_assets/images/home-cardinal_logo.gif) no-repeat; overflow:hidden; margin: 17px 0 0 291px} .logo3 { display:block; width: 184px; height: 74px; background: url(/_assets/images/home-cardinal_logo.gif) no-repeat; overflow:hidden; margin: 0px 0 0 291px} #footer a { color: #263999; text-decoration:underline} #footer a:hover { text-decoration:none; color: #ffcc00} #homeFooter { width: 770px; height: 129px; background:url(/_assets/images/footer.gif) repeat-x; overflow:hidden; padding-top: 18px; margin:0 auto} #homeFooter p { font: normal 0.9em/1.1em Georgia, "Times New Roman", Times, serif; color: #666666; text-align:center} #homeFooter a { color: #263999; text-decoration:underline} #homeFooter a:hover { text-decoration:none; color: #ffcc00} /*--------------- Changed ----------------*/ .vendorsList { margin-bottom: 0 } .vendorsList li { margin: 0; overflow: hidden; list-style: none } .vendorsList a:link, .vendorsList a:visited { color: #263999; display: block; position: relative } .vendorsList span { display: block; cursor: pointer } .brandLogo { width: 200px; text-align: center; padding: 18px 0; background: #fff } .brandName { width: 220px; position: absolute; left: 200px; top: 50%; margin-top: -11px; text-decoration: underline; font: normal 1.3em/1.4em Georgia, "Times New Roman", Times, serif !important; } .flag { width: 97px; height: 18px; position: absolute; left: 420px; top: 50%; margin-top: -7px } .subnav { margin-bottom: 0 } .subnav li { margin: 0; padding: 0 0 9px; list-style: none; font-size: 1em } .subnav a:link, .subnav a:visited { display:block; color:#263999; text-decoration:underline; padding: 4px 6px; font: normal 1.1em/1.2em Verdana, Arial, Helvetica, sans-serif } .subnav a:hover, .subnav a:active, { text-decoration:none; color: #ffcc00} .small { font: normal 1em/1.1em Georgia, "Times New Roman", Times, serif !important; margin-top: 23px !Important} .subphoto-test { float:left; margin-right: 20px; border: 1px solid #000000; } .case_study { clear:both; margin-bottom: 80px;} .testimonial_request { clear:both; } .photo_right { float:right; margin: 0px 0px 20px 20px; } .news_index a { text-decoration: none; font-size: small; } .news_index dd { margin-left:10px;} #aboutmsm .aboutmsm, #faq .faq, #research .research, #introduction .introduction, #purity .purity, #brandingpartners .brandingpartners, #onlinesources .onlinesources, #retailstores .retailstores, #slowsosteoarthritis .slowsosteoarthritis, #liverprotection .liverprotection, #cartilageprotection .cartilageprotection, #realpeople .realpeople, #japanesemedia .japanesemedia, #marathonsponsorships .marathonsponsorships, #promotionalsponsorships .promotionalsponsorships, #aboutbergstrom .aboutbergstrom, #resources .resources, .active { border: 1px solid #666666; background:#fff; width: 142px; display:block; padding: 4px 0 4px 7px; text-decoration:none !important; color: #000 !important } #george { width: 210px; background:#cccccc; padding:0px; border: 1px solid #666; float:right; text-align: center; } #george h4 { font-weight:bold; color:#333333; font-size:11px; text-align:center; } #george p { font-size:10px; color:#333333; padding: 0px 5px 10px 10px; line-height:normal; } #george img { margin-top: 15px; } #materials td { border-top: 1px solid #cccccc; vertical-align: top; padding: 10px 10px; }