/*///////////////////////////////////////////// International Hip Dysplasia Institute Copyright © 2009, McMurry Inc. http://www.mcmurry.com Design by Brandon Kidd Base Stylesheet /////////////////////////////////////////////*/ /*--------------------------------------------- Structure ---------------------------------------------*/ body{ background: #369; color: #666; font-family: 'Droid Sans', Arial, Verdana, Sans-Serif; font-size: 62.5%; } #wrap{ width: 100%; min-width: 960px; background: #e3f3fc url(/ClientResources/Images/bg-wrap-home.gif) no-repeat center bottom; } #top{ width: 100%; min-width: 960px; background: transparent no-repeat center top; } #header-wrap{ width: 100%; min-width: 960px; position: relative; z-index: 100; background: transparent url(/ClientResources/Images/bg-headerwrap.gif) repeat-x center top; } #header{ width: 960px; height: 101px; position: relative; margin: 0 auto; z-index: 30; } #main{ width: 100%; min-width: 960px; } #main_inner{ width: 960px; position: relative; margin: 0 auto; z-index: 20; } #main_content{ width: 680px; display: inline; float: right; padding: 20px 0 20px 20px; } #main_sidebar{ width: 260px; display: inline; float: left; } #footer-wrap{ width: 100%; min-width: 960px; height: 120px; background: transparent url(/ClientResources/Images/bg-footerwrap.jpg) no-repeat center top; } #footer{ width: 960px; position: relative; color: #aec7d8; margin: 0 auto; padding: 20px 0 0; z-index: 10; } /*--------------------------------------------- Utility ---------------------------------------------*/ .clear{ height: 0; clear: both; font-size: 0; line-height: 0; overflow: hidden; } /*--------------------------------------------- Header ---------------------------------------------*/ #header h1{ display: inline; float: left; } #header h1 a{ width: 252px; height: 87px; position: absolute; left: -15px; top: 75px; background: transparent url(/ClientResources/Images/logo.png) no-repeat center top; display: block; text-indent: -99999em; z-index: 15; } /* Navigation */ #header #menu{ width: 960px; height: 56px; position: absolute; left: 0px; top: 0px; z-index: 33; } #header #menu li{ position: relative; display: inline; float: left; } #header #menu li a{ height: 56px; background: transparent url(../Images/bg-mainmenu.png) no-repeat 50% 0; border-right: solid 4px #5488b9; color: #fff; display: inline; float: left; font-family: 'Droid Serif', Georgia, sans-serif; font-size: 16px; line-height: 1; overflow: hidden; padding: 0 36px; text-decoration: none; text-shadow: 1px 1px 1px #275487; text-transform: uppercase; } #header #menu li.expandable a{ background-position: 50% -168px; } #header #menu li.firstlink a{ border-left: solid 4px #5488b9; } #header #menu li a em{ color: #d9d9d9; font-family: 'Droid Sans', Arial, serif; display: block; font-size: 11px; font-style: normal; margin-top: 12px; text-transform: none; } #header #menu li a:hover, #header #menu li a:focus{ background-position: 50% -56px; color: #fef9ab; } #header #menu li.expandable a:hover, #header #menu li.expandable a:focus, #header #menu li.hover a{ background-position: 50% -224px !important; color: #fef9ab; } #header #menu li a:hover em, #header #menu li a:focus em, #header #menu li.hover a em{ color: #fff; } .about #header #menu #menu-about a, .infant-and-child-hip-dysplasia #header #menu #menu-infanthipdysplasia a, .adult-hip-dysplasia #header #menu #menu-adulthipdysplasia a, .patient-stories #header #menu #menu-patientstories a, .for-physicians #header #menu #menu-forphysicians a{ background-position: 50% -280px; } #header #menu .subnav{ width: 240px; position: absolute; left: 4px; top: 56px; z-index: 100; background: transparent url(../Images/bg-dropdown.png) no-repeat 0 0; -moz-box-shadow: 1px 1px 4px #888; -webkit-box-shadow: 1px 1px 4px #888; box-shadow: 1px 1px 4px #888; display: none; padding: 0 5px 5px; } #header #menu-forphysicians .subnav{ left: auto; right: 4px; } #header #menu .subnav li{ width: 240px; border-top: solid 1px #d9d9d9; clear: left; } #header #menu .subnav li.firstlink{ border: 0 none; margin-top: 5px; } #header #menu .subnav li a{ width: 230px; height: auto; background: transparent none; border: 0 none; color: #369; font-family: 'Droid Sans', Arial, serif; font-size: 13px; font-style: normal; line-height: 17px; padding: 4px 5px; text-shadow: 0 0 0 transparent; text-transform: none; } #header #menu .subnav li a:hover{ background: #369; color: #fff; } #header #menu .subnav li.selected a{ background: #e3e3e3; color: #444; } /* OLD #header #menu li a.menu-about{ width: 158px; background-image: url(/ClientResources/Images/menu-about.gif); } #header #menu li a.menu-infanthipdysplasia{ width: 196px; background-image: url(/ClientResources/Images/menu-infanthipdysplasia.gif); } #header #menu li a.menu-adulthipdysplasia{ width: 196px; background-image: url(/ClientResources/Images/menu-adulthipdysplasia.gif); } #header #menu li a.menu-patientstories{ width: 215px; background-image: url(/ClientResources/Images/menu-patientstories.gif); } #header #menu li a.menu-forphysicians{ width: 179px; background-image: url(/ClientResources/Images/menu-forphysicians.gif); border-right: 0 none; } #header #menu li a:hover, #header #menu li a:focus{ background-position: center -56px; } .about #header #menu li a.menu-about, .infant-and-child-hip-dysplasia #header #menu li a.menu-infanthipdysplasia, .adult-hip-dysplasia #header #menu li a.menu-adulthipdysplasia, .patient-stories #header #menu li a.menu-patientstories, .for-physicians #header #menu li a.menu-forphysicians, .get-involved #header #menu li a.menu-getinvolved{ background-position: center bottom; } */ #header #search{ width: 254px; height: 24px; position: absolute; right: 0px; top: 63px; z-index: 20; padding: 3px; } #header #search.hover{ right: -1px; top: 62px; border: solid 1px #faf6de; } #header #search.focus{ right: -1px; top: 62px; border: solid 1px #acd3e9; } #header #search input{ width: 216px; height: 18px; background: transparent; border: 0 none; color: #6e95be; display: inline; float: left; font-size: 12px; line-height: 18px; padding: 2px 0 2px 5px; } #header #search.focus input{ color: #0a3460; } #header #search a{ width: 30px; height: 24px; background: transparent url(/ClientResources/Images/btn-search.gif) no-repeat center top; display: inline; float: left; margin: 0 0 0 3px; overflow: hidden; text-indent: -99999em; } #header #search a:hover, #header #search a:focus{ background-position: center bottom; } /*--------------------------------------------- Main Content ---------------------------------------------*/ #main_content{ font-size: 1.3em; line-height: 1.5em; } #main_content h1, #main_content h2, #main_content h3, #main_content h4, #main_content h5, #main_content h6{ font-weight: normal; } #main_content h1{ color: #369; font-family: 'Droid Serif', Georgia, Times New Roman, Serif; font-size: 2em; line-height: 1.5em; margin: 0 0 .25em; } #main_content h2{ background: transparent url(/ClientResources/Images/bg-h2.gif) no-repeat left; color: #454545; font-size: 1.5em; line-height: 1.5em; padding: 0 0 0 1.15em; } #main_content h2 a{ text-decoration: none; } #main_content h3{ color: #369; font-family: 'Droid Serif', Georgia, Times New Roman, Serif; font-size: 1.4em; line-height: 1.5em; } #main_content h4{ color: #53b9ea; font-size: 1.35em; font-style: italic; line-height: 1.5em; } #main_content h5{ color: #454545; font-size: 1.1em; line-height: 1.5em; } #main_content h6{ color: #53b9ea; font-size: 1em; font-style: italic; line-height: 1.5em; } #main_content p{ color: #666; font-size: 1em; line-height: 1.5em; margin: 0 0 1em; text-align: justify; } #main_content p strong{ color: #454545; font-weight: bold; } #main_content p em{ color: #555; font-style: italic; } #main_content a{ color: #369; } #main_content a:hover, #main_content a:focus{ color: #333; text-decoration: none; } #main_content ul{ color: #666; font-size: 1em; line-height: 1.5em; margin: 0 0 1em 2em; } #main_content ul li{ background: transparent url(/ClientResources/Images/bullet-content.gif) no-repeat left .55em; padding: 0 0 0 1em; } #main_content ol{ color: #666; font-family: Arial, Verdana, Sans-Serif; font-size: 1em; line-height: 1.5em; list-style: decimal; margin: 0 0 1em 3em; } #main_content ol li{ } #main_content fieldset{ border: solid 2px #ccc; padding: 5px 10px; } #main_content legend{ color: #369; font-size: 1.6em; padding: 0 7px; } #main_content blockquote{ background: transparent url(/ClientResources/Images/bg-blockquote.gif) no-repeat right bottom; color: #757575; font-size: 1em; font-style: italic; line-height: 1.5em; padding: 0 20px 10px 0; text-align: justify; } #main_content blockquote span{ background: transparent url(/ClientResources/Images/bg-blockquote-span.gif) no-repeat left top; display: block; padding: 10px 0 0 20px; } #main_content blockquote strong{ color: #757575; font-weight: bold; } #main_content .button, #main_content .button_disabled{ border: 1px solid #ccc; font-size: 1em; font-weight: bold; line-height: 1.25em; padding: 0.5em 1.5em; text-decoration: none; } #main_content .button{ background: #369; border-color: #147; color: #fff; } #main_content .greenbutton:hover, #main_content .greenbutton:focus{ background: #fff !important; border-color: #575 !important; } #main_content input.button{ height: 2em; margin: 0; padding: 0 0.5em; line-height: 1em; } #main_content .button:hover, #main_content .button:focus{ background: #fff; border-color: #369; color: #369; } #main_content .button_disabled{ background: #fff; border-color: #f1f1f1; color: #ccc; } #main_content input.button_disabled{ height: 2em; padding: 0 0.75em; line-height: 1em; } #main_content .button_disabled:hover{ text-decoration: none; } #main_content .photo{ width: 132px; height: 152px; float: left; position: relative; background: url(/Resources/Common/Images/bg_photo.jpg) no-repeat; } #main_content .photo img{ position: absolute; left: 5px; top: 5px; } #main_content .thumb{ width: 72px; height: 82px; float: left; position: relative; background: url(/Resources/Common/Images/bg_photo_thumb.jpg) no-repeat; } #main_content .thumb img{ position: absolute; left: 5px; top: 5px; } #breadcrumb{ margin: 0 0 10px; overflow: hidden; } #breadcrumb ul, #breadcrumb ul li{ background: transparent none; border: 0 none; display: inline; float: left; font-size: 11px; font-weight: bold; margin: 0; overflow: hidden; padding: 0; } #breadcrumb ul li{ background: url(../Images/breadcrumb-separator.gif) no-repeat 1px 1px; margin-right: 0px; padding-bottom: 3px; padding-left: 10px; } #breadcrumb ul li.first{ background: transparent none; padding-left: 0; } /*--------------------------------------------- Main Sidebar ---------------------------------------------*/ /* Latest News */ #latest-news, #socialMediaLinks { width: 220px; position: relative; background: transparent url(/ClientResources/Images/bg-sidebar-control.gif) no-repeat center top; display: inline; float: left; margin: 0 0 5px; padding: 20px 20px 20px; } #latest-news h2 a{ color: #369; display: block !important; font-size: 1.8em; line-height: 1.5em; margin: 0 0 .25em; text-decoration: none; } #latest-news a.viewall{ position: absolute; right: 20px; top: 10px; color: #999; font-size: 1.1em; line-height: 1em; } #latest-news a.viewall:hover, #latest-news a.viewall:focus{ color: #369; text-decoration: none; } #latest-news #news-wrap { display: inline; float: left; overflow: hidden; } #latest-news #news-wrap .news{ width: 220px; cursor: pointer; display: inline; float: left; margin: 0 0 10px; overflow: hidden; } #latest-news #news-wrap .news-hover{ background: transparent url(/ClientResources/Images/bg-newsitem-hover.png) no-repeat left top; } #latest-news #news-wrap .news h3{ width: 165px; display: inline; float: right; font-family: Georgia, Times New Roman, Serif; font-size: 1.2em; line-height: 1.5em; margin: 0.5em 0 0; } #latest-news #news-wrap .news h3 a{ color: #369; text-decoration: none; } #latest-news #news-wrap .news-category434 h3 a{ color: #396; } #latest-news #news-wrap .news-category352 h3 a{ color: #53b9ea; } #latest-news #news-wrap .news .date{ width: 35px; height: 30px; background: transparent url(/ClientResources/Images/bg-latestnews-date.png) no-repeat center top; color: #666; display: inline; float: left; font-size: 1em; line-height: 1.4em; padding: 7px 5px 8px; text-align: center; text-transform: uppercase; } #latest-news #news-wrap .news .date strong{ color: #369; font-size: 2em; font-weight: bold; } #latest-news #news-wrap .news p{ width: 165px; display: inline; float: right; font-size: 1.1em; line-height: 1.25em; } .root #latest-news{ margin-top: 5px; } .root #socialMediaLinks { width: auto; background: transparent none; margin: 5px 22px 15px; padding: 0; } #socialMediaLinks { width: 220px; position: relative; background: transparent url(/ClientResources/Images/bg-sidebar-control.gif) no-repeat center top; display: inline; float: left; margin: 0 0 5px; padding: 15px 20px 20px; } #socialMediaLinks a{ display: inline; float: left; margin: 0 3px; } /* Upcoming Events */ #upcoming-events{ width: 220px; height: 220px; position: relative; background: transparent url(/ClientResources/Images/bg-sidebar-control.gif) no-repeat center top; display: inline; float: left; margin: 0 0 5px; padding: 15px 20px; } #upcoming-events h2{ color: #369; display: block !important; font-size: 1.8em; line-height: 1.5em; margin: 0 0 .25em; } #upcoming-events a.viewall{ position: absolute; right: 20px; top: 25px; color: #999; font-size: 1.1em; line-height: 1em; } #upcoming-events a.viewall:hover, #upcoming-events a.viewall:focus{ color: #369; text-decoration: none; } #upcoming-events a.btn-nextevent{ width: 25px; height: 45px; position: absolute; right: 0px; top: 120px; background: transparent url(/ClientResources/Images/btn-nextevent.png) no-repeat left top; display: block; overflow: hidden; text-indent: -99999em; z-index: 10; } #upcoming-events a.btn-nextevent:hover, #upcoming-events a.btn-nextevent:focus{ background-position: left bottom; } #upcoming-events #event-wrap{ width: 220px; height: 220px; overflow: hidden; } #upcoming-events #event-wrap .event{ background: transparent none !important; display: inline; float: left; } #upcoming-events #event-wrap .event dl{ display: inline; float: left; line-height: 1.8em; overflow: hidden; } #upcoming-events #event-wrap .event dl dt{ font-family: Georgia, Times New Roman, Serif; font-size: 1.4em; line-height: 1.25em; margin: 0 0 .25em; } #upcoming-events #event-wrap .event dl dt a{ color: #333; text-decoration: none; } #upcoming-events #event-wrap .event dl dt a:hover, #upcoming-events #event-wrap .event dl dt a:focus{ color: #369; } #upcoming-events #event-wrap .event dl dd{ border-bottom: dotted 1px #ccc; color: #666; display: inline; float: left; padding: 5px 0; } #upcoming-events #event-wrap .event dl dd.where{ border: 0 none; } #upcoming-events #event-wrap .event dl dd strong{ width: 60px; color: #7792b6; display: inline; float: left; font-size: 1.2em; font-weight: bold; } #upcoming-events #event-wrap .event dl dd em{ width: 160px; color: #666; display: inline; float: left; font-size: 1.1em; font-style: normal; } #upcoming-events #event-wrap .event a.learnmore{ color: #369; font-size: 1.1em; line-height: 1.5em; margin: .25em 0; } #upcoming-events #event-wrap .event a.learnmore:hover, #upcoming-events #event-wrap .event a.learnmore:focus{ color: #454545; text-decoration: none; } /*--------------------------------------------- Footer ---------------------------------------------*/ #footer .sponsor{ width: 150px; height: 75px; position: absolute; top: 10px; background: transparent no-repeat center top; display: block; overflow: hidden; text-indent: -99999em; } #footer .gitrdone{ left: 400px; background-image: url(/ClientResources/Images/sponsor-gitrdone.gif); } #footer .apmc{ left: 560px; background-image: url(/ClientResources/Images/sponsor-apmc.gif); } #footer p{ display: inline; float: left; } #footer ul{ position: absolute; left: 0; top: 35px; } #footer ul li{ border-left: solid 1px #aec7d8; display: inline; float: left; line-height: 1em; padding: 0 .6em; } #footer ul li.firstitem{ border: none 0; padding: 0 .6em 0 0; } #footer a{ color: #aec7d8; text-decoration: none; } #footer a:hover, #footer a:focus{ color: #fff; text-decoration: underline; } #footer small{ width: 300px; position: absolute; left: 0px; top: 55px; color: #6f98b4; display: inline; float: left; font-size: 0.95em; font-style: italic; line-height: 1.25em; } #footer a.mcmurry{ width: 39px; height: 39px; background: transparent url(/ClientResources/Images/mcmurry-website.gif) no-repeat center top; display: inline; float: right; overflow: hidden; text-indent: -99999em; } #footer a.mcmurry:hover, #footer a.mcmurry:focus{ background-position: center bottom; } /*--------------------------------------------- Simple Modal ---------------------------------------------*/ #simplemodal-overlay{ background: #000; } #simplemodal-container{ background: #295789; border: solid 5px #4877a3; padding: 15px; -moz-box-shadow: 3px 3px 3px #666; -webkit-box-shadow: 3px 3px 3px #666; box-shadow: 3px 3px 3px #666; } #simplemodal-container a.modalCloseImg{ width: 25px; height: 29px; position: absolute; right: -18px; top: -15px; z-index: 3200; background: transparent url(/Resources/Common/Images/simplemodal_close.png) no-repeat; cursor: pointer; display: inline; }