img, iframe {max-width: 100%; height: auto} html,body{-webkit-text-size-adjust:100%;text-size-adjust:100%} :root { --main-bg: #F8F8F8; --light: #fff; --light-comp: #555; --light-accent-1: #f0f0f0; --light-accent-2: #42b3e5; --hover: #025a99; --accent: #ffb300; --dark: #202020; --dark-comp: #e3e3e3; --primary: #75199e; --primary-comp: #fff; --secondary: #b15adf; --secondary-comp: #fff; } html { --13px: 0.8125rem; --14px: 0.875rem; --15px: 0.9375rem; --16px: 1rem; --17px: 1.0625rem; --18px: 1.125rem; --19px: 1.1875rem; --20px: 1.25rem; --22px:1.375rem; --23px: 1.4375rem; --24px:1.500rem; --28px:1.750rem; --32px:2.000rem; --40px:2.500rem; --56px:3.500rem; } *:focus-visible, input[type=submit]:focus-visible, .zoom:focus-within { outline-style: solid; outline-width: 2px; outline-color: #000; outline-offset: 4px; border-radius: 3px; transition: all .3s linear .01s; } .banner a:focus-visible { outline-color: #fff; outline-offset: -6px } .focusclarity *:focus-visible { outline-color: var(--light); } .focusclarity input[type=submit]:focus-visible { outline-color: var(--primary) } .jump { text-decoration-line: underline; text-decoration-color: var(--dark); font-weight: bold; text-underline-offset: 4px; position: absolute; color: var(--dark); background-color: var(--accent); left: 300px; top: 0; padding: 10px; border-width: 2px; border-color: var(--secondary-comp); border-style: none solid solid; transform: translateY(-200%); white-space: nowrap; z-index: 999 } .jumpside { text-decoration-line: underline; text-decoration-color: var(--dark); font-weight: bold; text-underline-offset: 4px; position: absolute; color: var(--dark); background-color: var(--accent); left: 0; top: 10px; padding: 10px; border-width: 2px; border-color: var(--secondary-comp); border-style: none solid solid; transform: translateX(-1000%); white-space: nowrap; } .jump:focus { transform: translateY(0); outline-offset: 0; text-decoration: none } .jumpside:focus { transform: translateX(0) } a[target="_blank"] { position: relative } a[target="_blank"] em { padding: 4px; border: 1px solid black; color: #000; background-color: #fff; text-decoration: none; position: absolute; left: 0; top: -35px; z-index: 999; width: 130px; display: none; font-size: 12px; font-family: sans-serif; text-align: center } a[target="_blank"]:is(:hover,:focus) em { display: block } a.logomark[target="_blank"] em { left: 5px; } .ccpaNotice { border-top: 1px solid var(--dark) } .ccpaNotice a em { bottom: unset !important; top: -30px } * { scroll-behavior: smooth; } button { border: none; background: none } button:hover { cursor: pointer } nav button { padding: 15px 23px 15px 8px } nav button:after { content: ""; border-color: #000; border-width: 1px; border-style: none solid solid none; height: 0.5em; margin-left: 0.5em; width: 0.5em; transform: rotate(45deg); display: inline-block; position: absolute; top: 18px } nav li:is(:hover,:focus-within) button:after { border-color: var(--light) } nav button[aria-expanded=true]:after { transform: rotate(-135deg);border-color:var(--light) } nav button[aria-expanded=true] { background-color: var(--hover); color: var(--light) } html { scroll-padding-top: 150px } body, button { font-family: Arial,Helvetica,sans-serif; font-size: 1rem; line-height: 1.5 } body { min-width: 320px; background-color: var(--dark); color: var(--light-comp); text-align: center; } body, nav ul, main ul, footer ul { margin: 0; padding: 0; } h1, h2, h3, h4, h5, h6, p, th, td, dd, dt, li, blockquote { text-align: left; } blockquote { padding: 0 4%; margin: 12px 0; } .container { background-color: var(--main-bg, #f8f8f8); } .top { background-color: var(--light, #fff); border-bottom: 8px solid var(--light-accent-1, #f0f0f0); position: relative; z-index: 9; } .top .grid { grid-template-columns: 230px 1fr; align-items: center } .wrap { position: relative; display: block; max-width: 1120px; margin: 0 auto; } img, iframe { max-width: 100%; height: auto; } #lightbox-container-image-box, #lightbox-container-image-data-box { max-width: 100%; height: auto !important; box-sizing: border-box } .bgimg { position: relative } .bgimg > img:first-of-type { position: absolute; width: 100%; height: 100%; inset: 0; object-fit: cover; z-index: 0 } a img, iframe { border: none; } iframe { aspect-ratio: auto 16 / 9; width: 100% } a, .announcements a:is(:hover,:focus) h3 { color: #3B66C4; } main a { text-decoration-color: var(--light-accent-2, #42b3e5); text-decoration-line: underline; text-underline-offset: 2px; font-weight: bold } .under { text-decoration: underline } :is(a,button):is(:hover,:focus) { text-decoration-color: var(--accent) } :is(nav,.banner,.featured) a:is(:hover,:focus), .cycle-slideshow a, #content .featured h2, .featured a { color: #fff; } h1, h2, h3, h4, header, .banner { font-family: 'PT Sans',sans-serif; } hr { border: none; border-bottom: 1px solid #ddd; } .imgLeft, .imgRight { max-width: 50%; } .imgLeft { float: left; margin: 5px 4% 1% 0; } .imgCenter { display: block; margin: 0 auto; } .imgRight { float: right; margin: 5px 0 1% 4%; } .clear { clear: both; } br.clear { display: none; } .center, .announcements h3, .announcements p, .announcements li { text-align: center; } .table { display: table; width: 100%; } .table > div { display: table-cell; position: relative; vertical-align: top; } .table.half > div { width: 48%; } .table.half > div:first-of-type { padding-right: 2%; } .table.half > div:last-of-type { padding-left: 2%; } .grid { display: grid; grid-gap: 10px 20px; } .grid.mid { align-items: center } .grid.half { grid-template-columns: 1fr 1fr } .grid.third { grid-template-columns: 1fr 1fr 1fr } .flex { display: flex; flex-wrap: wrap; } header { padding: 5px 0; } nav li, .featured a, .halfCol, form div, .social li { display: inline-block; vertical-align: top; } header a, header a:is(:hover,:focus) { color: var(--light-comp, #666); } header { text-align: left; } header a, nav a { display: block; } header span { color: #454547; padding: 0 10px 10px 10px; display: block; font-weight: bold; font-family: Arial, Helvetica, sans-serif; font-size: var(--13px) } nav { text-align: right; margin: 0; } nav li, nav li button { text-transform: uppercase; position: relative } nav a { padding: 15px 8px; } nav :is(a,button) { color: var(--light-comp, #666); text-decoration: none; font-size: var(--15px) } nav :is(a,button):is(:hover,:focus), nav>ul>li:hover>button { background-color: var(--hover, #025a99); color: var(--light, #fff); } nav ul ul { display: none; width: 200px; background-color: #fff; border: 1px solid #ddd; position: absolute; } nav ul ul.lastnav { right: 0 } nav li li, nav li li a { display: block; } nav li li a { border-bottom: 1px solid #eee; } nav li li:last-child a { border-bottom: 0; } nav ul li:hover > ul { display: block !important; z-index: 999; } .sentaClinicBkg { position: relative; } .sentaClinicBkg img:first-child { position: absolute; left: 20px; top: 20px; } .banner { height: 500px; text-align: left } .banner a { display: block; width: 100%; height: 500px; background-position: 92.5% 50%; margin: 0 auto; overflow: hidden; position: relative; color: #fff; text-decoration: none } .banner { text-align: left } .banner a > div { background-color: rgba(0,0,0,.7); display: inline-block; height: 100%; width: 100%; max-width: 350px; text-align: center; position: relative } .banner a h1 { color: #fff } .banner h1, .banner p { max-width: 550px; padding: 0 15px; text-shadow: 1px 1px 1px #000; } .banner h1 { font-size: var(--40px); font-weight: normal; text-align: left; margin-bottom: 20px; padding-top: 40px; } .banner p { line-height: 2 } .banner p, .big { font-size: var(--22px); } .banner a img { margin-left: 4%; } .banner .bgimg > img { object-position: 82% 50% } .covid19banner { display: block; background: #fff; border: 1px solid #333; padding: 10px; font-size: var(--18px); color: #333; width: 250px; margin: 0 0 0 40px; } .covid19banner:hover,.banner:has(.covid19banner):focus-within .covid19banner { background: #ee0000; color: #fff; } .covid19banner strong { display: block; font-size: var(--28px); color: #ee0000; } .covid19banner:hover strong, .banner:has(.covid19banner):focus-within .covid19banner strong { color: #fff; } .logos { background-color: #ddd; padding: 20px 0; } #content .logos li { display: inline-block; vertical-align: middle; margin: 20px } .logos a, .logos img { display: block } .featured { display: table; } .featured a, .announcements a { position: relative; display: table-cell; width: 33%; } .featured a { font-size: var(--14px); padding: 20px 25px 70px; text-decoration: none } .featured a em { top: 0; left: 30px } .featured .one { background-color: #3156a3; } .featured .three { background-color: #256CA2; } .featured .two { background-color: #0370CC; } .featured .two img { background-color: #fff; border-radius: 3px } .featured h2 { font-size: var(--23px); font-weight: normal; margin: 0 0 14px; } .featured p span { display: inline-block; padding: 5px 10px; margin-top: 20px; border: 1px solid #fff; position: absolute; bottom: 30px; } .featured a:is(:hover,:focus) p span, .announcements a { background-color: #fff; color: #666; } .about .grid { grid-gap: 0 20px } .about .grid p { margin-top: 0 } .about h3, .about .grid > div, .about > div > p, .announcements > h2 { padding-left: 10px; padding-right: 10px } .about h3, .news h2, .announcements h2 { font-size: var(--18px); font-weight: normal; color: #333; padding-bottom: 5px; border-bottom: 2px solid #42b3e5; } .about h4, .education h3 { font-size: var(--16px); font-weight: normal; color: #333; } .about h4 { font-weight: bold } .about .flex > div { flex: 1 0 260px; margin: 0 10px; position: relative } .news .grid a { display: none; padding: 0 10px 75px; position: relative } .news .grid a:nth-of-type(-n+2) { display: block } .news .grid { display: grid; grid-template-columns: 1fr 1fr; grid-gap: 10px 0 } .news .grid a > div { height: 400px } .news .grid a img { height: 100%; object-fit: cover; width: 100%; object-position: 50% 0 } .news .grid p:last-of-type { position: absolute; bottom: 0 } .article { text-align: left; display: grid; grid-template-columns: 1fr 1fr; grid-gap: 20px; } .article a > div { height: 250px; } .article img { object-fit: cover; width: 100%; height: 100%; object-position: top; border-radius: 10px 10px 0 0; } .article a { position: relative; color: #666; text-decoration: none; font-weight: normal; box-shadow: #222 0 0 3px; border-radius: 10px; padding-bottom: 75px; } .article h3, .article p { text-align: center; margin: 0 15px; } .article a:nth-of-type(1), .article a:nth-of-type(2), .news .article a { border: none; padding-top: 0; } .article h3 { margin: 10px 0 0 0; } .article p:nth-of-type(1) { margin-top: 0; font-size: 0.8em; } .article p:last-of-type .btn{margin:0} .article p:last-of-type:has(.btn) { position:absolute;bottom:20px;left:50%;transform:translateX(-50%);margin:0 } #tabs .ui-state-active { background-color: var(--hover) } .article-date { font-size: var(--14px); white-space: nowrap; } .announcements { margin-bottom: 20px; } .announcements a { padding: 0 20px 20px; outline: 10px solid #f8f8f8; text-decoration: none } .announcements a:hover em, .announcements a:focus em { bottom: unset; top: -5px } .announcements h3 { font-size: var(--20px); } .about strong { display: block; } #accordion div { border-bottom: 1px solid #ddd; } #accordion h4 { position: relative; } #accordion h4:hover { cursor: pointer; color: #3156a3; } #accordion h4 i { position: absolute; right: 0; padding-top: 3px; } main h1, main h2, main h3, main h4 { font-weight: normal; color: #333; } main h1 { font-size: var(--32px); margin: 0 0 20px; } main h2 { font-size: var(--24px); } main h3 { font-size: var(--18px); } main h4 { font-size: var(--16px); } aside ul { padding: 0 } aside a { text-decoration: none } #sidelabel { font-size: var(--20px); color: #333; font-family: 'Source Sans Pro',sans-serif; font-weight: 500; margin-bottom: 0 } #content li { margin: 5px 0 5px 20px; } #content .nolist li { list-style-type: none; margin: 5px 0; } .btn { display: inline-block; background-color: #3156a3; color: #fff; margin: 5px 0 10px; padding: 5px 10px; text-decoration: none; border-style: solid; border-color: #3156a3; border-width: 4px } :is(.btn,form input[type=submit]):is(:hover,:focus),:is(.carousel a,.article a,.login a):is(:hover,:focus) .btn{ border-color: #42b3e5; color: #fff; border-radius: 3px } .halfCol { width: 48%; margin-top: 5px; margin-bottom: 15px; } .halfCol:nth-of-type(odd) { margin-right: 1%; } .halfCol:nth-of-type(even) { margin-left: 1%; } .hide { display: none !important } form .halfCol { margin: 0; } .back { text-align: right; } footer button { display: block; margin-left: auto; text-decoration-line: underline } .contactText { margin-left: 5%; } form { margin: 40px 0; } form input[type=text], form input[type=email], form input[type=tel], form input[type=submit], form textarea, form label { font-family: Arial,Helvetica,sans-serif; font-size: var(--14px); } form input[type=text], form input[type=email], form input[type=tel], form textarea, form .fakeput { width: 100%; margin-bottom: 16px; padding: 0 10px; border: 1px solid #ddd; display: block; box-sizing: border-box } form input[type=text], form input[type=email], form input[type=tel] { height: 35px; } form label { text-align: left; display: block } form textarea { height: 100px; padding: 10px; } form input[type=submit] { background-color: #3156a3; color: #fff; padding: 10px 20px; border: 1px solid #3156a3; display: block; margin: 12px auto; } form input[type=submit]:hover { cursor: pointer; } form .grid label input { margin: 0 } form .grid { margin-bottom: 15px } #contact { text-align: left; margin-top: 30px; } form .fakeput { background: #fff; color: #666; text-align: left; padding: 10px; height: 35px; line-height: 1; font-size: var(--13px); } form .fakeput > span { display: inline-block; vertical-align: middle; margin-right: 10px } form fieldset { border: none; padding: 0; margin: 0 } form legend { text-align: left; padding: 0; margin: 1em 0 } .rating { overflow: hidden; display: inline-block; font-size: 0; position: relative; margin-top: -2px; } .rating-input { float: right; width: 16px; height: 16px; padding: 0; margin: 0 0 0 -16px; opacity: 0; } .rating:hover .rating-star:hover, .rating:hover .rating-star:hover ~ .rating-star, .rating-input:checked ~ .rating-star { background-position: 0 0; } .rating-star, .rating:hover .rating-star { position: relative; float: right; display: block; width: 16px; height: 16px; background: url('/images-content/star.png') 0 -16px; margin-right: 2px; padding-left: 0 !important } .testimonials img { padding-top: 2%; } .testimonials blockquote { text-align: left; border-bottom: 1px solid #ccc; } .testimonials { border-top: 1px solid #ccc; } .testimonials cite { display: block; margin: 12px 0; text-align: right; } .testimonials .stars { height: 16px; overflow: hidden; background-position: 0 -16px; } .testimonials .stars span { width: 16px; height: 16px; background: url('/images-content/star.png'); display: inline-block; } .stars.four span:nth-of-type(5) { background-position: 0 -16px; } .stars.three span:nth-of-type(5), .stars.three span:nth-of-type(4) { background-position: 0 -16px; } footer, footer a, footer button { color: var(--dark-comp); } footer { padding-top: 20px; border-top: 1px solid var(--dark); background-color: var(--dark) } footer a:is(:hover,:focus) { color: #fff; } footer h2 { font-size: var(--20px); font-weight: normal; color: #fff; } footer li { margin: 0 0 5px 20px; } footer hr { border: none; border-bottom: 1px solid #333; margin: 20px 0; } footer .social { text-align: left; margin: 40px 0 0; } footer .social a { display: block } footer .logomark { margin: 0 0 0 auto; position: relative; display: inline-block } .social li { font-size: var(--16px); } footer a img { float: right; } .sidebar { padding: 10px 0 40px; font-size: var(--15px); } #content .sidebar li { list-style: none; margin: 0 0 5px 0; } .sidebar li a { display: block; color: #333; padding: 10px 0; border-bottom: 2px solid var(--light-accent, #f0f0f0); } .sidebar li a:is(:hover,:focus) { text-decoration: none; border-bottom: 2px solid var(--accent, #ffb300); } .sidebar li li a { padding-left: 15px; } .sidebar ul ul li { font-size: var(--13px); } .caption { display: block; float: right; color: #3156a3; padding: 5px 0 10px 20px; width: 55%; max-width: 325px; } .caption p { font-size: var(--13px); text-align: center; padding: 0 4%; } .margin-top { margin-top: 40px; } .nowrap, a[href^=tel] { white-space: nowrap; } #content, footer .wrap, .news h2 { padding-left: 10px; padding-right: 10px; } #content { grid-gap: 10px 30px; grid-template-columns: 1fr 3fr; padding-top: 30px; padding-bottom: 40px } .google-map { height: 220px; } p.address, h2.address { margin-top: 70px; } p.address { padding-left: 10%; } #gallery { text-align: left; } h1, h2, h3, h4, h5, h6 { font-family: 'Source Sans Pro',sans-serif; } .testimonials blockquote { text-align: left; border-bottom: 1px solid #ccc; } .testimonials cite { display: block; margin: 12px 0; } .education h2 { padding-bottom: 10px; border-bottom: } main ul.indent { padding-left: 30px } .login p { text-align: center; } .login .btn { text-transform: uppercase; width: 200px; } .login { text-align: center; font-size: var(--15px); } .login a { display: inline-block; margin: 1em 0 } .login img { width: 220px; height: auto; } .login a em { left: 50%; transform: translateX(-50%) } .loginbtns { padding: 0; } .loginbtns li { display: table-cell; width: 49%; padding: 5px 10px; margin: 10px; text-align: center; max-height: 40px; vertical-align: middle; border-radius: 3px } .loginbtns img { max-height: calc(100% - 10px) } #testimonial { text-align: left } #testimonial input[type=checkbox] { margin-left: 0 } #testimonial label { padding-left: 10px; display: block } .table.half.articles > div { width: 50%; padding-bottom: 5px; } .table.half.articles > div:first-of-type { padding-right: 5px; } .table.half.articles > div:last-of-type { padding-left: 5px; } .blue { color: #3156a3; font-weight: 700; font-size: var(--18px); } #content .youtube { position: relative; border: 1px solid #efefef } #content .youtube:after { content: ""; background-image: linear-gradient(rgba(0,0,0,.75) 0,rgba(0,0,0,.1) 60px, transparent 200px ); position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none } #content .youtube img { z-index: 0; opacity: 1; filter: contrast(1.1); margin: 0 auto } #content .youtube iframe { z-index: 1 } address { display: block; text-align: left } ul.policies { margin-top: 1em } .policies li { display: inline-block; margin: 5px 10px } .policies a { padding: 5px 20px; margin: 5px; display: block; border-radius: 50px; text-align: center } .news .grid a div, .zoom, .article a div { overflow: hidden } .news .grid a img, .zoom img, .article a div img { display: block } :is(.news .grid a div,.zoom,.youtube,.article a):is(:hover,:focus) img{transform:scale(1.2)} .news .grid a div img, .zoom img, .youtube img, .article a div img { transition: all .3s linear .01s; } .zoom img { margin: 0 auto } .fill img { width: 100%; object-fit: cover } #policy summary, #policy .accordion-section-content { text-align: left } #policy .accordion-section-content, #policy h4 { padding-left: 10px; padding-right: 10px } @media(prefers-reduced-motion) { * { transition: outline-offset 0s !important; transition: all 0s !important; scroll-behavior: unset } main img { transform: none !important } } @media(forced-colors:active) { .logomark img { filter: brightness(0) } } @media(max-width:62.5rem) { .disclosure-nav button { display: none } nav button:after { border: none } .disclosure-nav ul { display: block !important; position: relative; min-width: unset;width:auto; left: unset;border:none;} .disclosure-nav ul :is(a,li){border:none;} .disclosure-nav ul li:nth-of-type(n+2), nav ul ul a span { display: none !important } nav ul ul { display: none !important } nav a { margin: 5px; padding: 10px } .top .grid { grid-template-columns: 1fr } header, nav { display: block; text-align: center; } header span { display: block; } footer li a { margin-bottom: 12px; } .article .btn { position: relative; bottom: unset } .article a { height: auto; border-top: 1px solid #ddd; border-bottom: none; padding-top: 20px } .banner p, .banner h1 { text-shadow: 2px 2px 2px #000,-1px -1px 2px #999 } } @media(max-width:43.75rem) { header, nav { display: block; width: auto; margin: 0; text-align: center; } header span { display: block; } nav ul { display: grid; grid-template-columns: repeat(2,1fr) } nav li { text-align: center; border-top: 2px solid #eee; position: relative } nav a { padding: 4px; margin: 8px; } .about { display: block; width: auto; margin: 0; padding: 0 1% } .table.half.about > div { display: block; width: auto; padding: 0 !important } .top { padding: 6px 0; } #accordion { display: block; } #accordion h4 i { display: none; } #accordion > div { display: table; padding-bottom: 10px; } #accordion > div > p { display: table-cell; vertical-align: middle; } #accordion > div > p:last-of-type { width: 100px; text-align: center; } .featured:last-of-type h2 span { display: block; } .social li { font-size: var(--15px); } .sentaClinicBkg img:first-child { width: 18%; } #testimonial .table.half > div { display: block; width: auto; padding: 0 !important } #testimonial input[type=submit] { width: 100% } #content { grid-template-columns: 1fr !important; padding-top: 10px; padding-bottom: 20px; } .sidebar .subnav { display: none; } .grid.third, main .grid.half { grid-template-columns: 1fr } .sidebar ul { display: grid; grid-template-columns: 1fr 1fr; grid-gap: 10px } .policies a { border: 1px solid var(--light-accent-2) } } @media(max-width:37.5rem) { .featured { display: block; } .featured a:last-of-type, .featured a.half { display: block; width: auto; } .featured:last-of-type a:last-of-type h2 span, .featured:last-of-type h2 span { display: inline; } footer { padding-top: 0; } .social li { margin: 8px; } footer ul.social { margin-top: 16px; } .sidebar ul { text-align: left; } #content .sidebar { padding: 0 } .sidebar li.full { width: auto; } .sidebar li a { padding: 4px 0; margin: 8px 0; } .sentaClinicBkg img:first-child { width: 17%; } .announcements a { display: block; width: calc(100% - 40px); padding: 5px 20px 20px; } .banner .bgimg > img { object-position: 92.5% 50% } .banner a > div { max-width: 100%; } .banner h1, .banner p, .banner { text-align: center } .banner h1 { padding-top: 4vw } .banner h1 span { display: block } .covid19banner { margin: 0 auto; width: 270px; font-size: var(--16px) } } @media(max-width:31.25rem) { .article span { position: relative; bottom: unset; } .cycle-slideshow h1, .cycle-slideshow p { width: auto; max-width: 300px; } .top .wrap, .banner p, .banner h1 { text-align: center; } .banner p br { display: none } h1 + .imgRight, h1 + h2 + .imgRight, .announcements img, #content .articleImgright { max-width: 100%; width: 100%; float: none; margin: 0 auto; padding: 0 } #content .halfCol:nth-of-type(odd), #content .halfCol:nth-of-type(even) { width: auto; display: block; margin: 12px 0; } form .halfCol:nth-of-type(even), form .halfCol:nth-of-type(odd) { display: block; width: auto; margin: 0; } .article a:nth-child(odd), .article a:nth-child(even) { display: block; width: auto; margin: 0 0 20px; height: auto; } .videos iframe { display: block; width: 96vw; height: 53.5vw; margin: 12px 0; } .sentaClinicBkg img:first-child { width: 17%; } .article img, input[type=submit], .google-map { width: 100% } p.address { padding-left: 0; margin: 1em 0 } .table.half > div { display: block; width: auto; padding: 0 !important } .jump { left: unset; right: 0 } .article { grid-template-columns: 1fr } } @media(max-width:25rem) { .featured a { display: block; width: auto; padding: 20px } .featured p, .featured h2 { text-align: center } .featured p span { position: relative; bottom: unset } .img400 { float: none; width: auto; max-width: 100%; margin: 0; padding: 0; } .sentaClinicBkg img:first-child { width: 15%; } } 