/*----------------------------------------------------------------------------------- Theme Name: Iosco-Arenac District Library, MI Front-end developer: Husnain Mustafa Author Design: Matt Hicks Author URI: https://www.revize.com/ Date: 06/25/2025 -----------------------------------------------------------------------------------*/ /* ----------------------------------------- #fonts -----------------------------------------*/ @import url('https://fonts.googleapis.com/css2?family=Crimson+Text:ital,wght@0,400;0,600;0,700;1,400;1,600;1,700&family=Encode+Sans+Condensed:wght@100;200;300;400;500;600;700;800;900&family=Freeman&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Public+Sans:ital,wght@0,100..900;1,100..900&display=swap'); /* ----------------------------------------- #basic styles -----------------------------------------*/ /* very important!!! Assign these colors */ :root { --brandcolor: #12454C; --darkgray: #999; --lightgray: #ddd; --white: #fff; --primary-color: #FF984B; --darkgray: #1A1A1A; } body { background: var(--white); font-size: 16px; line-height: 1.5; font-family: "Public Sans", sans-serif; color: var(--darkgray); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -webkit-text-size-adjust: 100%; overflow-x: hidden; top: 0 !important } /* ----------------------------------------- #typography -----------------------------------------*/ h1, h2, h3, h4, h5, h6 {color: #000;font-weight: 700;margin-bottom: 20px;line-height: 1.2;font-family: "Encode Sans Condensed", sans-serif;} h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {font-weight: inherit} h1 {font-size: 56px;line-height: 67.2px;} h2 {font-size: 48px;line-height: 57.6px;} h3 {font-size: 40px;line-height: 48px;} h4 {font-size: 32px;line-height: 41.6px;} h5 {font-size: 24px;line-height: 33.6px;} h6 {font-size: 20px;line-height: 28px;} .header {font-size: 28px;color: var(--brandcolor);margin-bottom: 20px} .subheader {display: block;font-size: 40px;line-height: 48px;color: var(--darkgray);font-weight: 700;margin: 32px 0;font-family: "Encode Sans Condensed", sans-serif;} p {margin: 0 0 20px 0} em {font-style: italic} strong, b {font-weight: bold} small {font-size: 80%} hr {border: solid var(--darkgray);border-width: 1px 0 0;clear: both;margin: 10px 0 30px;height: 0} /* ----------------------------------------- #links -----------------------------------------*/ a, a:visited {text-decoration: underline;-webkit-transition: color .3s ease;-moz-transition: color .3s ease;-o-transition: color .3s ease;transition: color .3s ease;-webkit-transition: background .3s ease;-moz-transition: background .3s ease;-o-transition: background .3s ease;transition: background .3s ease;color: #063366;} p a, p a:visited {line-height: inherit} /* ----------------------------------------- #lists -----------------------------------------*/ ul, ol {margin-bottom: 20px;margin-left: 10px} ul {list-style: disc} ol {list-style: decimal} ul ul, ul ol, ol ol, ol ul {margin: 4px 0 5px 30px} ul ul li, ul ol li, ol ol li, ol ul li {margin-bottom: 6px} li {line-height: 1.3;margin-bottom: 7px} li p {line-height: 1.3} /* ----------------------------------------- #images -----------------------------------------*/ img {max-width: 100%;height: auto} a img {border: none} .alignleft {float: left;clear: left;margin: 0 20px 20px} .alignright {float: right;margin: 0 0 20px 20px} .alignnone {margin: 0 auto 20px;display: block} img[align="right"], img[style*="float: right"], img[style*="float:right"] {margin: 0 0 20px 20px;} img[align="left"], img[style*="float: left"], img[style*="float:left"] {margin: 0 20px 20px 0;} /* ----------------------------------------- #buttons -----------------------------------------*/ .span button{color:#fff!important;text-decoration:none} span.btn a{color:#fff!important;text-decoration:none} span.button a{color:#fff!important;text-decoration:none} .btn{color:#fff!important;text-decoration:none} .btn, .button, a.button, #post button:not(.rz-agenda-search-submit,.rz-doc-search-reset), #post input[type="submit"], #post input[type="reset"], #post input[type="button"], .rz-btn{padding: 12px 24px;background: var(--brandcolor);color:var(--white);border:0;border-radius: 24px;display:inline-block;font-size:16px;text-decoration:none;cursor:pointer;line-height:1.5;vertical-align:middle;transition:all .3s;} .btn:hover, .button:hover, a.button:hover, #post button:hover, #post input[type="submit"]:hover, #post input[type="reset"]:hover, #post input[type="button"]:hover, .rz-btn:hover{-webkit-box-shadow:none;-moz-box-shadow:none;-o-box-shadow:none;box-shadow:none;background: var(--primary-color);color: var(--darkgray);} .button:active, a.button:active, #post button:active, #post input[type="submit"]:active, #post input[type="reset"]:active, #post input[type="button"]:active, .rz-btn:active{-webkit-box-shadow:none;-moz-box-shadow:none;-o-box-shadow:none;box-shadow:none;background:var(--brandcolor);color:var(--white)} #post button::-moz-focus-inner, #post input::-moz-focus-inner{border:0;padding:0} /* ----------------------------------------- #revize edit buttons DO NOT MODIFY -----------------------------------------*/ /* ----------------------------------------- #helpers and positioning for revize buttons -----------------------------------------*/ .relative{position:relative!important} .absolute{position:absolute!important} .static{position: static!important} .user-logged-in{box-shadow: 0 0 10px rgba(21,0,56,0);padding:14px} .rz-bar-center-col{display:none!important} /* default position for revize buttons is top right DO NOT WRAP - Check Below for other positioning */ .rz-btns-container{line-height:1.5!important;font-size:16px;opacity:0;background:var(--white);padding:4px;box-shadow:0px 2px 10px rgba(21, 0, 56, 0.08);border:1px solid rgba(21, 0, 56,.1);transform:translateY(10px);transition:all .2s;position:absolute;top:0;right:0;z-index:9;white-space:nowrap} .rz-btns-stacked{padding:6px 6px 0!important} /* to reposition '.rz-btns-container' WRAP IT IN A DIV WITH ONE OF THE CLASSES BELOW top-left,top-center,right-center,right-bottom,center-bottom,center-center,bottom-left,left-center */ .left-top{top:0!important;right:auto!important;left:0!important;z-index:9;position:absolute} .left-top .rz-btns-container{position:relative!important} .center-top{top:0!important;right:50%!important;transform:translate(50%, 0)!important;z-index:9;position:absolute} .center-top .rz-btns-container{position:relative!important} .right-center{top:50%!important;right:0!important;transform:translate(0, -50%)!important;z-index:9;position:absolute} .right-center .rz-btns-container{position:relative!important} .right-bottom{top:auto!important;right:0!important;bottom:0!important;z-index:9;position:absolute} .right-bottom .rz-btns-container{position:relative!important} .center-bottom{top:auto!important;right:50%!important;bottom:0!important;transform:translateX(50%)!important;z-index:9;position:absolute} .center-bottom .rz-btns-container{position:relative!important} .center-center{top:50%!important;right:50%!important;transform:translate(50%, -50%)!important;z-index:9;position:absolute} .center-center .rz-btns-container{position:relative!important} .left-bottom{top:auto!important;right:auto!important;left:0!important;bottom:0;z-index:9;position:absolute} .left-bottom .rz-btns-container{position:relative!important} .left-center{top:50%!important;right:auto!important;left:0!important;transform:translate(0, -50%)!important;z-index:9;position:absolute} .left-center .rz-btns-container{position:relative!important} /* ----------------------------------------- rzBtn's -----------------------------------------*/ .rz-btns-container a{display:inline-block!important} .rzBtn{text-transform:capitalize;cursor:pointer;text-decoration:none;position:relative;line-height:1.5!important;display:inline-block!important;letter-spacing:0!important;padding:7px 14px;background:var(--white)!important;color:#000!important;font-weight:bold!important;font-size:16px;white-space:nowrap;text-align:center;border:1px solid #e6e6e6;transition:all .2s;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"!important} .rz-btns-stacked a,.rz-btns-stacked .rzBtn{display:block!important;margin-bottom:6px;text-decoration:none} .rzBtn:hover{background:#eee!important;border-color:#ccc;color:#000!important;text-decoration:none} .rzBtn-sm{font-size:14px!important;padding:5px 10px!important} .rzBtn-xs{font-size:12px!important;padding:3px 6px!important} .user-logged-in .yes-has-edit-buttons{position:relative;outline:3px solid transparent;outline-offset:6px} .user-logged-in .yes-has-edit-buttons:hover,.show-edit-buttons .user-logged-in .yes-has-edit-buttons{outline:3px solid #6000fe;outline-offset:3px;z-index:10!important;transition:all .2s;min-width:142px;min-height:32px} .user-logged-in .yes-has-edit-buttons:hover .rz-btns-container:has(.rzBtn), .show-edit-buttons .user-logged-in .yes-has-edit-buttons .rz-btns-container:has(.rzBtn){opacity:1;height:auto;transform:translateY(0);opacity:1} .hide-edit-btns .rz-btns-container{display:none} .user-not-logged-in .rz-btns-container{display:none!important} /* ----------------------------------------- #forms -----------------------------------------*/ form {margin-bottom: 20px} fieldset {margin-bottom: 20px} input[type="text"], input[type="password"], input[type="email"], input[type="search"], textarea, select {border: 1px solid var(--darkgray);padding: .375rem .75rem;outline: none;font-size: 16px;color: var(--brandcolor);margin: 0;display: inline-block;background: var(--white);border-radius: 0;box-shadow: none} input[type="text"]:focus, input[type="password"]:focus, input[type="email"]:focus, input[type="search"]:focus, textarea:focus {color: var(--brandcolor);border: 1px solid var(--darkgray)} label, legend {display: block;font-weight: bold;font-size: 13px} input[type="checkbox"] {display: inline} label span, legend span {font-weight: normal;font-size: 16px;color: #444} .form-control:focus {border-color: inherit;-webkit-box-shadow: none;box-shadow: none} ::-webkit-input-placeholder {color: #777} :-moz-placeholder {color: #777} ::-moz-placeholder {color: #777} :-ms-input-placeholder {color: #777} .gsc-control-cse * {box-sizing: content-box} /* ----------------------------------------- #rz intranet -----------------------------------------*/ form.loginform {background: var(--white);padding: 30px;border: 1px solid #D2DFEF} form.loginform p {background: #E65229;color: var(--white);padding: 20px;line-height: 1} form.loginform label {font-weight: normal} form.loginform label input {display: block;margin-bottom: 10px;width: 100%;box-sizing: border-box;padding: 10px;color: #000} /* ----------------------------------------- #rz alert -----------------------------------------*/ .floating-alert{position:fixed;z-index:1022;bottom:20px;margin:0;right:77px;background: rgba(255, 255, 255, 0.92);backdrop-filter: blur(2px);color:var(--darkgray);padding: 25px 25px 21px;font-size:16px;width:443px;border-radius:24px;line-height: 24px;display:flex;flex-direction:column;box-shadow: 0px 4px 24px 0px rgba(0, 0, 0, 0.25);overflow:hidden;border:0;} .floating-alert h2{color:var(--darkgray);margin:0 0 11px;font-size:24px;font-weight:700;line-height:33.6px; font-family: "Encode Sans Condensed", sans-serif;} .floating-alert p{margin:0} .alert-buttons{margin: 21px -25px -21px;border-top:1px solid #CCC;display:flex} .alert-button{border-right:1px solid #CCC;flex:1;text-align:center;padding:10.5px 0;text-decoration:none;font-size: 16px;color:var(--darkgray) !important;font-weight:700;line-height:1.5} .alert-buttons .alert-button:last-of-type{border:0} .alert-button:hover{background:var(--brandcolor);color: var(--white) !important;text-decoration:none;cursor:pointer} .floating-alert.fade:not(.show){display:none} /* ----------------------------------------- #rz edit -----------------------------------------*/ #event-modal .modal-footer .btn{margin:3px 0 0 10px} /* ----------------------------------------- #main -----------------------------------------*/ #skip{position:fixed;left:-100%;top:-100%;transition:all .3s;z-index:999} #skip:focus{left:50px;top:50px} .home-bg {position: absolute;width: 100%;top: 0;z-index: -1;height: 100%;} .container {width: 1214px;max-width: 100%;} #main {position: relative;} #homepage #main::before {position: absolute;content: '';background: url(../images/home-graphic.png) center/cover no-repeat;width: 100%;height: 3036px;top: 0;left: 0;} #doc-search-form .rz-doc-search-submit {border-radius: 0 !important;} .rz-block-img[style="background: url('_assets_/images/logo.png') center center / cover no-repeat;"]{background-size:50% !important;background-position:center center !important} .rz-block-img[style="background: url('_assets_/images/logo.png') center center / cover no-repeat;"]:after{background: linear-gradient(to bottom, rgba(2, 16, 37, 0.96) 0%, rgba(126, 133, 144, 0.04) 22%, rgba(255, 255, 255, 0.04) 100%) !important;} .business-social-links a > .fa-twitter::before { content: ""; width: 16px; height: 16px; background: url("../images/twitter.png"); display: inline-block; background-repeat: no-repeat; background-size: 16px; margin: 0 1px -2px 2px; } .rpfbids tr td {text-align: left;} .faq-question {display: flex;align-items: center;justify-content: space-between;width: 100%;} .user-logged-in #rz-bar-wrap{z-index: 1030 !important;} tr#rz-rpfbids-row, body .cat h3, #rz-business-categories ul li a{background: var(--brandcolor) !important;} .dataTable#example tbody tr:nth-of-type(odd) {background-color: rgba(0,0,0,.05);} /* site-header */ .site-header {position: relative;z-index: 1020;} .site-header .container {width: 1422px;} #header-top {background: var(--brandcolor);} #header-top-in {position: relative; display: flex;align-items: center;justify-content: space-between;padding: 8px 0;} .header-contact {gap: 16px;} .header-contact-link {position: relative;display: flex;align-items: center;font-size: 14px;line-height: 21px;color: var(--white) !important;text-decoration: none;} .header-contact-link img {width: 20px;margin-right: 8px;} .header-contact-link:hover {color: var(--primary-color) !important;text-decoration: none;} .header-contact-link:hover img {filter: brightness(0) saturate(100%) invert(81%) sepia(23%) saturate(5389%) hue-rotate(325deg) brightness(102%) contrast(101%);} .header-top-links ul {margin: 0;padding: 0;list-style-type: none;gap: 25px;} .header-top-links ul li {margin-bottom: 0;} .header-top-links ul li a {color: #041F3D;font-weight: 700;line-height: 24px;text-decoration: none;} .social-media-wrap {gap: 8px;} .social-media-link img {width: 24px;} .social-media-link:hover img {filter: brightness(0) saturate(100%) invert(81%) sepia(23%) saturate(5389%) hue-rotate(325deg) brightness(102%) contrast(101%);} .header-top-right {display: flex;align-items: center;gap: 24px;} #header-bottom {position: relative;display: flex;justify-content: center;align-items: center;} #header-bottom::after {position: absolute;content: '';background: rgba(244, 244, 244, 0.89);backdrop-filter: blur(4.5px);width: 100%;height: 100%;top: 0;left: 0;z-index: -1;} #header-bottom-in {position: relative;display: flex;align-items: center;justify-content: space-between;height: 72px;} #header-bottom-wrap {position: relative;display: flex;align-items: center;justify-content: center;max-width: 1018px;width: 100%;height: 37px;background-color: var(--white);border-radius: 8px;margin: 0 auto;} #logo{display: inline-flex;align-items: center;gap: 4px;} .logo-img {width: 96.31px;} .logo-text {width: 309.5px;} .header-right {display: flex;align-items: center;gap: 16px;} .contact-btn {display: inline-block;padding: 9.7px 20px;background-color: var(--primary-color);border: 1px solid var(--primary-color);border-radius: 24px;color: var(--darkgray) !important;text-decoration: none;} .contact-btn:hover {background: none;border-color: var(--brandcolor);color: var(--brandcolor) !important;text-decoration: none;} /*base nav styles*/ #nav .fa:before {font-family: 'FontAwesome' !important} .site-header #nav {padding: 0;position: static;margin: 0 auto;max-width: 100%;} .site-header #nav li {margin: 0;list-style: none;} .site-header #nav a, .site-header #nav span {font-size: 16px;font-weight: 700;line-height: 24px;color: var(--darkgray);display: block;text-transform: capitalize;text-decoration: none;padding: 12px 16px;z-index: 1; transition: all 0.3s;} .site-header #nav ul {padding: 0;margin: 0;} .site-header #nav a:not(.fa), .site-header #nav span:not(.fa) {font-family: "Encode Sans Condensed", sans-serif;} .text-overflow {overflow: hidden;text-overflow: ellipsis;white-space: nowrap} .toggle {display: none} #twitterfeed {background: #f1f1f1} .goog-te-banner-frame {display: none} /* Google translate */ #header-translate{position:relative;display: flex;justify-content: flex-end;} #header-translate-btn{background: var(--brandcolor);border-radius:50%;width: 40px;height: 40px;padding: 0;border: none;display: flex;align-items: center;justify-content: center;line-height: 1;transition: all 0.3s;cursor: pointer;} #header-translate-btn span{margin-right:8px} #header-translate-btn img {width: 24px;} #header-translate-btn:hover, #header-translate-btn.active {background: var(--primary-color);} #header-translate-btn:hover img, #header-translate-btn.active img {filter: brightness(0) saturate(100%) invert(4%) sepia(23%) saturate(120%) hue-rotate(314deg) brightness(91%) contrast(86%);} #header-translate-in{display:none;position:absolute;top: 100%;right: -10px;z-index:200;color:var(--white);width: 173px;height: 138px;} #header-translate-box{position:relative;padding: 34px 5px 18px;background: url(../images/translate-bg-triangle.png) center/cover no-repeat;width: 173px;height: 138px;filter: drop-shadow(0px 4px 12px rgba(0, 0, 0, 0.08));text-align:center} .select-language-txt{font-size: 12px;font-weight: 400;line-height:13.8px} #english-spanish-links{margin:9px 0 3px} #english-spanish-links a{display: block;font-size: 14px;font-weight: 700;color:var(--white);margin:0 9px;text-decoration:none} #english-spanish-links a:hover{color:var(--primary-color);text-decoration:none} div.skiptranslate{display:none!important} .goog-te-banner-frame{display:none} #google-translate{display:none} #goog-gt-tt{display:none!important} #translation-links{display:inline-block;padding:0;margin:0} #translation-links>li{position:relative;margin:0;list-style:none} #translation-links ul{padding:10px 15px;margin:0;position:absolute;top:40px;left:50%;transform:translateX(-50%);height:239px;width:173px;background:var(--brandcolor);display:none;z-index:9999999;overflow:auto;border-radius:12px} #translation-links ul li{display:block;float:none;width:100%;padding:2px 0;list-style:none;margin-bottom:0} #translation-links ul li a{text-decoration:none;font-size:16px;color:var(--white)} #translation-links ul li a:hover {color: var(--primary-color);} #translate-button{border:none;background:none;margin:0;padding:0;font-size: 12px;font-weight: 700; color:var(--white);line-height: 1;text-transform:capitalize;display:inline-flex;align-items:center} #translate-button img{width:5.4px;margin-left: 3px;} /* search */ #search-toggle-desktop {background-color: var(--brandcolor);border-radius: 50%;display: flex;align-items: center;justify-content: center;width: 40px;height: 40px;cursor: pointer;} #search-toggle-desktop img {width: 24px;} #search-toggle-desktop:hover, #search-toggle-desktop.active {background-color: var(--primary-color);} #search-toggle-desktop:hover img, #search-toggle-desktop.active img {filter: brightness(0) saturate(100%) invert(4%) sepia(23%) saturate(120%) hue-rotate(314deg) brightness(91%) contrast(86%);} #search {position: absolute;top: 100%;right: 0; width: 250px;max-width: 100%;height: 40px;display: none;z-index: 10;} #search form {width: 100%;height: 100%;margin: 0;} #search label {margin: 0;line-height: 51px;font-size: 14px;font-weight: bold;color: #1B1B1B;display: block;margin-right: 35px;} #search input {padding: 4px 42px 4px 15px;background: var(--brandcolor);border: 0;border-radius: 8px;width: 100%;height: 100%;color: var(--white);transition: all 0.3s;} #search input::-webkit-input-placeholder{color: var(--white);} #search input:-moz-placeholder{color: var(--white);} #search input::-moz-placeholder{color: var(--white);} #search input:-ms-input-placeholder{color: var(--white);} #search input:focus::placeholder {color: var(--white);} #search button {position: absolute;top: 50%;transform: translateY(-50%);right: 8px;width: 30px;height: 30px;border-radius: 48px;background: none;border: none;padding: 0;line-height: 1;transition: all 0.3s;} #search button img {width: 20px;} #search button:hover {background-color: var(--primary-color);} #search button:hover img {filter: brightness(0) saturate(100%) invert(4%) sepia(23%) saturate(120%) hue-rotate(314deg) brightness(91%) contrast(86%);} /* ----------------------------------------- #inner -----------------------------------------*/ body.user-logged-in aside .has-edit-buttons.yes-has-edit-buttons {min-height: 45px;} body:not(.user-logged-in) #flyout-wrap.hide-box, body:not(.user-logged-in) #contact-wrap.hide-box, body:not(.user-logged-in) #resource-wrap.hide-box {display: none;} body:not(.user-logged-in) .hide-left-box {display: none;} body:not(.user-logged-in) #freeform-wrapper .col-lg-3.hide-left-box + .col-lg-9 {flex: 100% !important;max-width: 100% !important;} #freeform #main {z-index: 15;} #freeform-wrapper>.container {width: 1374px;} #freeform.tiles #freeform-wrapper>.container {width: 1342px;} #freeform.fullwidth #freeform-wrapper, #freeform.tiles #freeform-wrapper {padding: 64px 0 112px;} #freeform aside{background: var(--brandcolor);border-radius: 24px;position: relative;height: fit-content;padding: 0;margin-top: -58px;} #freeform {position: relative;} #freeform #slider {position: relative;padding: 0;height: 300px;} #freeform #slider>img {position: absolute;left: 0;right: 0;bottom: 0;width: 100%;z-index: 11} #flyout-wrap {position: relative;padding: 32px;z-index: 1;} #flyout-header {font-size: 24px;color: var(--white);font-weight: 700;line-height: 33.6px;width: fit-content;margin-bottom: 16px;padding-bottom: 10px;border-bottom: 1px solid var(--primary-color);text-transform: capitalize;font-family: "Encode Sans Condensed", sans-serif;} #flyout {position: relative;;margin: 0;padding: 0;z-index: 1;} #flyout li {position: relative;margin: 0;padding: 0;list-style: none;z-index: 10;} #flyout a, #flyout span {display: inline-block;text-decoration: none;font-size: 14px;font-weight: 400;color: var(--white);line-height: 18.9px;letter-spacing: -0.28px;text-transform: capitalize;transition: all 0.3s;} #flyout a:not(.fa) {font-family: "Inter", sans-serif;} #flyout ul {padding: 0;margin: 0;display: none;position: relative;} #flyout ul a, #flyout ul span {font-size: 14px;padding: 0;margin: 0;color: var(--darkgray);} #flyout ul li {padding: 0;margin: 0;} .col-xs-12 {width: 100%} .freeform-box-header {font-size: 24px;color: var(--white);font-weight: 700;line-height: 33.6px;width: fit-content;margin-bottom: 24px;padding-bottom: 10px;border-bottom: 1px solid var(--primary-color);text-transform: capitalize;font-family: "Encode Sans Condensed", sans-serif;} #contact-wrap {position: relative;padding: 32px;z-index: 1;} .contact-profile-detail {display: flex;align-items: center;gap: 12px;} .profile-img {width: 90px;height: 90px;border-radius: 8px;} .contact-name {color: var(--white);font-size: 18px;font-weight: 700;line-height: 27px;margin: 0;} .contact-position {display: block;color: var(--primary-color);font-weight: 400;line-height: 24px;margin-top: 4px;} #contact-info {margin: 28px 0 0 0;padding: 0;list-style: none;} #contact-info li {margin-bottom: 24px;} #contact-info li, #contact-info .contact-link {display: block;color: var(--white);font-size: 14px;line-height: 21px;display: flex;align-items: center;gap: 12px; text-decoration: none;transition: all 0.3s;} #contact-info .contact-link img {width: 24px;} #contact-info .contact-link.contact-email {text-decoration: underline;text-underline-offset: 2px;} #contact-info .contact-link:hover {text-decoration: underline;} #contact-info li img {width: 24px;} .contact-text {font-size: 14px;line-height: 21px;color: var(--white);margin: 24px 0 0 0;} #hours-wrap {position: relative;padding: 32px;z-index: 1;} #hours-wrap ul {padding: 0;margin: 0;list-style-type: none;} #hours-wrap ul li {font-size: 14px;margin: 0;padding: 10.5px 0;position: relative;z-index: 1;} #hours-wrap ul li.active::before {position: absolute;content: '';background: var(--secondary-color);border-radius: 16px;height: 100%;top: 0;left: -13px;right: 0;z-index: -1;} #hours-wrap .day {display: inline-block;width: 38px;font-size: 14px;color: var(--primary-color);font-weight: 700;line-height: 21px;margin-right: 13px;text-transform: uppercase;} #hours-wrap .time {color: var(--white);font-size: 14px;line-height: 21px;} #resource-wrap {position: relative;padding: 32px;z-index: 1;} #resource-wrap .resource-link {background: #2D6774;border: 1px solid rgba(74, 91, 125, 0.50);border-radius: 12px;display: flex;align-items: center;gap: 12px;color: var(--white);padding: 16px;margin-top: 20px;font-size: 14px;font-weight: 400;line-height: 18.9px;letter-spacing: -0.28px;text-transform: capitalize;text-decoration: none;} #resource-wrap .resource-link:hover {background: var(--primary-color);border-color: rgba(118, 138, 180, 0.50);color: var(--darkgray);} .resource-link img {width: 24px;} #resource-wrap .resource-link:hover img {filter: brightness(0) saturate(100%) invert(6%) sepia(98%) saturate(10%) hue-rotate(331deg) brightness(95%) contrast(91%);} #page-title {font-size: 48px;color: var(--darkgray);font-weight: 700;line-height: 57.6px;margin-bottom: 24px;text-transform: capitalize;font-family: "Encode Sans Condensed", sans-serif;} #breadcrumbs {margin-bottom: 48px;} #breadcrumbs ul {margin: 0;padding: 0;list-style: none;text-transform: capitalize;} #breadcrumbs ul li {display: inline-block;margin: 0;position: relative;font-size: 16px;margin-right: 32px;color: var(--darkgray);font-weight: 700 !important;text-decoration: none;} #breadcrumbs ul li:last-child {margin-right: 0;} #breadcrumbs a {display: inline-block;position: relative;font-size: 16px;color: var(--darkgray);text-decoration: none;font-weight: 400;line-height: 24px;} #breadcrumbs ul li:not(:last-of-type)::after {content: '\f054';font-family: 'FontAwesome';font-size: 11px;font-weight: 400;position: absolute;top: 50%;transform: translateY(-50%);margin: 0 16px;color: var(--darkgray);} #post blockquote {margin: 32px 0;font-size: 24px;line-height: 33.6px;color: var(--darkgray);font-weight: 400;font-style: italic;background: none;padding-left: 20px;border-left: 2px solid var(--darkgray);} .img-caption {display: block;margin: 8px 0 32px;font-size: 14px;padding-left: 8px;border-left: 2px solid var(--darkgray);} #post p>strong {font-size: 20px;line-height: 30px;color: var(--darkgray);} .department #post p>strong {color: var(--brandcolor);} /* ----------------------------------------- #share widget -----------------------------------------*/ .modal {z-index: 100000} /** modal **/ .modal .modal-dialog{transition:transform cubic-bezier(0.86,0,0.07,1);transform:scale(.98)!important;opacity:1!important} .modal.show .modal-dialog{transition:transform .3s cubic-bezier(0.86,0,0.07,1);transform:translateY(0%)!important;} .modal-content {border-radius: 10px;overflow: hidden;border: 0;} .modal-header {background:#d2d2d2;border-radius:10px 10px 0 0 ;font-size:18px;line-height:1.4;} .share-btns{display:flex;gap:8px;justify-content: center;} .share-btns a {display: flex;text-decoration: none;border-radius: 100%;height: 44px;width: 44px;outline-offset:0;outline:2px solid transparent;transition:all .3s;} .share-btns svg {width:16px;height:16px;margin:auto;fill: var(--white)} .btn-linkedin {background: #0077b5;} .btn-linkedin:hover {border-color: #0077b5;outline:2px solid #0077b5;outline-offset:2px} .btn-facebook {background: #3b5998;} .btn-facebook:hover {border-color: #3b5998;outline:2px solid #3b5998;outline-offset:2px} .btn-twitter {background: #000;} .btn-twitter:hover {border-color: #000;outline:2px solid #000;outline-offset:2px} .btn-reddit {background: #ff5700;} .btn-reddit:hover {border-color: #ff5700;outline:2px solid #ff5700;outline-offset:2px} .modal .btn{font-size: 16px!important;font-weight: bold!important;padding: .6rem 1.2rem!important;border: 0!important;line-height: 1.4!important;text-transform:none!important;letter-spacing:0!important;color:#000!important;border:0!important;} .modal .btn.p-0{padding:0!important} .modal .btn-inverse:focus{box-shadow:0 0 0 .2rem rgba(0,0,0,.25)} .floating-share-btn {position: fixed;z-index: 1020;bottom: 20px;right: 11px;border-radius: 24px;border: 2px solid var(--white);background: var(--primary-color);width: 32px;height: 48px;padding: 0;text-align: center;line-height: 1;transition: all 0.3s;} .floating-share-btn img {width: 18px;margin-right: 1px;} .floating-share-btn svg path {fill: var(--white);} #freeform .floating-share-btn {bottom: 88px;} /* site-plugin */ #ada-plugin{position: fixed;z-index: 1020;bottom: 20px;left: 11px;border-radius: 48px;} #freeform #ada-plugin {left: unset;right: 0;} body #userwayAccessibilityIcon{display: none !important;} #ada-btn{width: 54px;height: 54px;background: var(--brandcolor);border: 2px solid var(--white);border-radius: 50%;padding:0;box-shadow: 0px 3px 8px 0px rgba(0, 0, 0, 0.20);} #ada-btn img{width: 29.08px;} /* ----------------------------------------- #slider -----------------------------------------*/ #slider{position:relative;height: 635px;z-index:2} #homepage #slider::before {position: absolute;content: '';background: radial-gradient(31.62% 43.39% at 18.44% 71.89%, #000 0%, rgba(0, 0, 0, 0.00) 100%);top: 0;left: 0;width: 100%;height: 100%;z-index: 1;} #slider .tns-outer{position:absolute;left:0;right:0;top:0;bottom:0} #slider .tns-controls {z-index: 2;} #homepage #slider .tns-controls {top: 58%;} #slider .tns-controls button:first-of-type {margin-left: 24px;} #slider .tns-controls button:last-of-type {margin-right: 24px;} #slider-caption {position: absolute;bottom: 111px;left: 50%;transform: translateX(-50%);z-index: 1;} .slider-caption-wrap {max-width: 584px;width: 100%;} #typed-wrap {font-size: 48px;font-weight: 700;color: var(--primary-color);line-height: 57.6px;margin-bottom: 0; font-family: "Encode Sans Condensed", sans-serif;} #typed span {color: var(--white);margin-left: 8px;} .typed-cursor {color: var(--white);} .slider-text {font-size: 18px;color: var(--white);line-height: 27px;margin-top: 12px;max-width: 484px;} .slider-btns {display: flex;gap: 12px;margin-top: 32px;} .slider-btns .button {padding: 11.2px 24px;border: 1px solid transparent;} .slider-btns .location-btn {background-color: var(--white);border-color: var(--white);color: var(--darkgray);} .slider-btns .location-btn:hover {background: none;color: var(--white);} .slider-btns .more-btn {border: 1px solid var(--white);background: none;} .slider-btns .more-btn:hover {background: var(--white);color: var(--darkgray);} .tiny-slider-wrap > .tns-outer, .tiny-slider-wrap > .tns-outer > .tns-inner, .tiny-slider-wrap > .tns-outer > .tns-inner > .tiny-slider, .tiny-slider-wrap > .tns-outer > .tns-inner > .tiny-slider .tns-item, .tns-bg-slide {height:100%} .tns-outer{position:relative} .tns-controls{position:absolute;top:50%;left:0;right:0;transform:translateY(-50%);} .tns-controls button {background: var(--primary-color);padding: 0;width:48px;height:48px;border: 0;border-radius: 50%;line-height: 1;transition: all 0.3s;} .tns-controls button img {width: 24px;} .tns-controls button:last-of-type {float:right} .tiny-slider-wrap button[data-action]{position:absolute;bottom:0;right:0;z-index:1} ul.tiny-slider, ul.tiny-carousel{padding:0;margin:0} .slider-graphic {position: absolute;bottom: -28px;left: 0;width: 100%;height: 28px;} .section-header {margin-bottom: 48px;max-width: 667px;} .section-heading {font-size: 56px; font-weight: 700;line-height: 67.2px;color: var(--darkgray);margin-bottom: 0;font-family: "Encode Sans Condensed", sans-serif;} .section-heading span {display: block;color: var(--brandcolor);font-size: 32px;font-weight: 600;font-style: italic;line-height: normal;margin-bottom: 16px;font-family: "Crimson Text", serif;} .section-text {color: var(--brandcolor);font-size: 18px;font-weight: 400;line-height: 27px;margin-top: 12px;} #events .button {background-color: var(--primary-color);color: var(--darkgray);} #events .button:hover {background-color: var(--brandcolor);color: var(--white);} /* section quick-links */ #quick-links {padding-top: 108px;} #quick-links .container {width: 1350px;} #quick-links-in {padding: 0 68px;} .tiny-first .quick-link {border-radius: 24px 0 0 24px;} .tiny-first .quick-link::before {border-radius: 24px 0 0 24px;} .tiny-last .quick-link {border-radius: 0 24px 24px 0;} .tiny-last .quick-link::before {border-radius: 0 24px 24px 0;} .quick-link {position: relative;display: block;padding: 24px;height: 152px;text-decoration: none;transition: all 0.3s;z-index: 1;} .quick-link::before {position: absolute;content: '';background-color: rgba(18, 69, 76, 0.9);width: 100%;height: 100%;top: 0;left: 0;transition: all 0.3s;z-index: -1;} .quick-link:hover::before {background-color: rgba(255, 152, 75, 0.9);} .quick-link:hover {background: #023047;text-decoration: none;} .qlink-icon-box img {width: 48px;} .quick-link:hover .qlink-icon-box img {filter: brightness(0) saturate(100%) invert(8%) sepia(4%) saturate(20%) hue-rotate(314deg) brightness(96%) contrast(94%);} .qlink-title {font-size: 20px;font-weight: 700;line-height: 28px;color: var(--white);margin: 12px 0 0;font-family: "Encode Sans Condensed", sans-serif;} .quick-link:hover .qlink-title {color: var(--darkgray);} #quick-links .tns-controls button:hover {background-color: var(--brandcolor);} #quick-links .tns-controls button:hover img {filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(7495%) hue-rotate(183deg) brightness(95%) contrast(106%);} #quick-links .tns-controls button:first-of-type{ margin-left: -68px;} #quick-links .tns-controls button:last-of-type{ margin-right: -68px;} /* events style */ #events {position: relative;padding-top: 80px;padding-bottom: 112px;z-index: 1;} .events-bg {position: absolute;width: 100%;height: 100%;top: 0;left: 0;opacity: 8%;z-index: -1;} #event-tabs-box-wrap {width: 50%;display: flex;justify-content: flex-end;margin-bottom: 8px;} #event-tabs-box {position: relative;z-index: 12;} #event-filter {position: relative;background-color: var(--primary-color);border-radius: 24px;padding: 12px 0;font-size: 16px;font-weight: 400;color: var(--darkgray);cursor: pointer;display: flex;align-items: center;justify-content: center;width: 190px;} #event-filter::after{content:'';display:inline-block;width:24px;height:24px;position:relative;left:8px;top:50%;background:url(../images/event-select-arrow.png) center/cover no-repeat} #event-filter.opened {background-color: var(--brandcolor);color: var(--white);} #event-filter.opened::after {filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(4915%) hue-rotate(307deg) brightness(117%) contrast(101%);} #event-tabs {position: absolute;right: 0;top: 100%;background-color: var(--brandcolor);border-radius: 24px;padding: 16px 24px;margin: 0;list-style-type: none;width: 165px;transition: all .4s ease-in-out;opacity: 0;visibility: hidden;pointer-events: none;transform: translateY(15px);z-index: 1;} #event-filter.opened + #event-tabs-wrap #event-tabs {opacity: 1;visibility: visible;pointer-events: all;transform: translateY(8px);} #event-tabs .event-tab {font-size: 14px;font-weight: 700;color: var(--white) !important;line-height: 21px;cursor: pointer;margin-bottom: 12px;transition: all 0.3s;} #event-tabs .event-tab:last-of-type {margin-bottom: 0;} #event-tabs .event-tab:hover {color: #DA6915 !important;} #events .button {margin-top: 24px;} /* branches style */ #branches {position: relative;background-color: var(--primary-color);border-top: 10px solid var(--white);border-bottom: 10px solid var(--white);box-shadow: 0px 12px 16px -4px rgba(0, 0, 0, 0.08), 0px 4px 6px -2px rgba(0, 0, 0, 0.03);} .branch-bg-img {position: absolute;top: 0;left: 0;width: 58%;height: 100%;opacity: 7%;} #branches .section-header {margin-bottom: 0;} #branches .section-heading {font-size: 48px;line-height: 57.6px;} #branches .section-text {margin-top: 24px;color: var(--darkgray);} #branches .button:hover {background-color: var(--white);color: var(--brandcolor);} /* news style */ #news {position: relative;padding: 112px 0;} #news .section-header {margin-bottom: 80px;} #news-wrapper {display: grid;grid-template-columns: repeat(3, 1fr);gap: 30px;} #news .news-item {position: relative;display: block;border-radius: 12px;text-decoration: none;pointer-events: unset !important; transition: all 0.3s;} #news .news-banner {position: relative;height: 300px;border-radius: 12px;transition: all 0.3s;} #homepage .news-info {background: var(--primary-color);border-radius: 12px;padding: 24px;margin-top: 12px;box-shadow: 0px 4px 28px 0px rgba(7, 36, 72, 0.06);transition: all 0.3s;} #homepage .news-item:hover .news-info {background: var(--brandcolor);} #news .news-banner {position: relative;height: 300px;border-radius: 12px;transition: all 0.3s;} #homepage .news-title {color: var(--darkgray);font-size: 24px;font-weight: 400;line-height: 33.6px;margin: 0;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;text-overflow: ellipsis;font-family: "Freeman", sans-serif;} #homepage .news-text {color: var(--darkgray);font-size: 16px;font-weight: 400;line-height: 24px;margin-top: 12px;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 4;overflow: hidden;text-overflow: ellipsis;} #homepage .news-item:hover .news-title, #homepage .news-item:hover .news-text {color: var(--white);} #news .button {margin-top: 24px;} #news .tns-controls {top: unset;bottom: -96px;display: flex;justify-content: flex-end;gap: 8px;width: fit-content;left: unset;} #news .tns-controls button {background-color: var(--brandcolor);color: var(--white);} #news .tns-controls button img {filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(7500%) hue-rotate(330deg) brightness(108%) contrast(100%);} #news .tns-controls button:hover {background-color: var(--primary-color);} #news .tns-controls button:hover img {filter: brightness(0) saturate(100%);} /* tiles-Catalog style */ #tiles-catalog {position: relative;background-color: #2D6774;padding: 112px 0;z-index: 1;} #tiles-catalog .section-heading, #tiles-catalog .section-heading span, #tiles-catalog .section-text {color: var(--white);} .catalog-bg-img {position: absolute;width: 100%;height: 100%;top: 0;left: 0;opacity: 8%;z-index: -1;} #tiles-catalog .button {background-color: var(--primary-color);color: var(--darkgray);margin-top: 24px;} #tiles-catalog .button:hover {background-color: var(--white);color: var(--brandcolor);} /* about style */ #about {background-color: #B4D9D7;padding: 112px 0;} #about-in {display: flex;justify-content: space-between;gap: 80px;} .about-left {width: 50%;} #about .section-text {margin-top: 24px;font-size: 16px;line-height: 24px;color: var(--darkgray);} #about .button {background-color: var(--primary-color);color: var(--darkgray);margin-top: 40px;} #about .button:hover {background-color: var(--white);color: var(--brandcolor);} .about-right {position: relative;width: 50%;height: 491px;} #about .about-slider, #about .tns-outer, #about .tns-inner, #about .about-slide, #about .about-img {height: 100%;} #about .tns-lazy-img {opacity: 1 !important;} #about .about-img {border-radius: 12px;} #about .tns-controls {display: flex;align-items: center;justify-content: flex-end;gap: 12px;top: unset;transform: unset;bottom: 15px;right: 16px;z-index: 1;} #about .tns-controls button:hover {background-color: var(--white);} #about .tns-controls button:hover img {filter: brightness(0) saturate(100%) invert(20%) sepia(82%) saturate(409%) hue-rotate(139deg) brightness(91%) contrast(93%);} /* tiles style */ #freeform.tiles #slider {height: 372px;} #freeform.tiles #page-title, #freeform.department #page-title {margin-bottom: 9px;} #freeform.tiles #breadcrumbs, #freeform.department #breadcrumbs {margin-bottom: 32px;} .tiles-section-title {font-size: 32px;} .tiles-gallery {display: grid;grid-template-columns: repeat(3, 1fr);gap: 24px;} .tile-item {position: relative;display: flex;align-items: flex-end;border-radius: 12px;height: 260px;overflow: hidden;} .tile-info {background-color: var(--brandcolor);padding: 10.5px 16px;border-radius: 0 0 12px 12px;width: 100%;height: 49px;text-align: center;transition: all 0.4s;} .tile-info:hover {display: flex;flex-direction: column;align-items: center;justify-content: center;background-color: rgba(255, 152, 75, 0.90);height: 100%;border-radius: 12px;} .tile-title {color: var(--white);font-size: 20px;line-height: 28px;margin-bottom: 0;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 1;overflow: hidden;text-overflow: ellipsis;} .tile-info:hover .tile-title {color: var(--darkgray);-webkit-line-clamp: 3;} .tile-text {font-size: 16px;font-weight: 400;color: var(--darkgray);line-height: 24px;margin-top: 16px;opacity: 0;} .tile-more-link {font-size: 16px;font-weight: 700;color: var(--darkgray) !important;display: inline-block;margin-top: 16px;text-underline-offset: 2px;opacity: 0;} .tile-info:hover .tile-text, .tile-info:hover .tile-more-link {opacity: 1;} /* department style */ #freeform.department #slider {height: 508px;} .department .slider-graphic {height: 14px;} #department-slider-wrap {position: absolute;left: 0;max-width: 396px;width: 100%;height: 100%;background-color: #D8D8D8;display: none;align-items: center;justify-content: center;} .department-logo img {width: 304px;} .department #quick-links {padding-top: 0;padding-bottom: 104px;} .department #quick-links-in {padding: 0;} .department #quick-links .tns-controls {display: flex;align-items: center;justify-content: flex-end;gap: 8px;top: unset;transform: unset;bottom: -72px;} .department #quick-links .tns-controls button:first-of-type {margin-left: 0;} .department #quick-links .tns-controls button:last-of-type {margin-right: 0;} .department #events {background: none;padding: 32px 0;} .department #events .section-text {color: var(--darkgray);} .department #branches {border: none;box-shadow: unset;} .department #branches .container {width: 1374px;} /* section footer */ #footer {position: relative;background-color: var(--brandcolor);padding: 80px 0;} #footer .container {width: 1342px;} #footer-top {padding-bottom: 80px;} .footer-wrap {gap: 43px;} .footer-logo {display: block;width: 329px;} .footer-logo img {filter: drop-shadow(0px 4px 6px rgba(0, 0, 0, 0.03)) drop-shadow(0px 12px 16px rgba(0, 0, 0, 0.08));} .footer-title {font-size: 20px;font-weight: 700;color: var(--white);line-height: 28px;margin-bottom: 24px;font-family: "Encode Sans Condensed", sans-serif;} .footer-office-detail .footer-title {margin-bottom: 9px;} .footer-contact-item {color: var(--white);font-size: 14px;font-weight: 700;line-height: 21px;} .footer-contact-item .footer-contact-link {color: var(--white);text-decoration: none;} .footer-contact-item .footer-contact-link:hover {color: var(--primary-color);} #footer .branch-btn {background-color: var(--primary-color);color: var(--darkgray);margin-top: 15px;} #footer .branch-btn:hover {background-color: var(--white);color: var(--brandcolor);} .footer-col ul {margin: 0;padding: 0;list-style-type: none;} .footer-col ul li {margin-bottom: 12px;} .footer-col ul li a {font-size: 14px;font-weight: 400;color: var(--white);line-height: 21px;text-decoration: none;} .footer-col ul li a:hover {color: var(--primary-color);} #footer .social-media-wrap {gap: 19px;} #footer .social-media-link {display: flex;align-items: center;gap: 12px;text-decoration: none;} #footer .social-media-link .social-text {color: var(--white);font-size: 14px;} #footer .social-media-link:hover .social-text {color: var(--primary-color);} #footer-bottom-in {border-top: 1px solid var(--white);padding-top: 32px;} #revize {font-size: 14px;font-weight: 400;line-height: 21px;color: var(--white);} #revize #revize-link {font-weight: 700;color: var(--white);text-decoration: none;} .footer-privacy-links {display: flex;justify-content: flex-end;flex-wrap: wrap;gap: 24px;row-gap: 12px;} .footer-privacy-links a {font-size: 14px;color: var(--white) !important;} .footer-privacy-links a:hover {color: var(--primary-color) !important;} /* ----------------------------------------- #media queries -----------------------------------------*/ /* @media only screen and (max-width:1400px) { .thingstoDo-wrapper {padding: 112px 24px 200px;} } */ @media only screen and (max-width:1200px) { .logo-text {width: 200px;} .site-header #nav a, .site-header #nav span {padding: 12px;} #about-in {gap: 30px;} } @media only screen and (min-width:992px) { .site-header #nav .toggle, .site-header #nav .toggle2{display:none} .site-header #nav .focused .toggle, .site-header #nav .focused .toggle2, #flyout .focused .toggle{display:inline-block !important;margin-left:-8px;padding: 0;height: auto;} #flyout .focused .toggle {position: absolute;right: 0;} #flyout .focused .toggle, .site-header #nav .focused .toggle2{-webkit-transform:rotate(-90deg);transform:rotate(-90deg)} /* base nav styles */ .site-header nav {margin-left: auto;padding-right: 16px;} .site-header #nav {display: flex;justify-content: center;height: 72px;} .site-header #nav li:hover>ul{display:block} .site-header #nav ul a:not(.fa), .site-header #nav ul span{display:block;color:#000} .site-header #nav a, .site-header #nav span {position: relative;display: inline-flex;align-items: center;justify-content: center;height: 100%;} .site-header #nav>li>a:not(.fa)::after, .site-header #nav>li>span:not(.fa)::after {position: absolute;content: '';background-color: var(--primary-color); width: 100%;height: 0;bottom: 0;transition: all 0.3s;} .site-header #nav>li:hover>a:not(.fa)::after, .site-header #nav>li:hover>span:not(.fa)::after {height: 3px;} .site-header #nav>li:hover>a:not(.fa), .site-header #nav>li:hover>span:not(.fa) {color: var(--brandcolor);} /* traditional */ #nav ul{position:absolute;left:0;top:100%;display:none} #nav ul:not(make-mage) ul{left:100%;top:0} #nav li{position:relative;display: flex;align-items: center;} #nav ul li {display: block;width: 100%;} #nav :not(make-mage) .focused .toggle2{-webkit-transform:rotate(-90deg);position:absolute;right:15px;top:50%;transform:translateY(-50%) rotate(-90deg);} /* mega menu */ #nav li.static:hover ul{display:block} #nav>li>ul.make-mage{position:absolute;left:0;right:0;top:100%;-webkit-column-count:4;-moz-column-count:4;column-count:4;display:none;padding: 32px 48px;margin: 8px 60px 0 auto;width: 744px;backdrop-filter: blur(2px);border-radius:24px;background-color: rgba(255, 255, 255, 0.85);border-bottom: 5px solid var(--primary-color);backdrop-filter: blur(10px);box-shadow: 0px 4px 24px 0px rgba(0, 0, 0, 0.08);} .site-header #nav>li>ul::before {content: "";position: absolute;top: -8px;left: 0;width: 100%;height: 19px;background: none;} #nav>li>ul.make-mage>li{display: table;page-break-inside: avoid;} #nav li:hover>ul.make-mage ul{position:static;margin: -15px 0 0;} #nav ul.make-mage a:not(.fa), #nav ul.make-mage span{font-size:16px;font-weight: 700;line-height: 22.4px;text-transform: capitalize;color: var(--darkgray);display: inline-block;margin-bottom: 32px;padding: 0;font-family: "Encode Sans Condensed", sans-serif;} #nav ul.make-mage a:not(.fa):hover, #nav ul.make-mage span:hover {color: var(--brandcolor);} #nav ul.make-mage ul a:not(.fa), #nav ul.make-mage ul span{font-size:12px;line-height: 18px;font-weight: 400;color: var(--darkgray);display: inline-block;margin: 0 0 18px;padding: 0;width: 100%;text-transform: capitalize;font-family: "Public Sans", sans-serif !important;} .sticky-header {position: fixed;top: 0;width: 100%;z-index: 1022;} .layout-table {table-layout: fixed;width: 100%} #flyout>li:hover>ul {display: block;} #flyout ul {position: absolute;left: 100%;top: -4px;width: 161px;z-index: 10;background: var(--primary-color);padding: 15px 20px;border-radius: 8px;} #flyout ul::before {position: absolute;content: '';background: url(../images/flyout-arrow.png) center/cover no-repeat;width: 14px;height: 22px;left: -14px;top: 10px;} #flyout>li {padding: 6px 18px 6px 0;} #flyout li {margin-bottom: 7px !important;} #flyout ul li {margin-bottom: 14px !important;} #flyout ul li:last-child {margin-bottom: 0 !important;} #flyout>li:hover>a, #flyout>li:hover>span {font-weight: 700;text-decoration: underline;text-underline-offset: 3px;} #flyout ul li:hover a, #flyout ul li:hover span {font-weight: 700;text-decoration: underline;text-underline-offset: 3px;} #flyout ul li a {border: none !important;} #freeform aside.col-lg-3 {flex: 0 0 22%;max-width: 22%;} #freeform .col-lg-9 {flex: 0 0 78%;max-width: 78%;} #freeform:not(.fullwidth, .tiles) #entry {padding: 48px 0 48px 80px;} #freeform:not(.tiles, .department) #slider {margin-top: 112px;} #freeform.department #slider {margin-top: 40px;} #homepage.user-logged-in #header-bottom-in {height: auto;padding-top: 30px;} #homepage.user-logged-in #branches .col-lg-2 {padding-top: 40px;} } @media only screen and (max-width:991px) { /* rz form tables - without page scope this targets editforms and makes * editing confusing */ .toggle, .toggle2{display:block;line-height:45px;width:45px;text-align:center;color:var(--white) !important;background:rgba(255, 255, 255, 0.251);position:absolute;right:0;top:0} .site-header .logo-wrap{position: relative;display:flex;align-items:center;justify-content:space-between;width: 100%;height: 100%;} .site-header nav {padding-right: 0 !important;} .site-header #nav{position: absolute;left: 0;top: 100%;width: 100%;background: var(--brandcolor);} .site-header #nav li{position:relative!important} .site-header #nav ul{display:none} .site-header #nav li a, .site-header #nav li span {font-size: 16px !important; color: var(--white);font-weight: 500;} .site-header #nav ul a, .site-header #nav ul span {font-size: 16px !important; font-weight: 500;text-transform: capitalize;} .site-header #nav ul ul a, .site-header #nav ul ul span {font-size: 14px !important;} #nav ul, #flyout ul {background: rgba(0, 0, 0, .15);} #freeform #formwizziwmorf tr, #freeform #formwizziwmorf tr td {display: block !important} #freeform #formwizziwmorf tr table tr {display: table-row !important} #freeform #formwizziwmorf tr table td {display: table-cell !important} /* Allows tables to be used as columns with responsive stacking */ .layout-table {width: 100% !important} .layout-table, .layout-table thead, .layout-table tbody, .layout-table th, .layout-table td, .layout-table tr {display: block !important} .layout-table td {margin-bottom: 15px} #info-toggle, #nav-toggle, #search-toggle {line-height: 38px;width: 38px;text-align: center;background: var(--white);display: inline-block;color: var(--brandcolor);border-radius: 4px;margin-left: 5px;cursor: pointer;} #nav, #flyout {display: none} #nav li {display: block} #nav a, #nav span, #flyout a, #flyout span {font-size: 14px !important;line-height: 1 !important;padding: 15px !important;border-bottom: 1px solid #bdbdbd;} #nav li:last-child>a, #nav li:last-child>span, #flyout li:last-child>a, #flyout li:last-child>span {border: 0} #flyout a, #flyout span {font-size: 16px !important;font-weight: 600;color: var(--white);display: block;} #flyout ul a, #flyout ul span {color: var(--white);} #flyout li {padding: 0;} #flyout ul a, #flyout ul span {font-size: 14px !important;} #freeform #freeform-wrapper {padding: 48px 0;} #freeform.fullwidth #freeform-wrapper, #freeform.tiles #freeform-wrapper {padding: 48px 0;} #freeform aside.col-lg-3 {border-radius: 0;margin-top: 32px;padding: 0 15px;} #breadcrumbs {margin-bottom: 24px;} #page-title {font-size: 28px;line-height: 42.6px;} .subheader {font-size: 22px;margin: 24px 0 32px;} #flyout-wrap {padding: 0;background-color: #2D6774;border-radius: 4px;} #flyout-header {display: none;} #flyout-toggle {background-color: #2D6774;padding: 10px 15px;border-radius: 4px;font-size: 18px;color: var(--white);text-transform: capitalize;font-weight: 700;cursor: pointer;} .box-header {font-size: 20px;} #contact-wrap, #hours-wrap, #resource-wrap {padding: 32px 0;} .sticky-header {position: relative;} #header-top {padding: 15px 0;border-bottom: 1px solid var(--white);display: none;} #header-top-in {flex-direction: column;gap: 12px;height: auto;} .header-top-left {padding-left: 0;} .header-contact-link {font-size: 14px;} .header-contact {flex-direction: column;align-items: center;gap: 12px;} .header-top-links ul {flex-direction: column;gap: 12px;margin-top: 20px;} #header-bottom {background: var(--brandcolor);height: 70px;} #header-bottom-in {position: static;} .logo-wrap {display: flex;align-items: center;justify-content: space-between;width: 100%;} .logo-text {display: none;} #search-toggle-desktop {display: none;} #search {position: relative;top: unset;max-width: 500px;width: 100%;display: block;} #search input {font-size: 14px;} #search.search-active input {width: 100%;} .header-right {flex-direction: column;gap: 16px;justify-content: center;width: 100%;position: absolute;left:0;top: 100%;background-color: var(--white)f;border-top: 1px solid var(--brandcolor);padding: 15px;display: none;} .tns-controls button {width: 32px;height: 32px;} .tns-controls button img {width: 20px;} #slider {height: 450px;} #homepage #slider::before {background: radial-gradient(50% 32% at 27% 55.89%, #000 0%, rgba(0, 0, 0, 0.00) 100%);} #homepage #slider .tns-controls {top: 94%;} #department-slider-wrap {height: auto;bottom: 0;max-width: 100%;padding: 24px;} .department-logo img {width: 200px;} .slider-graphic {display: none;} .section-header {margin: 0 auto 48px;text-align: center;} .section-heading {font-size: 48px;line-height: 60px;text-align: center;} .section-heading span {font-size: 24px;margin-bottom: 12px;} .section-text {font-size: 16px;} #quick-links {padding-top: 48px;} #quick-links-in {padding: 0 40px;} .tiny-first .quick-link {border-radius: 0;} .tiny-first .quick-link::before {border-radius: 0;} .tiny-last .quick-link {border-radius: 0;} .tiny-last .quick-link::before {border-radius: 0;} .qlink-title {font-size: 18px;} .qlink-icon-box img {width: 42px} #quick-links .tns-controls button:first-of-type {margin-left: -40px;} #quick-links .tns-controls button:last-of-type {margin-right: -40px;} #events {padding-bottom: 80px;} #event-tabs-box {z-index: 2;} #event-tabs-box-wrap {width: 100%;} #branches {padding: 48px 0;} #branches .section-text {text-align: center;} #branches .divider img {transform: rotate(90deg);margin: 60px 0;width: 230px;} #news {padding: 64px 0;} #news .section-header {margin-bottom: 48px;} #news .tns-controls {bottom: -81px;} #tiles-catalog {padding: 64px 0;} #about-in {flex-direction: column;} .about-left {width: 100%;text-align: center;} .about-right {width: 100%;height: 400px;} .tiles-gallery {grid-template-columns: repeat(2, 1fr);} #footer {padding: 0;} #footer-top {padding: 64px 0;} .footer-logo {width: 200px;} .footer-wrap {gap: 32px;} .footer-col {text-align: center;} .footer-privacy-links {justify-content: center;margin-top: 24px;} #footer-bottom-in {padding: 24px 0;} } /* All Mobile Sizes (devices and browser) */ @media only screen and (max-width:767px) { .floating-alert {width: auto;right: 10px;left: 10px;bottom: 0;top: unset;font-size: 12px;} .floating-alert h4 {margin-bottom: 10px;font-size: 14px} .floating-alert .btn {font-size: 10px} .share-btns a {padding: 10px;font-size: 12px;white-space: nowrap;overflow: hidden} .share-btns i {display: block;line-height: 50px !important;font-size: 20px} #breadcrumbs ul li {margin-right: 26px;} #breadcrumbs ul li:not(:last-of-type)::after {margin: 0 14px} #typed-wrap {font-size: 34px;line-height: 40px;} .slider-text {font-size: 16px;line-height: 24px;} .slider-btns {margin-top: 24px;} .slider-btns .button {padding: 8.2px 20px;} .section-heading {font-size: 48px;line-height: 50px;} .section-heading span {font-size: 18px;margin-bottom: 6px;} #event-tabs-box, #event-filter {width: 100%;} #event-tabs {width: 100%;text-align: center;} #branches .section-heading {font-size: 34px;line-height: 40px;} #homepage .news-info {padding: 24px 15px;} #homepage .news-title {font-size: 20px;line-height: 29.6px;} .tiles-gallery {grid-template-columns: auto;} } /* Mobile Landscape Size to Tablet Portrait (devices and browsers) */ @media only screen and (min-width:480px) and (max-width:767px) {} /* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */ @media only screen and (max-width:479px) { #typed-wrap {font-size: 24px;line-height: 30px;} .slider-text {line-height: 22px;} #post blockquote {font-size: 18px;line-height: 32px;padding: 32px 15px;} #post blockquote img {width: 40px;} .section-heading {font-size: 34px;line-height: 48px;} #branches .section-heading {font-size: 32px;} #about .section-heading {font-size: 30px;line-height: 40px;} } @media print { #slider, footer, #breadcrumbs, #flyout-wrap, .floating-share-btn, .e-notify, .site-header { display: none !important } a[href]:after { content: none !important } }