:root { --main: #585395; --second: #849938; --accent: #316e8d; --pale: #e5e5e5; --font: #333; --grey: #707070; --dpurple: #3a375a; --Ptop: 50px 20px 0 20px; --Pboth: 50px 20px; --Pinside: 60px 20px; --Mtop: 50px; --proxima: "proxima-nova",sans-serif; /*Space between content sections 50px Small Space between content sections 60px Medium Space between content sections 60px Large Space between content sections 80px XL Space between content sections 100px XXL Space between content sections 130px max-width: 1640px; home V space XS - 60 SM - 60 - 70 inconsistent lg - 80 XL - 100 XXL - varies */ @media only screen and (min-width: 576px) { --Ptop: 60px 33px 0 33px; --Pboth: 60px 33px; --Mtop: 60px; --Pinside: 60px 33px; } @media only screen and (min-width: 992px) { --Ptop: 80px 33px 0 33px; --Pboth: 80px 33px; --Mtop: 80px; --Pinside: 80px 33px; } @media only screen and (min-width: 1200px) { --Ptop: 100px 85px 0 85px; --Pboth: 100px 85px; --Mtop: 100px; --Pinside: 100px 85px; } @media only screen and (min-width: 1400px) { --Ptop: 130px 85px 0 85px; --Pboth: 130px 85px; --Mtop: 130px; --Pinside: 100px 85px; } } /* Purple – #585395 - main Dark Purple – #3a375a Green – #849938 - second Blueish - #316e8d - accent Grey – #707070 Light Grey - #e5e5e5 - pale Black - #333333 - font */ /** UNIVERSAL *************************************/ body {text-align: center; background-color: WHITE; -webkit-text-size-adjust: 100%; padding: 0; margin: 0;} .contentwrapper{width: 100%; position: relative; overflow: hidden; font-family: "open-sans", sans-serif; font-weight: 400; font-size: 16px; color: var(--font);} article p{margin: 1rem 0 0 0;} article{line-height: 1.67;} .liner, article {width: 100%; margin: 0 auto; position: relative; max-width: 1640px;} .container-fluid{width: 100%; margin: 0 auto; padding: 0; max-width: 1640px;} section { width: 100%; padding: var(--Pboth); margin: 0;} a, button.modal_link{ transition: all .25s; color: var(--main);text-decoration: none;} a:hover, a:focus, button.modal_link:focus, button.modal_link:hover {color: var(--main); text-decoration: underline;} button.modal_link{ padding:0; border: 0; background: transparent; cursor: pointer; transition: all .25s;} button.modal_link:focus, button.modal_link:hover{text-decoration: underline;border: 0; outline: 0} button.modal_link{text-align: left;} input, select, textarea, button{} button{border: 0; background: transparent;transition: all .25s;text-align: center; padding: 0} .CHbox a, .CHA, .cardbennies{} /* match to regular font size */ strong{font-weight: 700} blockquote{padding: 1rem 0 0 0;} .video_wrapper {margin-top: 20px !important;} /*.row {margin: 0;} /*FA bullets*/ article ul:not(.content_sitemap) {list-style: none;padding: 1.25rem 0 0px 30px;} article ul:not(.content_sitemap) li {position: relative; line-height: 1.67;margin: 0; padding: 0 0 1.25rem 0;} article ul:not(.content_sitemap) li:before {content: '\f058'; font-family: 'Font Awesome 6 Pro'; font-weight: 900; font-size: 24px; color: var(--second); position: absolute; top: -6px; left: -30px; } article ol {padding: 1.25rem 0 0px 20px;} article ol li {position: relative; line-height: 1.67;margin: 0; padding: 0 0 1.25rem 0;} /*S*/ @media only screen and (min-width: 576px) { } /*M*/ @media only screen and (min-width: 768px) { .contentwrapper{ font-size: 18px;} article ul li {font-size: 18px;} article ul:not(.content_sitemap) li:before { top: -4px; } } /*L*/ @media only screen and (min-width: 992px) { /* for fading in */ .fadein {position: relative; transform: translateY(100px);opacity: 0;} .fadein.onstage {opacity: 1;transform: translateY(0);} .onstage.fadeB {animation: fade-bottom .5s ease-in;} .onstage.fadeL {animation: fade-left .5s ease-in;} .onstage.fadeR {animation: fade-right .5s ease-in;} @keyframes fadeB {0% {transform: translateY(100px);opacity: 0;} 100% {transform: translateY(0); opacity: 1;}} @keyframes fadeL {0% {transform: translateX(-400px);opacity: 0;} 100% {transform: translateX(0);opacity: 1;}} @keyframes fadeR {0% {transform: translateX(400px);opacity: 0;} 100% {transform: translateX(0);opacity: 1;}} } /*XL*/ @media only screen and (min-width: 1200px) { } /*XXL*/ @media only screen and (min-width: 1400px) { } /** HEADER ***********************************************/ header {width: 100%; z-index: 100; padding: 0 20px; position: relative; background-color: white;box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);} header .liner{height: 90px;} a.homelink{position: absolute; height: 100%;top: 0; left: 0} a.homelink img { width: 108px;} .toplinks {display: none; } #sitesearch, .sitesearch {display: none;} /*S*/ @media only screen and (min-width: 576px) { header { padding: 0 33px;} header .liner{height: 120px;} a.homelink img { width: 153px;} } /*M*/ @media only screen and (min-width: 768px) { } /*L*/ @media only screen and (min-width: 992px) { header .liner{height: 180px;} a.homelink img { width: 200px;} .toplinks {display: flex; justify-content: flex-end; align-items: center; position: absolute; top: 20px; right: 0; gap: 30px;} .toplinks a, .toplinks .notalink { font-family: var(--proxima); font-size: 16px; font-weight: 600; color: var(--dpurple); position: relative; padding-bottom: 5px; text-transform: uppercase;} .toplinks a:hover, .toplinks a:focus {text-decoration: none; color: var(--second);} .toplinks a:after{content: ''; width: 0; height: 2px; background-color: var(--second); position: absolute; bottom: 0; right: 50%; transition: all .25s} .toplinks a:hover:after, .toplinks a:focus:after{ width: 100%; right: 0;} .TL{display: none;} #sitesearch {display: block;font-family: var(--proxima); font-size: 16px; font-weight: 600; color: var(--dpurple);position: relative; padding-bottom: 5px; } #sitesearch:hover, #sitesearch:focus, #sitesearch.down {text-decoration: none; color: var(--second);} #sitesearch:before{content: '\f002'; font-family: 'Font Awesome 6 Pro'; font-weight: 400; margin-right: 5px;} #sitesearch:after{content: ''; width: 0; height: 2px; background-color: var(--second); position: absolute; bottom: 0; right: 50%; transition: all .25s} #sitesearch:hover:after, #sitesearch:focus:after{ width: 100%; right: 0;} #sitesearch.down:after, #sitesearch.down:focus:after{ width: 0; right: 50%;} .sitesearch {display: none; position: absolute; top: 200px; right: 0; height: 82px;width: 100%; border-radius: 41px; box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.25); background-color: white; z-index: 99} .searchbox {position: absolute; top: 25px; left: 64px; padding-left: 10px; height: 30px; width: calc(100% - 128px); border: 0; border-bottom: solid 1px var(--grey); background-color: white; outline: 0; font-size: 15px; } .searchbox::placeholder {color: var(--grey); opacity: 1;} .searchbox:-ms-input-placeholder {color: var(--grey);} .searchbox::-ms-input-placeholder { color: var(--grey);} button.SSbttn{color: var(--main); position: absolute; top: 0; right: 65px; width: 44px; height: 100%; } button.SSbttn:hover, button.SSbttn:focus {color: var(--second);} button.SSbttn:before{content: '\f002'; font-family: 'Font Awesome 6 Pro'; font-weight: 400;} button#searchex { color: var(--second); width: 65px; height: 100%; position: absolute; top: 0; right: 0;} button#searchex:hover, button.searchex:focus {color: var(--dpurple);} } /*XL*/ @media only screen and (min-width: 1200px) { header{padding: 0 85px; } .TL{display: block;display: flex; justify-content: flex-end; align-items: center;gap: 20px; border-right: solid 1px var(--grey); padding-right: 30px; } .TL a, .TL .notalink{ font-size: 15px; font-weight: 600; color: var(--font); text-transform: initial;} .TL a:hover, .TL a:focus{text-decoration: underline; color: var(--font);} .toplinks .TL a:after{display: none;} } /*XXL*/ @media only screen and (min-width: 1400px) { } /** MOBI MENU ***************************************/ nav.pc, .ddcontent {display: none;} button.menutoggler{display: block; height: 100%; width: 44px; color: var(--main); position: absolute; top: 0px; right: 0; font-size: 30px; } button.menutoggler:hover, button.menutoggler:focus {transition: all .25s;} button.menutoggler:before{content: "\f7a4"; font-family: 'Font Awesome 6 Pro'; font-weight: 900;} button.menutoggler[aria-expanded="true"]:before{content: "\f00d"; } nav.mobile{display: block; background-color: white; height: 100%; position: fixed; z-index: 1000; top: 0; overflow-y: auto; width: 320px; right: -320px; text-align: left; transition: all .25s;-webkit-box-shadow: -2px 2px 5px 0 rgba(0,0,0,.3); } nav.mobile.out{right: 0; box-shadow: -2px 2px 5px 0 rgba(0,0,0,.3);} nav.mobile button.menutoggler2{text-decoration: none; height: 44px; width: 44px; font-size: 20px; color: white;text-align: center; } .Mbttns{padding: 26px 0 0 0 !important; } .Mbttns a{margin: 10px 0; } .sitesearchM { position: relative; height: 44px; width: calc(100% - 40px); left: 20px; border-bottom: solid 1px var(--grey); margin-bottom: 20px;} .searchboxM {position: absolute; top: 0; left: 0; height: 44px; width: calc(100% - 44px); border: 0; background-color: transparent; outline: 0; font-size: 16px; font-weight: 600;} .searchboxM::placeholder {text-transform: uppercase;} .searchboxM:-ms-input-placeholder {text-transform: uppercase;} .searchboxM::-ms-input-placeholder {text-transform: uppercase;} button.SSbttnM{color: var(--main); position: absolute; top: 0; right: 0; width: 44px; height: 44px; font-size: 18px; } button.SSbttnM:hover, button.SSbttnM:focus {color: var(--second);} button.SSbttnM:before{content: '\f002'; font-family: 'Font Awesome 6 Pro'; font-weight: 400;} .MMlinks1{background-color: var(--grey); height: 50px; display: flex; justify-content: space-between; align-items: center; padding-left: 5px;} .MMlinks1 a, .MMlinks1 .notalink{color: white;font-size: 15px;line-height: 1.87;} .MMlinks1 a:hover, .MMlinks1 a:focus{color: white; } .MMlinks2{ padding: 0 20px;} .MMlinks2 a, .MMlinks3 a{font-family: var(--proxima); color: var(--pale); background: var(--main); font-size: 15px; font-weight: 600; padding: 10px; border-radius: 28px; text-transform: uppercase; width: 100%; display: block; margin-bottom: 15px; text-align: center;} .MMlinks2 a:hover, .MMlinks2 a:focus{text-decoration: none; background-color: var(--second)} .MMlinks3{padding: 0 20px;} .MMlinks3 a{background-color: var(--second);} .MMlinks3 a:hover, .MMlinks3 a:focus{text-decoration: none; background-color: var(--main)} .Mbttns{padding: 26px 0; } .Mbttns a{margin: 10px 0; } .L1{padding: 0 20px 35px 20px;} .L1 a, .L1 button {color: var(--grey);text-decoration: none; position: relative; width: 100%; text-align: left; display: block; transition: all .25s; padding: 25px 0 5px 0; border-bottom: solid 2px var(--grey);text-transform: uppercase;} .L1 button.flipped{color: var(--second); border-bottom: solid 2px var(--second);} .L1 button:after {content: '\2b'; font-family: 'Font Awesome 6 Pro'; font-weight: 900; position: absolute; top: 25px; right: 0px; transition: all .25s; font-size: 18px;} .L1 button.flipped:after {content: '\f068';} .L2 {display: none;padding: 10px 0 0 10px;} .L2 a, .L2 button{ padding: 10px 0 0 0; border-bottom: 0;text-transform: initial;} .L2 a:hover, .L2 a:focus, .L2 button:hover, .L2 button:focus{text-decoration: underline;} .L2 button:after {top: 5px; } .L2 button.flipped{color: var(--second); border-bottom: 0;} .L3 {display: none;padding: 10px 0 0 10px;} .L3 a{} /*https://css-tricks.com/the-current-state-of-styling-scrollbars/*/ nav.mobile::-webkit-scrollbar {width: 10px;} nav.mobile::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 3px rgba(0,0,0,.7); background-color: var(--main); } nav.mobile::-webkit-scrollbar-thumb { -webkit-box-shadow: inset 0 0 3px rgba(0,73,135,.7); border-radius: 5px; background-color: var(--second); } /*S*/ @media only screen and (min-width: 576px) { nav.mobile{ width: 360px; right: -360px; } .MMlinks1{ padding-left: 10px;} } /*M*/ @media only screen and (min-width: 768px) { .MMlinks1{ padding-left: 20px;} } /*L*/ @media only screen and (min-width: 992px) { button.menutoggler{ height: 50px; top: 90px; } } /*XL*/ @media only screen and (min-width: 1200px) { } /*XXL*/ @media only screen and (min-width: 1560px) { /** MENU *********************************************/ button.menutoggler, nav.mobile{display: none;} nav.pc {/*border: solid 1px blue; */display: block; z-index: 100; position: absolute; top: 100px; right: 150px; max-width: 1060px; width: calc(100% - 230px - 190px);} .navliner {width: 100%; z-index: 100; display: flex; justify-content: space-between; align-items: center; align-content: center; gap: 20px;/*border: solid 1px fuchsia*/} button.CMitem, a.CMitem{text-decoration: none; line-height: 1.15; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; padding: 5px 0; font-family: var(--proxima); font-size: 17px; font-weight: 600; color: var(--grey); position: relative; text-transform: uppercase;} button.CMitem:hover, button.CMitem:focus, a.CMitem:hover, a.CMitem:focus {text-decoration: none;color: var(--second);} button.CMitem:after, a.CMitem:after{content: ''; width: 0; height: 2px; background-color: var(--second); position: absolute; bottom: 0px; right: 50%; transition: all .25s} button.CMitem:hover:after, button.CMitem:focus:after, a.CMitem:hover:after, a.CMitem:focus:after{ width: 100%; right: 0;} .ddcontent{ display: none;background-color: white; position: absolute; top: 180px; right: 150px; max-width: 1060px; width: calc(100% - 230px - 190px); padding: 40px 40px 26px 40px; box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2); text-align: left; z-index: 100} .ddcontent .container-fluid{ max-width: 1430px; width: 100%; margin: 0 auto;} .ddcontent p {} .ddcontent a {display: block; } .ddcontent a:hover, .ddcontent a:focus { text-decoration: none;} .Mbttns{padding: 26px 0 0 0 ; border-top: solid 2px var(--main); display: flex; justify-content: space-between; gap: 10px;} /* for auto dds with 3rd levels .CMsub{display:none;padding-left: 20px;} button.CMlink{position: relative; width: 100%; text-align: left} button.CMlink:after {content: '\f078'; font-family: 'Font Awesome 6 Pro'; font-weight: 400; position: absolute; top: 0px; right: 0px; transition: all .25s; } button.CMlink.opened:after { transform: rotate(180deg);} */ } /** HOME *************************************************/ /*S*/ @media only screen and (min-width: 576px) { } /*M*/ @media only screen and (min-width: 768px) { } /*L*/ @media only screen and (min-width: 992px) { } /*XL*/ @media only screen and (min-width: 1200px) { } /*XXL*/ @media only screen and (min-width: 1400px) { } /** HOME FINANCIAL GOALS *****************************************/ /* borders section.goals{border: solid 1px cyan} section.goals .liner{border: dashed 1px black} .Gbox{border: solid 1px lime;} .Gimg{border: solid 1px red;} .Gpic{border: solid 1px blue;} .Gblurb{border: solid 1px fuchsia;} .Gblurb_guts{border: solid 1px green;} .Gblurb_guts div{border: solid 1px orange;} .Gblurb_guts div div{border: dashed 1px blue;} .Glinks{border: daSHED 1px orange;} button.Glink{border: solid 1px lime;} */ section.goals{max-width: 575px; margin: 0 auto;} section.goals h3{ font-size: 22px;} section.goals .liner{max-width: 100%} .Glinks{display: flex; justify-content: space-between; align-items: center;flex-wrap: wrap; width: 100%; padding: 0;} button.Glink{ flex: 1 1 30%;font-size: 15px; font-weight: 900;line-height: 1.33; color: var(--grey); text-transform: uppercase; position: relative; padding: 35px 10px 5px 10px; margin: 15px 0 0 0; font-family: var(--proxima);font-weight: 600; } button.Glink:hover, button.Glink:focus, button.Glink.greener{ text-decoration: none; color: var(--second);} button.Glink.allumee, button.Glink.allumee:focus{color: var(--second);} button.Glink:after{content: ''; display: block; width: 0; height: 2px; background-color: var(--second); margin-top: 10px; transition: all .25s; position: absolute; bottom: 0; right: 50%; } button.Glink.allumee:after, button.Glink:hover:after, button.Glink:focus:after{width: calc(100% - 20px);right: 10px; } button.Glink:before{content: '\f058'; font-family: 'Font Awesome 6 Pro'; font-weight:900; font-size: 0; color: var(--second); position: absolute; top: 12px; right: 50%; transition: all .25s; } button.Glink.allumee:before, button.Glink:hover:before, button.Glink:focus:before{font-size: 24px;right: calc(50% - 12px); top: 0} .Gbox{display: none;} .Gimg{margin-top: 2rem} .Gimg img{max-width: 100%;} .Gblurb{line-height: 1.63; width: 100%; position: relative; z-index: 99; background-color: white;} .Gblurb p{margin: 1.5rem 0 0 0} .Gblurb_guts h2{padding: 2rem 0 1rem 0} .Gblurb a.cta{margin: 5px;} .Gslideball{display: none;} /*S*/ @media only screen and (min-width: 576px) { section.goals h3{font-size: 28px;} .Gimg img{} button.Glink{padding: 50px 25px 5px 25px; margin: 40px 0 0 0;} button.Glink.allumee:after, button.Glink:hover:after, button.Glink:focus:after{width: calc(100% - 50px);right: 25px; } button.Glink:before{ top: 15px; } button.Glink.allumee:before, button.Glink:hover:before, button.Glink:focus:before{font-size: 30px;right: calc(50% - 15px);} } /*M*/ @media only screen and (min-width: 768px) { section.goals h3{font-size: 32px;} button.Glink{font-size: 17px; } .Gblurb a.cta{margin: 5px 10px;} } /*L*/ @media only screen and (min-width: 1200px) { /*@media only screen and (min-width: 992px) {*/ section.goals h3{font-size: 34px; } section.goals{max-width: 100%; padding: var(--Mtop) 0} section.goals .liner{padding-top: 1rem;} .Glinks{height: 136px; flex-wrap: nowrap; margin-bottom: 47px;position: relative; padding: 0 33px; width: 100%; min-width: 100%; align-items: flex-end;} button.Glink{ flex: 1 1 15%; height: 82px; position: relative; padding: 30px 17px 5px 17px; max-width: 100%; margin: 0; font-size: 17px;} .Glinks button.Glink:nth-child(4){padding: 30px 0px 5px 0px;} button.Glink:before{content: ''; width: 1px; height: 25px; background-color: var(--main); position: absolute; top: 0; right: 50%;} button.Glink.allumee:before, button.Glink:hover:before, button.Glink:focus:before{ top: 0; right: 50%;} button.Glink.allumee:after, button.Glink:hover:after, button.Glink:focus:after{width: calc(100% - 34px);right: 17px; } .Gbar{width: calc(100% - 66px); height: 4px; background-color: var(--main); position: absolute; top: 50px; right: 33px; } .Gslideball{ width: 140px; height: 30px; display: flex; justify-content: center; align-items: flex-end;cursor: grab; position: absolute; top: 0px; left: 0; z-index: 99; } .Gslideball div{width: 30px; height: 30px; border-radius: 50%; color: var(--second); font-size: 30px; } .Gblurb h3{padding-top: 0} .Gbox{height: 410px;width: 100%; overflow: hidden;position: relative; } .Gblurb{width: 60%; height: 410px; position: absolute; top: 0; right: 0;display: flex; align-items: center; text-align: left; padding: 0 33px;} .Gimg {width: 40%; height: 410px; background-color: yellow;position: absolute; top: -35px; left: 0;} .Gimg img{object-fit: cover; object-position: right;width: 100%;height: 410px !important;} .Gblurb a.cta{margin: 0 34px 10px 0;} /*} @media only screen and (min-width: 1200px) {*/ section.goals h3{font-size: 38px;padding: 0;} .Glinks{ padding: 0 85px;} .Gblurb{ padding: 0 65px 0 85px;} .Gbox, .Gblurb, .Gimg ,.Gimg img{height: 600px !important;} .Gbar{width: calc(100% - 170px);right: 85px; } .Glinks button.Glink:nth-child(4){ padding: 30px 10px 5px 10px;} section.goals{max-width: 100%; padding: 100px 0 var(--Mtop) 0} } @media only screen and (min-width: 1400px) { section.goals h3{font-size: 44px;} } @media only screen and (min-width: 1700px) { .Glinks{height: 110px;} button.Glink{ height: 56px; } } @media only screen and (min-width: 1800px) { .Glinks{ padding: 0 calc(50% - 820px);} .Gblurb{ padding: 0 100px 0 calc(50% - 820px);} .Gbar{width: 1640px;right: calc(50% - 820px); } } /** HOME RATES SCROLLER + SLICK ***********************************************/ /** SLICK SLIDESHOW ***/ .slick-slider { user-select: none; -webkit-touch-callout: none; touch-action: pan-y; -webkit-tap-highlight-color: transparent;} .slick-list {position: relative; display: block; overflow: hidden; margin: 0; padding: 0;} .slick-list:focus{outline: none;} .slick-list.dragging {cursor: pointer; cursor: hand;} .slick-slider .slick-track, .slick-slider .slick-list {-webkit-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0);} .slick-track{position: relative; top: 0; left: 0; display: block; margin: 0 auto; } .slick-track:before {display: table;content: '';} .slick-track:after{display: table;content: '';clear: both;} .slick-loading .slick-track {visibility: hidden;} .slick-slide.slick-loading img{display: none;} .slick-slide.dragging img{pointer-events: none;} .slick-initialized .slick-slide{display: block;} .slick-loading .slick-slide{visibility: hidden;} .slick-loading .slick-list{background: #fff url(/templates/COMMON_JS/images/ajax-loader.gif) center center no-repeat;} .slick-vertical .slick-slide{display: block; height: auto; border: 1px solid transparent;} .slick-arrow.slick-hidden {display: none;} /* borders .rates-carousel{border: solid 1px fuchsia;} .slick-slider{ border: solid 1px green; } .slick-slide{ border: solid 1px orange;} .slick-prev, .slick-next{border: solid 1px lime;} */ section.rc-container{background-color: var(--accent); color: white; padding: var(--Mtop) 0; position: relative; z-index: 99} section.rc-container h2{padding: 0 0 1.5rem 0; color: white;} .Rlinks{padding-top: 2rem;width: 180px; margin: 0 auto;} .Rlinks a.cta{width: 100%; padding: 12px} .Rlinks a.cta:first-child{margin-bottom: 10px;} .rates-carousel{width: 100%; position: relative; margin: 0 auto; } .slick-slider{ padding: 0; margin: 0 auto; width: calc(100% - 80px) !important; } .slick-track{position:relative;top:0;left:0;display:block;margin-left:auto;margin-right:auto; display: flex;align-items: center;} .slick-slide{display:none;min-height:1px; display: flex; justify-content: center; align-items: center; padding: 0 20px} .Rtext{font-size: 16px; font-weight: 400; line-height: 1.33; color: white; text-transform: uppercase} .Rapr{font-size: 14px; color: white; padding: 10px 0 16px 0; line-height: 1} .Rnumber{ font-family: var(--proxima); font-size: 50px; font-weight: 700; color: white; line-height: 1} a.Rlink{text-decoration: none; border: solid 2px transparent; border-radius: 20px; display: block; padding: 40px 20px;} a.Rlink:hover, a.Rlinka:focus{text-decoration: none; border: solid 2px white; } /* arrows nav */ .slick-arrow.slick-hidden{display:none} .slick-prev, .slick-next{ z-index: 99; color: white; font-size: 34px; position: absolute; top: 0; display: block; width: 40px; height: 100%; cursor: pointer; text-align: center; background: transparent; opacity: 1; -webkit-transition: all .25; transition: all .25s; z-index: 90} .slick-prev{left: 5px;} .slick-next{left: auto;right: 5px;} .slick-prev:hover, .slick-prev:focus, .slick-next:hover, .slick-next:focus{opacity: 1; color: white; outline:none;left: 0px;} .slick-next:hover, .slick-next:focus{left: auto; right: 0px;} /*S*/ @media only screen and (min-width: 576px) { .rates-carousel{width: 398px;} section.rc-container{padding: var(--Pinside);} .Rlinks{width: 100%;} .Rlinks a.cta{width: 180px; margin: 0 10px} .Rlinks a.cta:first-child{margin-bottom: 0;} .slick-slide {padding: 0 10px} a.Rlink{ padding: 40px 20px;} .Rtext{font-size: 20px; } .Rnumber{font-size: 60px;} } /*M*/ @media only screen and (min-width: 768px) { section.rc-container{ } } /*L*/ @media only screen and (min-width: 992px) { .rates-carousel{ width: 100%; max-width: 1034px; } .Rlinks a.cta{ padding: 19px; width: 210px;} .slick-slide {padding: 0 20px} } /*XL*/ @media only screen and (min-width: 1200px) { } /*XXL*/ @media only screen and (min-width: 1610px) { section.rc-container .liner{max-width: 1640px; display: flex;align-items: center;justify-content: space-between} .rates-carousel{width: calc(100% - 330px - 210px);} section.rc-container h2{width: 355px; text-align: left;} .Rlinks{padding-top: 0;width: 210px; margin: 0 ;} .Rlinks a.cta{width: 100%; padding: 19px} .Rlinks a.cta:first-child{margin-bottom: 10px;} .slick-slide {padding: 0 16px} } /** HOME - NEWS Boxes ****************************************/ section.news{padding: var(--Pinside); margin-top: var(--Mtop); background-color: var(--pale);} .Nboxes{max-width: 480px; margin: 0 auto;} .Nbox { width: 100%; padding: 18px 13px 40px 13px; border-radius: 20px; background-color: white; margin-bottom: 30px; position: relative; transition: top .25s; } .Nboxes .Nbox:last-child{margin-bottom: 0} .Nbox h3{padding-top: 2rem;} .Nbox p{padding-top: 1rem;} .Nimg img{border-radius: 20px} /*S*/ @media only screen and (min-width: 576px) { .Nbox {padding: 45px;margin-bottom: 40px;} } /*M*/ @media only screen and (min-width: 768px) { } /*L*/ @media only screen and (min-width: 992px) { .Nboxes{max-width: 100%; display: flex; justify-content: center; gap: 62px 30px ; flex-wrap: wrap;} /*.Nbox {width: 450px;padding: 45px 30px;margin-bottom: 0; position: relative; top: 0; transition: opacity 1s, margin 1s, top .25s;transition-timing-function: ease-out ease-out;}*/ .Nbox {width: 450px;padding: 45px 30px;margin-bottom: 0; position: relative; top: 0;} .Nbox:hover { top: -10px; } } /*XL*/ @media only screen and (min-width: 1200px) { .Nboxes {justify-content: space-between; } .Nbox {max-width: 480px; width: auto; flex: 1 1 30%;} .across4 .Nboxes, .across2 .Nboxes {justify-content: center; } .across4 .Nbox {flex: 1 1 40%;} } /*XXL*/ @media only screen and (min-width: 1400px) { .across4 .Nboxes{ flex-wrap: nowrap;} .across4 .Nbox {flex: 1 1 30%;} } /** HOME - COMMUNITY ****************************************/ section.community{ padding: 60px 20px; margin-top: var(--Mtop); background: url(../images/1D_watermark.png) no-repeat left top; background-size: 96% auto; min-height: 335px; position: relative; z-index: 99/* width="653" height="643"*/ } .Ctext{line-height: 1.63;} .Ctext p{margin: 0; padding: 2rem 0 0 0} .Cimgs{position: relative; padding: 0; max-width: 484px;margin: 0 auto;} .cimg1{ width: 33%; max-width: 248px; height: 100%; position: absolute; top: 0; left: 0; display: flex; align-items: center;} .cimg1 img{border-radius: 20px; width: 100%; box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2); } .Cimg2{} .Cimg2 img{border-radius: 20px; width: 76%; max-width: 665px;} /*S*/ @media only screen and (min-width: 576px) { section.community{ padding: 80px 33px; background-size: 580px auto;} } /*M*/ @media only screen and (min-width: 768px) { } /*L*/ @media only screen and (min-width: 992px) { } /*XL*/ @media only screen and (min-width: 1200px) { .Cimgs{width: 646px; height: auto; margin: 0; max-width: 100%; padding-bottom: 6%} .cimg1{ height: auto; top: auto; bottom:0; width: 248px} .Cimg2 img{width: 88%; max-width: 556px;} /*556x418*/ .Ctext {padding-right: 65px} .Ctext h2{padding-top: 0} } /*XXL*/ @media only screen and (min-width: 1400px) { section.community{ background-size: 652px auto; margin-top: 0} } /** INSIDE **********************************************/ section.inside.first{padding: 20px 20px 0 20px} section.inside{padding: 0 20px} article.container-fluid { margin: 0 auto; text-align: left; } .heroM{} .heroM img{max-width: 100%;} .hero, .heroholder{display: none} section.grey{background-color: var(--pale); margin-top: var(--Mtop); padding: var(--Pinside); position: relative; z-index: 99} section.grey h2{padding: 0 0 2rem 0;} section.purple{background-color: var(--main); color: white; margin-top: var(--Mtop); padding: var(--Pinside);position: relative; z-index: 99} section.purple h2{color: white;} section.purple .liner{max-width: 1440px;} section.purple p{padding: 1rem 0 0 0} .promoimg{} .promoimg img{border-radius: 20px;} .promotext{} /*S*/ @media only screen and (min-width: 576px) { section.inside.first{padding: 30px 33px 0 33px} section.inside{padding: 0 33px} } /*M*/ @media only screen and (min-width: 768px) { section.inside.first{padding: 40px 33px 0 33px} } /*L*/ @media only screen and (min-width: 992px) { section.inside.first{padding: 50px 85px 0 85px} section.inside{padding: 0 85px} } /*XL*/ @media only screen and (min-width: 1200px) { section.inside.first{padding: 120px 85px 0 120px} .heroM{display: none} .heroM img{max-width: 100%;} .hero{display: block; height: 548px; width: 50%; position: absolute; top: 180px; right: 0; max-width: 975px; } .hero img{height: 100%} .heroholder{display: block; width: calc(50% + 20px); height: 470px; position: relative; float: right} section.purple h2{padding: 0} section.purple .liner{display: flex;} .promoimg{width: 50%;max-width: 841px; padding: 20px 54px 20px 0; } .promotext{width: 50%; padding-left: 54px; display: flex; align-items: center;} } /*XXL*/ @media only screen and (min-width: 1400px) { .heroholder{ width: calc(50% + 80px); } .promoimg{width: calc(100% - 665px); padding: 20px 109px 20px 0; } .promotext{ width: 50%; padding-left: 0; } } /** INSIDE - PRODUCT BOXES **********************************************/ section.Pboxes{background-color: var(--pale); margin-top: var(--Mtop);padding: var(--Pinside);} section.Pboxes article.container-fluid{max-width: 610px;} .Pbox{border-radius: 20px; box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2); background-color: white; overflow: hidden; transition: all .25s; height: 100%} .Phead{background-color: var(--main); color: white; padding: 20px 34px;height: 120px; display: flex; justify-content: center; align-items: center; } .Phead h3{color: white; padding: 1rem 0 0 0 } .Phead .d1{color: white; transition: all .25s} .Ptext{padding: 26px 40px 50px 40px; } .Ptext ul{text-align: left; padding: 1.25rem 0 0px 30px;} /*S*/ @media only screen and (min-width: 576px) { } /*M*/ @media only screen and (min-width: 768px) { } /*L*/ @media only screen and (min-width: 992px) { .Pbox:hover { top: -10px; } .Phead{ padding: 33px 50px;height: 147px; } } /*XL*/ @media only screen and (min-width: 1200px) { section.Pboxes article.container-fluid{max-width: 100%;} } /*XXL*/ @media only screen and (min-width: 1400px) { } /** INSIDE - ICONS *******************************/ section.icons{background-color: var(--accent); color: white; margin-top: var(--Mtop);padding: var(--Pinside);} section.icons h2{color: white; padding: 0 0 40px 0;} section.icons .liner{ max-width: 1000px;} section.icons ul{gap: 30px; flex-wrap: wrap;width: 100%;display: flex; justify-content: center; align-items: center; list-style: none; margin: 0; padding: 0} section.icons li{margin: 0; padding: 0} section.icons a{display: block; width: 140px; height: 150px; padding: 24px 10px; border-radius: 20px; box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2); background-color:white; text-decoration: none;position: relative; top: 0;} section.icons .RLfa{ width: 60px; height: 60px; margin: 0 auto 12px auto; background-color: var(--second); color: white; border-radius: 50%;display: flex; justify-content: center; align-items: center; font-size: 24px;} section.icons .RLwords{color: var(--main); font-size: 15px; font-weight: 700; text-transform: uppercase; display: block;} /* for fading in */ section.icons a.related_link {position: relative; transform: translateY(100px);opacity: 0;} section.icons a.related_link.onstage {transform: translateY(0); opacity: 1;animation: popin .5s ease-in;} @keyframes popin {0% {transform: translateY(100px);opacity: 0;} 100% {transform: translateY(0); opacity: 1;}} @media only screen and (min-width: 576px) { section.icons .liner{gap: 45px; } section.icons a:hover, section.icons a:focus{top: -10px;} } /*M*/ @media only screen and (min-width: 768px) { section.icons .liner{gap: 56px; } section.icons .RLwords{ font-size: 18px; } section.icons a{ width: 176px; height: 200px; padding-top: 31px} section.icons .RLfa{ width: 84px; height: 84px;font-size: 34px;} } /*L*/ @media only screen and (min-width: 992px) { section.icons h2{ padding: 0 0 50px 0;} section.icons .liner{gap: 50px 70px; } section.icons .RLwords{ font-size: 20px; } section.icons a{ width: 220px; height: 216px; padding-top: 40px} section.icons .RLfa{ width: 84px; height: 84px;} } /*XL*/ @media only screen and (min-width: 1200px) { section.icons{padding: 100px 0;} section.icons .liner{gap: 50px 100px; } section.icons a{ width: 248px;} /*.icons .RLfa{ font-size: 50px;}*/ } /*XXL*/ @media only screen and (min-width: 1400px) { section.icons .liner{max-width: 1640px; justify-content: space-between; gap: 50px 0;} } /** INSIDE - RATES & TABLES **********************************************/ .content_rates_table_title{} .content_rates_table_effectivedate{} .content_rates_table_row_highlight{} table.content_rates_table tr td .widecell{} /* de-tablize it */ table.content_rates_table, table.table_builder, table.content_rates_table tbody, table.table_builder tbody, table.content_rates_table thead, table.table_builder thead, table.content_rates_table tr, table.table_builder tr, table.content_rates_table tr th, table.table_builder tr th, table.content_rates_table tr td, table.table_builder tr td{display: block;} /* remove table headers */ table.content_rates_table tr th, table.table_builder tr th {position: absolute; top: -9999px; left: -9999px;} /* put title into cell */ table.content_rates_table tr td:before, table.table_builder tr td:before { display: inline-block; text-align:left; font-weight: 600; content: attr(data-title); position: relative; width: 50%; padding-right: 20px; color: var(--dpurple);} table.content_rates_table tr td.widecell:before{display: none;} /* style it */ table.content_rates_table, table.table_builder{margin-bottom: 20px; width: 100%; border-collapse: collapse;} table.content_rates_table tr td, table.table_builder tr td{padding: 10px 20px; border-bottom: solid 1px var(--grey) } table.content_rates_table tr:nth-child(even) td, table.table_builder tr:nth-child(even) td{background-color: var(--pale);} table.content_rates_table tr td:last-child, table.table_builder tr td:last-child{border: 0} /*S*/ @media only screen and (min-width: 576px) { } /*M*/ @media only screen and (min-width: 768px) { table.content_rates_table, table.table_builder{display: table;} table.content_rates_table tbody, table.table_builder tbody{display: table-row-group} table.content_rates_table thead, table.table_builder thead{display: table-header-group} table.content_rates_table tr, table.table_builder tr{display: table-row} table.content_rates_table tr th, table.table_builder tr th{display: table-cell; padding: 14px 20px; color: var(--dpurple); position: static} table.content_rates_table tr td, table.table_builder tr td{display: table-cell; padding: 14px 20px; border: 0 } table.content_rates_table tr td:before, table.table_builder tr td:before {display: none} table.content_rates_table tr td:first-child, table.table_builder tr td:first-child{font-weight: 400} } /*L*/ @media only screen and (min-width: 992px) { table.content_rates_table tr th, table.table_builder tr th, table.content_rates_table tr td, table.table_builder tr td{ padding: 20px 30px; } } /*XL*/ @media only screen and (min-width: 1200px) { } /** ACCORDION - FAQS, FORMS, & DIVS ************************************************************/ .faq_featured_block{ margin: 20px 0 0 0 !important; display: block} .faq_header{ display: block} .faq_question_block_slide{padding: 10px 0;border-bottom: 0;} .faq_question_block_slide_question{padding: 0; border: solid 0px red} .faq_question_block_slide_answer{padding: 0 20px 10px 20px;} .faq_header{padding-top: 40px;} /* resets */ div.cms_form_collapsible_header{background: none; border-bottom: 0; } article .code_block_center.code_block_accordion_wrap {display: block; padding: 0px; gap: 0px;} article .code_block_box.code_block_accordion, article .code_block_box.code_block_accordion:hover {display: block; max-width:100%; padding: 0px; border: 0; outline: 0; border-radius: 0; box-shadow: none;background-color: transparent} article .code_block_box.code_block_accordion .code_block_indiv_image{display: none;} article .code_block_box.code_block_accordion .code_block_indiv_content{text-align: left} .code_block_accordion{ margin: 0} article .code_block_box.code_block_accordion, article .code_block_box.code_block_accordion:hover {box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2); margin-top: 2rem; border-radius: 20px 20px 0 0; padding: 0; } article .code_block_box.code_block_accordion.open, article .code_block_box.code_block_accordion.open:hover {border-radius: 20px;} .faq_question_block_slide{box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2);border-radius: 20px; padding: 0; margin-top: 2rem; } /* closed Q */ div.cms_form_collapsible_header a:visited, .faq_question_block_slide_question_closed a, .faq_question_block_slide_question_closed a:visited, div.faq_recent_block .faq_question_block_slide_question_closed a, div.faq_recent_block .faq_question_block_slide_question_closed a:visited, div.faq_featured_block .faq_question_block_slide_question_closed a, div.faq_featured_block .faq_question_block_slide_question_closed a:visited, div.faq_popular_block .faq_question_block_slide_question_closed a, div.faq_popular_block .faq_question_block_slide_question_closed a:visited, div.faq_question_panel .faq_question_block_slide_question_closed a, div.faq_question_panel .faq_question_block_slide_question_closed a:visited, .code_block_accordion div.code_block_indiv_top, .code_block_accordion.open .code_block_accordion div.code_block_indiv_top, div.cms_form_collapsible_header a, div.cms_form_collapsible_header a:visited {padding: 15px 60px 15px 20px;background-color: white; color: var(--dpurple); display: block; font-size: 16px;position: relative; text-decoration: none; position: relative; border-radius: 20px; border: 0; font-weight: 700; } div.cms_form_collapsible_header a, div.cms_form_collapsible_header a:visited{margin-top: 20px; width: 100%; text-align: left; border: 0 !important} /* hover Q */ div.cms_form_collapsible_header a:hover, div.cms_form_collapsible_header a:focus, .faq_question_block_slide_question_closed a:hover, .faq_question_block_slide_question_closed a:focus, div.faq_recent_block .faq_question_block_slide_question_closed a:hover, div.faq_recent_block .faq_question_block_slide_question_closed a:focus, .code_block_accordion div.code_block_indiv_top:hover, div.faq_featured_block .faq_question_block_slide_question_closed a:hover, div.faq_featured_block .faq_question_block_slide_question_closed a:focus, div.faq_popular_block .faq_question_block_slide_question_closed a:hover, div.faq_popular_block .faq_question_block_slide_question_closed a:focus, div.faq_question_panel .faq_question_block_slide_question_closed a:hover, div.faq_question_panel .faq_question_block_slide_question_closed a:focus, .code_block_accordion.open .code_block_accordion div.code_block_indiv_top:hover, .code_block_accordion.open .code_block_accordion div.code_block_indiv_top:focus {color: var(--second); background-color:white;text-decoration: none;} /* open Q */ div.cms_form_collapsible_header.open a, .faq_question_block_slide_question_open a, div.faq_recent_block .faq_question_block_slide_question_open a, .code_block_accordion.open div.code_block_indiv_top, div.faq_featured_block .faq_question_block_slide_question_open a, div.faq_popular_block .faq_question_block_slide_question_open a, div.faq_question_panel .faq_question_block_slide_question_open a, .code_block_accordion.open .code_block_accordion.open div.code_block_indiv_top {padding: 15px 60px 15px 20px;color: white; background-color: var(--main); display: block; font-size: 16px;position: relative; text-decoration: none; position: relative; border-radius: 20px 20px 0 0; font-weight: 700; border: 0 } /* chevrovs */ .code_block_accordion div.code_block_indiv_top:after, .code_block_accordion.open div.code_block_indiv_top:after, div.cms_form_collapsible_header a:after, .faq_question_block_slide_question_closed a:after, .faq_question_block_slide_question_open a:after {content: '';} .code_block_accordion div.code_block_indiv_top:before, .code_block_accordion.open div.code_block_indiv_top:before, div.cms_form_collapsible_header a:before, .faq_question_block_slide_question_closed a:before, .faq_question_block_slide_question_open a:before {content: '\2b'; font-family: 'Font Awesome 6 Pro'; font-weight: 900; font-size: 18px; position: absolute; top: 0; right: 0; padding: 0 20px; display: block; height: 100%; display: flex; justify-content: center; align-items: center; color: var(--second); } .code_block_accordion.open div.code_block_indiv_top:before, .code_block_accordion.open .code_block_accordion.open div.code_block_indiv_top:before, div.cms_form_collapsible_header.open a:before, .faq_question_block_slide_question_open a:before {content: '\f068'; font-family: 'Font Awesome 6 Pro'; font-weight: 900; font-size: 18px; position: absolute; top: 0; right: 0; padding: 0 20px; display: block; height: 100%; display: flex; justify-content: center; align-items: center;color: white; } /* contents */ article .code_block_accordion.open .code_block_indiv_content, .faq_question_block_slide_answer{padding: 30px 20px;border-radius: 0 0 20px 20px; margin: 0; border: 0; background-color: white;z-index: 99; position: relative; } .faq_question_block_slide_answer{padding: 1px 20px 20px 20px;} .code_block_accordion.open .code_block_indiv_content p, .faq_question_block_slide_answer p{margin: 1rem 0 0 0;} /*S*/ @media only screen and (min-width: 576px) { div.cms_form_collapsible_header a:visited, .faq_question_block_slide_question_closed a, .faq_question_block_slide_question_closed a:visited, div.faq_recent_block .faq_question_block_slide_question_closed a, div.faq_recent_block .faq_question_block_slide_question_closed a:visited, div.faq_featured_block .faq_question_block_slide_question_closed a, div.faq_featured_block .faq_question_block_slide_question_closed a:visited, div.faq_popular_block .faq_question_block_slide_question_closed a, div.faq_popular_block .faq_question_block_slide_question_closed a:visited, div.faq_question_panel .faq_question_block_slide_question_closed a, div.faq_question_panel .faq_question_block_slide_question_closed a:visited, .code_block_accordion div.code_block_indiv_top, .code_block_accordion.open .code_block_accordion div.code_block_indiv_top, div.cms_form_collapsible_header a, div.cms_form_collapsible_header a:visited, div.cms_form_collapsible_header.open a, .faq_question_block_slide_question_open a, div.faq_recent_block .faq_question_block_slide_question_open a, .code_block_accordion.open div.code_block_indiv_top, div.faq_featured_block .faq_question_block_slide_question_open a, div.faq_popular_block .faq_question_block_slide_question_open a, div.faq_question_panel .faq_question_block_slide_question_open a, .code_block_accordion.open .code_block_accordion.open div.code_block_indiv_top {font-size: 18px;padding: 20px 60px 20px 20px;} } /*M*/ @media only screen and (min-width: 768px) { div.cms_form_collapsible_header a:visited, .faq_question_block_slide_question_closed a, .faq_question_block_slide_question_closed a:visited, div.faq_recent_block .faq_question_block_slide_question_closed a, div.faq_recent_block .faq_question_block_slide_question_closed a:visited, div.faq_featured_block .faq_question_block_slide_question_closed a, div.faq_featured_block .faq_question_block_slide_question_closed a:visited, div.faq_popular_block .faq_question_block_slide_question_closed a, div.faq_popular_block .faq_question_block_slide_question_closed a:visited, div.faq_question_panel .faq_question_block_slide_question_closed a, div.faq_question_panel .faq_question_block_slide_question_closed a:visited, .code_block_accordion div.code_block_indiv_top, .code_block_accordion.open .code_block_accordion div.code_block_indiv_top, div.cms_form_collapsible_header a, div.cms_form_collapsible_header a:visited, div.cms_form_collapsible_header.open a, .faq_question_block_slide_question_open a, div.faq_recent_block .faq_question_block_slide_question_open a, .code_block_accordion.open div.code_block_indiv_top, div.faq_featured_block .faq_question_block_slide_question_open a, div.faq_popular_block .faq_question_block_slide_question_open a, div.faq_question_panel .faq_question_block_slide_question_open a, .code_block_accordion.open .code_block_accordion.open div.code_block_indiv_top {font-size: 20px;padding: 20px 60px 20px 40px;} .code_block_accordion div.code_block_indiv_top:before, .code_block_accordion.open div.code_block_indiv_top:before, div.cms_form_collapsible_header a:before, .faq_question_block_slide_question_closed a:before, .faq_question_block_slide_question_open a:before, .code_block_accordion.open div.code_block_indiv_top:before, .code_block_accordion.open .code_block_accordion.open div.code_block_indiv_top:before, div.cms_form_collapsible_header.open a:before, .faq_question_block_slide_question_open a:before {font-size: 24px; } /* contents */ article .code_block_accordion.open .code_block_indiv_content, .faq_question_block_slide_answer{padding: 30px 40px;border-radius: 0 0 20px 20px; margin: 0; border: 0; background-color: white; } .faq_question_block_slide_answer{padding: 10px 40px 30px 40px;} } /** INSIDE - NEXT STEPS *******************************/ section.steps{padding: var(--Pinside); } section.steps .liner{} section.steps .iconflex, section.steps ul{gap: 24px 34px; flex-wrap: wrap;display: flex; justify-content: center; align-items: flex-start; max-width: 260px; margin: 0 auto} section.steps ul{list-style: none; padding: 0; margin: 0} section.steps ul li{ padding: 0; margin: 0} section.steps h2{ padding: 0 0 40px 0; } section.steps a{display: block;padding: 0; width: 86px; text-decoration: none; position: relative; top: 0;} section.steps .RLicon, section.steps .RLfa{ width: 60px; height: 60px; margin: 0 auto 12px auto; background-color: var(--main); color: white; border-radius: 50%;display: flex; justify-content: center; align-items: center;font-size: 24px;} section.steps .RLwords{color: var(--second); font-size: 15px; font-weight: 700; text-transform: uppercase} /* for fading in */ section.steps a.related_link {position: relative; transform: translateY(100px);opacity: 0;} section.steps a.related_link.onstage {transform: translateY(0); opacity: 1;animation: popin .5s ease-in;} @media only screen and (min-width: 576px) { section.steps .iconflex, section.steps ul{ max-width: 100%} section.steps a:hover, section.steps a:focus{top: -10px;} } /*M*/ @media only screen and (min-width: 768px) { section.steps .iconflex, section.steps ul{gap: 30px; } section.steps .RLwords{ font-size: 18px; } section.steps a{ width: 153px; } section.steps .RLicon, section.steps .RLfa{ width: 84px; height: 84px;font-size: 34px;} } /*L*/ @media only screen and (min-width: 992px) { section.steps{padding: 80px 33px} section.steps h2{ padding: 0 0 50px 0;} section.steps .liner{gap: 40px; } section.steps .RLwords{ font-size: 20px; } section.steps a{ width: 196px; } section.steps .RLicon, section.steps .RLfa{ width: 100px; height: 100px;} } /*XL*/ @media only screen and (min-width: 1200px) { /*section.steps{padding: var(--Pboth);}*/ section.steps .iconflex, section.steps ul{gap: 90px; } section.steps .RLicon, section.steps .RLfa{ width: 120px; height: 120px;} } /*XXL*/ @media only screen and (min-width: 1400px) { } /** TESTIMONIAL *****************************************/ /* borders section.test{border: solid 1px orange;} .testim{border: solid 1px fuchsia } .Tpic{border: solid 1px blue } .Tpic p{margin: 0; padding: 0} .testimonial-carousel.carousel{border: solid 1px blue;} .content_slideshow.testimonial-carousel.carousel{border: solid 1px red;} .content_slideshow.testimonial-carousel .carousel-item{border: solid 1px green;} .content_slideshow.testimonial-carousel a.carousel-control-prev, .content_slideshow.testimonial-carousel a.carousel-control-next {border: solid 1px lime;} .content_slideshow.testimonial-carousel .playpause {border: solid 1px orange;} */ section.test{ width: 100%; z-index: 99; position: relative; padding: 0; margin-top: var(--Mtop); background: url(../images/1D_watermark.png) no-repeat left top; background-size: 96% auto; min-height: 335px;/* width="653" height="643"*/ } .testim{padding: 40px 20px } .testim h2{padding: 0 0 1.5rem 0 } .Tpic{display: none;} .content_slideshow.testimonial-carousel.carousel{border: 0;} .testimonial-carousel.carousel{border: 0;} .content_slideshow.testimonial-carousel.carousel, .content_slideshow.testimonial-carousel .carousel-item, .content_slideshow.testimonial-carousel a.carousel-control-prev, .content_slideshow.testimonial-carousel a.carousel-control-next { height: 260px;} .content_slideshow.testimonial-carousel.carousel { padding: 0; min-height: 304px;} .content_slideshow.testimonial-carousel .carousel-item { min-height: auto; } .testimonial-carousel.carousel{} .content_slideshow.testimonial-carousel .carousel-caption {padding: 20px 0px; text-align: left;height: 100%;} .content_slideshow.testimonial-carousel .carousel_caption_text{text-align: center; font-size: 18px; line-height: 1.67; } /* dots */ .content_slideshow.testimonial-carousel .carousel-indicators { position: absolute; bottom: 0; right: 44px; top: auto; margin: 0; width: calc(100% - 44px); justify-content: flex-end; padding: 0; height: 44px} .content_slideshow.testimonial-carousel .carousel-indicators button {border: solid 1px white; width: 44px; height: 44px; background-color: transparent;opacity: 1; margin: 0; border-radius: 0; position: relative; color: var(--grey); line-height: 1; text-indent: 0; display: flex; justify-content: center; align-items: center; text-indent: 0;} .content_slideshow.testimonial-carousel .carousel-indicators button:after{content: '\f111'; font-family: 'Font Awesome 6 Pro'; font-weight:900; font-size: 16px;} .content_slideshow.testimonial-carousel .carousel-indicators button:hover {background-color: transparent;opacity: 1; color: var(--accent);} .content_slideshow.testimonial-carousel .carousel-indicators button.active, .content_slideshow.testimonial-carousel .carousel-indicators button.active:hover {background-color: transparent;opacity: 1;color: var(--second); cursor: context-menu; } /* play/pause */ .content_slideshow.testimonial-carousel button.carousel-control-pause, .content_slideshow.testimonial-carousel button.carousel-control-play{color: var(--second); width: 44px; height: 44px;font-size: 24px; position: absolute; bottom: 0px; right: 0; top: auto; margin: 0; width: 44px; height: 44px; z-index: 99; text-shadow: none;} .content_slideshow.testimonial-carousel button.carousel-control-pause:hover, .content_slideshow.testimonial-carousel button.carousel-control-play:hover, .content_slideshow.testimonial-carousel button.carousel-control-pause:focus, .content_slideshow.testimonial-carousel button.carousel-control-play:focus{color: var(--accent)} .content_slideshow.testimonial-carousel button.carousel-control-pause i{display: none;} .content_slideshow.testimonial-carousel button.carousel-control-pause:after{content: '\f04c'; font-family: 'Font Awesome 6 Sharp'; font-weight: 900; transition: all .25s;} .content_slideshow.testimonial-carousel button.carousel-control-play i{display: none;} .content_slideshow.testimonial-carousel button.carousel-control-play:after{content: '\f04b'; font-family: 'Font Awesome 6 Sharp'; font-weight: 900; transition: all .25s} /*S*/ @media only screen and (min-width: 576px) { section.test{ background-size: 430px auto; min-height: 424px;} .testim{padding: 60px 33px } } /*M*/ @media only screen and (min-width: 768px) { section.test{ background-size: 542px auto; min-height: 534px;} .testim{padding: 80px 94px } .content_slideshow.testimonial-carousel .carousel_caption_text{ font-size: 20px; } } /*L*/ @media only screen and (min-width: 992px) { section.test{ background-size: 591px auto; min-height: 582px;} .testim{padding: 80px 95px } .content_slideshow.testimonial-carousel .carousel_caption_text{font-size: 24px; } } /*XL*/ @media only screen and (min-width: 1200px) { section.test{height: 640px; background-size: 652px auto; min-height: 643px; display: flex;} .Tpic{display: block; width: 44%; max-width: 841px; /*display: flex; justify-content: flex-end; align-items: center;*/ padding: 20px 0} .testim{width: 56%; padding: 50px calc(44px + 65px) 20px 80px; text-align: left;} .Tbox{max-width: 762px;} .content_slideshow.testimonial-carousel .carousel_caption_text{text-align: left; } .content_slideshow.testimonial-carousel .carousel_caption_text{font-size: 22px; } .content_slideshow.testimonial-carousel.carousel, .content_slideshow.testimonial-carousel .carousel-item, .content_slideshow.testimonial-carousel a.carousel-control-prev, .content_slideshow.testimonial-carousel a.carousel-control-next { height: 360px;} .content_slideshow.testimonial-carousel.carousel { padding: 0; min-height: 404px;} .content_slideshow.testimonial-carousel .carousel-caption{align-items: flex-start;} } /*XXL*/ @media only screen and (min-width: 1400px) { .testim{padding: 50px 65px 20px 0px; display: flex; justify-content: flex-end; } .content_slideshow.testimonial-carousel .carousel_caption_text{font-size: 24px; } .Tbox{ width: 762px;} } /** FOOT ****************************************************/ footer {width: 100%; background-color: var(--dpurple); color: white; margin-top: 65px; padding: 0 20px 60px 20px;font-size: 15px;} footer a{ color: var(--pale);text-decoration: none;font-weight: 600} footer a:hover, footer a:focus {color: white; text-decoration: underline;} .Flogo{margin: -65px 0 2rem 0;} .Fhead{font-size: 17px; font-weight: 600; text-transform: uppercase; margin-bottom: 1rem;} .bottomlinks {color: white;margin-bottom: 2rem;} .bottomlinks a {display: block;font-size: 15px;} .socmed{color: white;margin-bottom: 2rem;} .SM a .RLwords {display: none;} .SM a, .SM .notalink{ text-decoration: none !important; font-size: 20px; margin-right: 10px;} .ncua{font-size: 15px;} .footicons {display: flex; justify-content: center; align-items: center; gap: 20px; margin-bottom: 1rem} .footicons img{} @media only screen and (min-width: 576px){ footer { margin-top: 0; padding: 40px 33px 60px 33px;} .Flogo{margin: 0;} .footicons { justify-content: flex-start; } } /*M*/ @media only screen and (min-width: 768px) { } /*L*/ @media only screen and (min-width: 992px) { .ncua{display: flex} .footicons{border: solid 0px fuchsia; white-space: nowrap;} .footicons img{margin-right: 20px;} .footnote{border: solid 0px silver} } /*XL*/ @media only screen and (min-width: 1200px) { footer{padding: 60px 85px; } } /*XXL*/ @media only screen and (min-width: 1400px) { .ncua{display: block} } /** CUSTOM STYLES ******************************************/ .disclaim {font-size: 14px; line-height: 1;} img.rounded{max-width: 100%; border-radius: 30px;} a.learnmore{text-transform: uppercase; color: var(--second); text-decoration: none; font-size: 15px; font-weight: 600} a.learnmore:after{content: '\f061'; font-family: 'Font Awesome 6 Pro'; font-weight: 400; margin: 0 5px; transition: all .25s} a.learnmore:hover:after, a.learnmore:focus:after{margin: 0 0 0 10px;} .purple {color: var(--dpurple);} .blue{color: var( --accent);} /** CTA **********************************************/ input[type="submit"], input[type="reset"] {appearance: none;cursor: pointer} a.cta, input[type="submit"], a.clear, a.clear:visited, button.clear, input.go, input[type="reset"], a.PSlogout, div.faq_advanced_search_panel input[type=button], button.modal_button, button.cta, button#exedout, .blog-filter a button, .Mbttns a {display: inline-block; text-decoration: none; border: none;cursor: pointer; line-height: 1; text-align: center; transition: all .25s; font-family: var(--proxima); color: var(--pale); background: transparent; font-size: 15px; font-weight: 600; padding: 16px 25px; border-radius: 28px; position: relative; overflow: hidden; text-transform: uppercase } a.cta:hover, a.cta:focus, input[type="submit"]:hover, input[type="submit"]:focus, a.clear:hover, a.clear:focus, button.clear:hover, button.clear:focus, input.go:hover, input.go:focus, input[type="reset"]:hover, input[type="reset"]:focus, a.PSlogout:hover, a.PSlogout:focus, div.faq_advanced_search_panel input[type=button]:hover, div.faq_advanced_search_panel input[type=button]:focus, button.modal_button:hover, button.modal_button:focus, button.cta:hover, button.cta:focus, button#exedout:hover, button#exedout:focus, .blog-filter a button:hover, .blog-filter a button:focus, .Mbttns a:hover, .Mbttns a:focus {text-decoration: none;color: var(--pale); background: transparent;} a.cta:before, button.clear:before, input.go:before, input[type="reset"]:before, a.PSlogout:before, div.faq_advanced_search_panel input[type=button]:before, button.modal_button:before, button.cta:before, button#exedout:before, .blog-filter a button:before, .Mbttns a:before{content: ''; width: 100%;height: 100%; display: block; position: absolute; top: 0; left: 0;background-color: var(--second); z-index: -2; border-radius: 28px;} a.cta:after, button.clear:after, input.go:after, input[type="reset"]:after, a.PSlogout:after, div.faq_advanced_search_panel input[type=button]:after, button.modal_button:after, button.cta:after, button#exedout:after, .blog-filter a button:after, .Mbttns a:after{ content: ''; height: 100%; display: block; position: absolute; top: 0; left: 0; z-index: -2; border-radius: 28px;background-color: var(--dpurple); width: 0; transition: all .5s; z-index: -1 } a.cta:hover:after, a.cta:focus:after, button.clear:hover:after, button.clear:focus:after, input.go:hover:after, input.go:focus:after, a.PSlogout:hover:after, a.PSlogout:focus:after, div.faq_advanced_search_panel input[type=button]:hover:after, div.faq_advanced_search_panel input[type=button]:focus:after, button.modal_button:hover:after, button.modal_button:focus:after, button.cta:hover:after, button.cta:focus:after, button#exedout:hover:after, button#exedout:focus:after, .blog-filter a button:hover:after, .blog-filter a button:focus:after, .Mbttns a:hover:after, .Mbttns a:focus:after{width: 100%;height: 100%; top: 0} input[type="submit"], input[type="reset"], a.clear{background-color: var(--second);} input[type="submit"]:hover, input[type="submit"]:focus, input[type="reset"]:hover, input[type="reset"]:focus, a.clear:hover, a.clear:focus{background-color: var(--main);} a.calcxml_reset.btn.btn-lg.btn-block.btn-outline-primary{} a.calcxml_reset.btn.btn-lg.btn-block.btn-outline-primary:hover, a.calcxml_reset.btn.btn-lg.btn-block.btn-outline-primary:focus{} /*L*/ @media only screen and (min-width: 992px) { a.cta, input[type="submit"], a.clear, a.clear:visited, button.clear, input.go, input[type="reset"], a.PSlogout, div.faq_advanced_search_panel input[type=button], button.modal_button, button.cta, button#exedout, .blog-filter a button {font-size: 17px; padding: 19px 30px;} } /** HEADERS **********************************************/ /* padding, not margins */ /* Styles are missing their margin spacing and some have the wrong font size and line height H1 – 60px/1.17rem, margin bottom 1.5rem Hero Sub Text – 20px/1.5rem, margin bottom 2.5rem H2 - 46px/1.13rem margin top & bottom 1rem, #3a375a H3- 30px/1.2rem, margin top & bottom 1rem H4 - Proxima Nova 700, ALL CAPS, 20px/26px, margin bottom 1rem, #3a375a (this whole style is wrong) Body Copy –18px/30px, margin bottom 1rem Bullets - 18px/30px, margin bottom 1.25rem, check mark icons are not all lining up with the copy, see below, make 16px on mobile D1 - Proxima Nova 700, ALL CAPS, 20px/26px, margin bottom 1rem */ h1 {font-weight: 300; font-size: 30px; line-height: 1.17; margin: 0; padding: 0 0 .5rem 0; color: var(--main);} h2, .blog_title, .content_blog_header, .category_name, .podcast_list_header, .blog_year, #empapp h1, article.FRC h1, h1.KJEFontTitle, h1.faq_question {font-weight: 300; font-size: 24px; line-height: 1.13; margin: 0; padding: var(--Mtop) 0 0 0; color: var(--dpurple);} article h2.KJEToggleTitle, .cke_editable h2:first-child{padding: 0} .d1{font-family: var(--proxima); font-weight: 700; text-transform: uppercase; font-size: 16px; line-height: 1.3; margin: 0; padding: 0; color: white;} h3, .code_block h1, .blog-grid-wrap h2.blog_title, .content_rates_category1, .faq_header, .faq_question, .comments_section_header, .pod_episode_header, #KJETitle, .forum_thread_category, .Category_Header_Text, .content_faq_header, .content_calendar_header, .cms_form_header, .content_article_header, #empapp h2, .CHQ, .cardname, .blog-grid-wrap h2 {font-weight: 300; font-size: 20px; line-height: 1.2; margin: 0; padding: 2rem 0 0 0; color: var(--main);} h4, .content_rates_table_title, .region_faq_header, .comment_title, .forum_thread_firstpost_replies, .forum_reply_bottom, .branch_name {font-family: var(--proxima); font-weight: 700; text-transform: uppercase; font-size: 16px; line-height: 1.3; margin: 0; padding: 2rem 0 0 0; color: var(--dpurple);} h5, .forum_thread_date, .forum_mischeader_title {margin: 0; padding: 1.5rem 0 0 0;font-size: 16px; font-weight: 700; color: var(--font)} h6 {margin: 0; padding: 1.5rem 0 0 0;font-size: 16px;font-weight: 400; font-style: italic; color: var(--font)} /*S*/ @media only screen and (min-width: 576px) { h1 {font-size: 34px; } h2, .blog_title, .content_blog_header, .category_name, .podcast_list_header, .blog_year, #empapp h1, article.FRC h1, h1.KJEFontTitle, h1.faq_question {font-size: 30px;} h3, .code_block h1, .blog-grid-wrap h2.blog_title, .content_rates_category1, .faq_header, .faq_question, .comments_section_header, .pod_episode_header, #KJETitle, .forum_thread_category, .Category_Header_Text, .content_faq_header, .content_calendar_header, .cms_form_header, .content_article_header, #empapp h2, .CHQ, .cardname, .blog-grid-wrap h2 {font-size: 24px; } h4, .content_rates_table_title, .region_faq_header, .comment_title, .forum_thread_firstpost_replies, .forum_reply_bottom, .branch_name {font-size: 18px; } .d1{ font-size: 18px; } } /*M*/ @media only screen and (min-width: 768px) { h1 {font-size: 40px;} h2, .blog_title, .content_blog_header, .category_name, .podcast_list_header, .blog_year, #empapp h1, article.FRC h1, h1.KJEFontTitle, h1.faq_question {font-size: 34px;} h3, .code_block h1, .blog-grid-wrap h2.blog_title, .content_rates_category1, .faq_header, .faq_question, .comments_section_header, .pod_episode_header, #KJETitle, .forum_thread_category, .Category_Header_Text, .content_faq_header, .content_calendar_header, .cms_form_header, .content_article_header, #empapp h2, .CHQ, .cardname, .blog-grid-wrap h2 {font-size: 30px;} h5, .forum_thread_date, .forum_mischeader_title, h6 {font-size: 18px;} .d1{ font-size: 20px; } } /*L*/ @media only screen and (min-width: 992px) { h1 {font-size: 44px;} h2, .blog_title, .content_blog_header, .category_name, .podcast_list_header, .blog_year, #empapp h1, article.FRC h1, h1.KJEFontTitle, h1.faq_question {font-size: 36px; } h4, .content_rates_table_title, .region_faq_header, .comment_title, .forum_thread_firstpost_replies, .forum_reply_bottom, .branch_name {font-size: 20px; } } /*XL*/ @media only screen and (min-width: 1200px) { h2, .blog_title, .content_blog_header, .category_name, .podcast_list_header, .blog_year, #empapp h1, article.FRC h1, h1.KJEFontTitle, h1.faq_question {font-size: 40px;} } /*XXL*/ @media only screen and (min-width: 1400px) { h1 {font-size:60px;} h2, .blog_title, .content_blog_header, .category_name, .podcast_list_header, .blog_year, #empapp h1, article.FRC h1, h1.KJEFontTitle, h1.faq_question {font-size: 46px;} } /** MORE UNIVERSAL *******************************************/ * {overflow-wrap: break-word;} hr { border: 0; height: 0; border-top: 1px solid var(--main) } .full {display: none;} a.skipper {line-height: 0; font-size: 0; border: 0; background: transparent;position: absolute; top: 0; left: 0; z-index: 101} a.skipper:focus {border: solid 2px white; color: black; background-color: yellow; line-height: 1; font-size: 18px;} .breaker {clear: both; } img {border: 0px;} .print {display: none;} sup, sub {vertical-align: baseline; position: relative; top: -0.4em;} sub {top: 0.4em;} .flexcenter{display: flex; justify-content: center; align-items: center;} .sideslider table {width: 510px; } .sideslider { overflow: scroll;overflow-y: hidden; -ms-overflow-y: hidden;} /*S*/ @media only screen and (min-width: 576px) { } /*M*/ @media only screen and (min-width: 768px) { .mobi {display: none;} .full {display: block;} .sideslider table {width: 100%; } } /*L*/ @media only screen and (min-width: 992px) { } /*XL*/ @media only screen and (min-width: 1200px) { } /*XXL*/ @media only screen and (min-width: 1400px) { } /******************************/ /* MODULES, BELLS & WHISTLES */ /* ALPHABETIZED */ /******************************/ /** ALERTS 2.0 ****************************************************/ .alertholder{width: 100%; } .alertbar {padding: 10px 0; width: 100%; } .alertbar.regular{} .alertbar.high{} .alert {width: 96%; max-width: 1160px; margin: 0 auto; padding-right: 40px; position: relative; text-align: left} .alert_icon{} .alert a {} .alert a:hover, .alert a:focus {} button.exed {position: absolute; top: 0px; right: 10px; cursor: pointer; font-size: 20px; text-align: center; display: block; text-decoration: none !important;} button.exed:before {content:"\f057"; font-family: 'Font Awesome 6 Pro';} .alert h5{color: var(--pale);} /** BLOGS ********************************************/ .blog_posted_date {display: block; color: BLACK;} span.blog_tags_tag a{display: inline-block;} .blog_share {position: relative; z-index: 99} .blog_share a { font-size: 32px; margin-left: 20px;} .blog_share ul {list-style: none;} .blog_share ul li{ display: inline-block;} article .blog_share ul li:before { display: none;} .regionbox form input, .regionbox form select {margin: 5px;} .comments_sortbox{margin-top: 1rem; z-index: 10} /* panels */ .blog-grid-wrap .div.blog_entry{} .blog-grid-wrap .blog-img-container{} .blog-grid-wrap img.blog-image{} .blog-filter a button{margin: 0 5px 5px 0} .blog-grid-wrap .blog_posted_date{} .blog-grid-wrap .blog_comments_link_div{} div.blog_entry .blog_share{width: 100%;} /* blog panels - from Eagle 2024 which is not mobiile first .blog-grid-wrap h2{margin-top: 0; padding-top: 0} .blog-grid-wrap{gap: 30px; justify-content: center;} .blog-grid-wrap .blog_entry { flex: 1 1 345px; margin: 0; max-width: 345px; border: 0; border-bottom: solid 4px var(--accent);background-color: white; transition: all .25s; border-radius: 20px 20px 0 0; box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.2); height: auto;} .blog-grid-wrap .blog-img-container{} .blog-grid-wrap img.blog-image{border-radius: 20px;} .blog-grid-wrap .blog-content{ padding: 30px 30px 0 30px !important; line-height: 1.67;} .blog-grid-wrap .blog-content p:last-child{margin-bottom:0 !important; padding-bottom: 0 !important;} .blog-grid-wrap .blog_posted_date{font-size: 14px;} .blog-grid-wrap .blog_posted_date:after{content: ''; width: 80px; height: 1px; background-color: var(--gray); display: block; transition: all .25s; margin: 5px 0 20px 0 ;} .blog-grid-wrap a.blog_read_more.cta{font-size: 16px; height: 50px;width: 100%; position: relative; margin: 0; display: flex; justify-content: center; align-items: center; color: var(--main); background: transparent; padding: 0; border-radius: 0; width: calc(100% + 60px); left: -30px; } .blog-grid-wrap .blog_entry:hover a.blog_read_more.cta, .blog-grid-wrap .blog_entry:focus a.blog_read_more.cta, a.blog_read_more.cta:focus{ background-color: var(--accent); margin-top: 19px; } .blog-grid-wrap .blog_comments_link_div, div.blog_entry .blog_share{display: none;} .blog-filter a{} .blog-filter a button{ } .blog-filter a button:hover, .blog-filter a button:focus{} @media only screen and (max-width: 767px) { .blog-grid-wrap{display: block;} .blog-grid-wrap .blog_entry { margin: 0 auto 30px auto;} } */ /*S*/ @media only screen and (min-width: 576px) { .blog_share { float: right; } .blog_share ul { display: flex; justify-content: flex-end; align-items: center;} } /** CALENDAR *****************************/ .content_calendar_table {border: 0; } td.content_calendar_table_headercell {background-color: var(--main); color: white; text-align: center; font-weight: bold;} td.content_calendar_table_headercell a { color: white; } td.content_calendar_table_headercell a:hover, td.content_calendar_table_headercell a:focus { color: var(--pale); } td.content_calendar_table_cell { border: solid 1px var(--pale); border-top: 0} tr td.content_calendar_table_cell:last-child { border-bottom: solid 1px var(--main);} td.content_calendar_table_selectedcell { border: solid 1px var(--main); background-color: var(--pale)} /* de-tablize it */ table.content_calendar_table, table.content_calendar_table tbody, table.content_calendar_table thead, table.content_calendar_table tr, table.content_calendar_table tr th, table.content_calendar_table tr td{display: block;} /* remove empty cells */ table.content_calendar_table tr td:empty{display: none;} /* fix the header row */ table.content_calendar_table tr:first-child{display: flex; width: 100% !important; } table.content_calendar_table tr:first-child td.content_calendar_table_headercell{display: block; width: 33.33%} /* remove the days of the week row */ table.content_calendar_table tr:nth-child(2){display: none} /* add days of the week to cells */ table.content_calendar_table tr td:before{content:'Sunday: ';} table.content_calendar_table tr td:nth-child(2):before{content:'Monnday: '} table.content_calendar_table tr td:nth-child(3):before{content:'Tuesday: '} table.content_calendar_table tr td:nth-child(4):before{content:'Wednesday: '} table.content_calendar_table tr td:nth-child(5):before{content:'Thursday: '} table.content_calendar_table tr td:nth-child(6):before{content:'Friday: '} table.content_calendar_table tr td:last-child:before{content:'Saturday: '} table.content_calendar_table tr:first-child td:before{display: none;} /*S*/ @media only screen and (min-width: 576px) { } /*M*/ @media only screen and (min-width: 768px) { /* re-tableize it */ table.content_calendar_table{display: table;} table.content_calendar_table tbody{display: table-row-group} table.content_calendar_table tr, table.content_calendar_table tr:nth-child(2){display: table-row} table.content_calendar_table tr td, table.content_calendar_table tr td:empty{display: table-cell} table.content_calendar_table tr:first-child{display: table-row} /* fix header row */ table.content_calendar_table tr:first-child td.content_calendar_table_headercell{display: table-cell; width: 14.29%;} table.content_calendar_table tr:first-child td.content_calendar_table_headercell[colspan="5"]{width: 71.42%;} /* remove days of the week from cells */ table.content_calendar_table tr td:before{display: none;} .content_calendar_table {border: solid 1px var(--main); border-collapse: collapse} td.content_calendar_table_cell { border: solid 1px var(--main); } } /*L*/ @media only screen and (min-width: 992px) { } /*XL*/ @media only screen and (min-width: 1200px) { } /** CALCXML ***********************************/ .calcxml_container.container{max-width: 100%;} .calcxml_container .row {margin: 0;} h3[data-toggle="collapse"] {border-bottom: 2px solid #333;} .row.collapsing, .row.collapse.show { border: 2px solid #333; border-top: none;} .calcxml_container h3[data-toggle="collapse"]:after {color: var(--main);} table.tipped_table{ margin: 10px 0; } input.calcxml_submit.btn.btn-lg.btn-block.btn-primary{} input.calcxml_submit.btn.btn-lg.btn-block.btn-primary:hover, input.calcxml_submit.btn.btn-lg.btn-block.btn-primary:focus{} a.calcxml_reset.btn.btn-lg.btn-block.btn-outline-primary{} a.calcxml_reset.btn.btn-lg.btn-block.btn-outline-primary:hover, a.calcxml_reset.btn.btn-lg.btn-block.btn-outline-primary:focus{} /** DEC TREE ***************************************/ /* use any height less than 1000px - within reason */ .CHboxedup{max-width: 100%; height: auto; z-index: 90; } .CHbox {height: auto; height: auto;border: solid 1px var(--main); border-radius: 10px; padding: 20px 10px 60px 10px; text-align: center;} .cardbennies, .CHAs {max-height: calc(100% - 50px); overflow: auto;} .card img {border: 0 !important} /* to overwrite BS styles for .card */ .CHbox .card {display: block; background-color: transparent; border: none !important;} .CHbox a {} /* match to regular content size */ .CHQ {border-bottom: solid 2px var(--main);}/* matchED to H3 */ .cardname{} /* matchED to H3 */ .CHA {color: var(--main) } /* match to regular content size or not */ .CHA:hover, .startover:hover {color:var(--second); cursor: pointer;} .startover{ font-size: 16px; } .cardbennies { } /* match to regular content size */ /* generic icons for FA 5 */ .CHQ:before {content: '\f059'; font-family: 'Font Awesome 6 Pro'; font-weight: 700; margin-right: 10px; } .CHA:before {content: '\f0a4'; font-family: 'Font Awesome 6 Pro'; font-weight: 300;margin-right: 10px;} .startover:before {content: '\f021'; font-family: 'Font Awesome 6 Pro'; font-weight: 400; margin-right: 10px;} .startover i .fa{display: none;} /* for FA 4 .CHQ:before {content: '\f059'; font-family: 'FontAwesome'; } .CHA:before {content: '\f0a4'; font-family: 'FontAwesome'; } #startover:before {content: '\f021'; font-family: 'FontAwesome'; } */ /** FAQs **********************************************/ .faq_toolbar {padding-bottom: 15px;} .faq_viewed {color: var(--main); font-size: 11px; font-weight: bold;} .faq_search {margin: 20px 0px} .faq_question_block {margin-top: 10px;} .faq_advanced_search_panel {padding: 0px;} .faq_advanced_search_panel table {margin: 20px 0px;} .faq_advanced_search_panel table td {padding: 2px 0px;} .faq_advanced_search_panel i {color: silver;} div.faq_browse input[type=submit] {margin-left: 10px;} .faq_search_form input[type=submit]{margin: 0 10px;} div.faq_advanced_search_panel input[type=text], div.faq_advanced_search_panel textarea{width: 100%;} div.faq_advanced_search_panel input[type=button] {margin-left: 10px;} form.faq_search_form input[type="submit"], div.faq_browse form input[type="submit"]{margin: 10px 0;} /*remove recent, featured, & popular */ /*div.faq_featured_block, div.faq_recent_block, .faq_popular_block{display: none;}*/ /*S*/ @media only screen and (min-width: 576px) { } /*M*/ @media only screen and (min-width: 768px) { } /*L*/ @media only screen and (min-width: 992px) { } /*XL*/ @media only screen and (min-width: 1200px) { } /** FAQS REGION ***************************************/ ul.region_faq_list li {margin-bottom: 5px;} span.region_faq_header {display: block; margin-bottom: 10px} /** FORMS ************************************************/ form.cms_form_obj{max-width: 1000px; margin: 0 auto;} form .cms_form_object:last-child{float: none;} .visuallyhidden {border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px;} .cms_form_item .cms_form_object input, .cms_form_item .cms_form_object select, .cms_form_item .cms_form_object textarea{width: 100%; border-radius: 10px;border: solid 1px var(--grey);} .cms_form_item .cms_form_object input[type="submit"]{width: auto;} .cms_form_item .cms_form_fieldset .cms_form_object input{width: auto;} .cms_form_label{font-size: 18px; line-height: 1.15;} .cms_form_item{padding: 20px 0 0 0} @media only screen and (min-width: 500px) { .cms_form_item{ display: flex; gap: 20px; padding: 5px 0} .cms_form_label{width: 200px; } .cms_form_item .cms_form_object{flex: 1 1;} .cms_form_fieldset { width: 100%; display: flex; gap: 20px; position: relative; } .cms_form_fieldset .cms_form_legend{ position: absolute; top: 0; left: 0;width: 200px; } .cms_form_radio_container { width: calc(100% - 220px); position: relative; left: 220px; } } /*L*/ @media only screen and (min-width: 922px) { .cms_form_label{width: 300px; } .cms_form_fieldset .cms_form_legend{width: 300px; } .cms_form_radio_container { width: calc(100% - 320px); left: 320px;} } /** LOCATOR 3 **************************************************/ button#exedout {display: none;} form#locator fieldset label {display: inline;} button#exedout {display: none;} .legend{ top: -10px;} .boxedsearch, .legend {BACKGROUND-COLOR: var(--pale); } .boxedsearch label, .boxedsearch legend, .legend_label {font-size: 18px; } .boxedsearch h2{padding: 0 0 1rem 0;} .cuname { font-size: 22px;} form#locator fieldset p{display: flex; justify-content: flex-start; } input[type="checkbox"]{margin-right: 5px;} .legend .legend_label:nth-child(2){margin-right: 20px;} form#locator input#submit{top: -23px; margin-right: 10px;} /*S*/ @media only screen and (min-width: 576px) { } /*M*/ @media only screen and (min-width: 768px) { } /*L*/ @media only screen and (min-width: 992px) { form#locator input#submit{top: -27px; } } /*XL*/ @media only screen and (min-width: 1200px) { } /** POLLS ****************************************/ .region table td table td {padding: 2px;} .region table td table{margin-bottom: 10px;} .region_poll_table_inner td {padding: 2px;} .region_poll_table_inner {margin-bottom: 10px;} .region_poll_radio_cell input {position: relative; top: 5px;} label.content_poll_option_label{padding-left: 5px;} /** SIDEBAR CONTENT ************************************************/ .code_block{max-width: 100%;} .code_block_top {} .code_block_center {} .code_block_bttm {} .code_block_indiv_content p{margin-top: 0px;} article .code_block_top {} article .code_block_center {} article .code_block_bttm {} article .code_block_indiv_top{} article .code_block_indiv_content{} article .code_block_indiv_bttm{} /*.boxtop, .code_block_indiv_top, .boxbottom, .code_block_indiv_bttm {display: none;}*/ /** SMARTBANNER ********************/ #smartbanner { position:absolute; left:0; top:-82px; border-bottom:1px solid #e8e8e8; width:100%; height:78px; font-family:'Helvetica Neue',sans-serif; background:-webkit-linear-gradient(top, #f4f4f4 0%,#cdcdcd 100%); background-image: -ms-linear-gradient(top, #F4F4F4 0%, #CDCDCD 100%); background-image: -moz-linear-gradient(top, #F4F4F4 0%, #CDCDCD 100%); box-shadow:0 1px 2px rgba(0,0,0,0.5); z-index:9998; -webkit-font-smoothing:antialiased; overflow:hidden; -webkit-text-size-adjust:none; } #smartbanner, html.sb-animation {-webkit-transition: all .3s ease;} #smartbanner .sb-container { margin: 0 auto; } #smartbanner .sb-close { position:absolute; left:5px; top:5px; display:block; border:2px solid #fff; width:14px; height:14px; font-family:'ArialRoundedMTBold',Arial; font-size:15px; line-height:15px; text-align:center; color:#fff; background:#070707; text-decoration:none; text-shadow:none; border-radius:14px; box-shadow:0 2px 3px rgba(0,0,0,0.4); -webkit-font-smoothing:subpixel-antialiased; } #smartbanner .sb-close:active { font-size:13px; color:#aaa; } #smartbanner .sb-icon { position:absolute; left:30px; top:10px; display:block; width:57px; height:57px; background:rgba(255,255,255,1); background-size:cover; border-radius:10px; box-shadow:0 1px 3px rgba(0,0,0,0.3); } #smartbanner.no-icon .sb-icon { display:none; } #smartbanner .sb-info { position:absolute; left:98px; top:18px; width:44%; font-size:11px; line-height:1.2em; font-weight:bold; color:#6a6a6a; text-shadow:0 1px 0 rgba(255,255,255,0.8); } #smartbanner #smartbanner.no-icon .sb-info { left:34px; } #smartbanner .sb-info strong { display:block; font-size:13px; color:#4d4d4d; line-height: 18px; } #smartbanner .sb-info > span { display:block; } #smartbanner .sb-info em { font-style:normal; text-transform:uppercase; } #smartbanner .sb-button { position:absolute; right:20px; top:24px; border:1px solid #bfbfbf; padding: 0 10px; min-width: 10%; height:24px; font-size:14px; line-height:24px; text-align:center; font-weight:bold; color:#6a6a6a; background:-webkit-linear-gradient(top, #efefef 0%,#dcdcdc 100%); text-transform:uppercase; text-decoration:none; text-shadow:0 1px 0 rgba(255,255,255,0.8); border-radius:3px; box-shadow:0 1px 0 rgba(255,255,255,0.6),0 1px 0 rgba(255,255,255,0.7) inset; } #smartbanner .sb-button:active, #smartbanner .sb-button:hover { background:-webkit-linear-gradient(top, #dcdcdc 0%,#efefef 100%); } #smartbanner .sb-icon.gloss:after { content:''; position:absolute; left:0; top:-1px; border-top:1px solid rgba(255,255,255,0.8); width:100%; height:50%; background:-webkit-linear-gradient(top, rgba(255,255,255,0.7) 0%,rgba(255,255,255,0.2) 100%); border-radius:10px 10px 12px 12px; } #smartbanner.android { border-color:#212228; background: #3d3d3d url('/templates/COMMON_JS/dark_background_stripes.gif'); border-top: 5px solid #88B131; box-shadow: none; } #smartbanner.android .sb-close { border:0; width:17px; height:17px; line-height:17px; color:#b1b1b3; background:#1c1e21; text-shadow:0 1px 1px #000; box-shadow:0 1px 2px rgba(0,0,0,0.8) inset,0 1px 1px rgba(255,255,255,0.3); } #smartbanner.android .sb-close:active { color:#eee; } #smartbanner.android .sb-info { color:#ccc; text-shadow:0 1px 2px #000; } #smartbanner.android .sb-info strong { color:#fff; } #smartbanner.android .sb-button { min-width: 12%; border:1px solid #DDDCDC; padding:1px; color:#d1d1d1; background: none; border-radius: 0; box-shadow: none; min-height:28px} #smartbanner.android .sb-button span { text-align: center; display: block; padding: 0 10px; background-color: #42B6C9; background-image: -webkit-gradient(linear,0 0,0 100%,from(#42B6C9),to(#39A9BB)); background-image: -moz-linear-gradient(top,#42B6C9,#39A9BB); text-transform:none; text-shadow:none; box-shadow:none; } #smartbanner.android .sb-button:active, #smartbanner.android .sb-button:hover { background: none; } #smartbanner.android .sb-button:active span, #smartbanner.android .sb-button:hover span { background:#2AC7E1; } #smartbanner.windows .sb-icon { border-radius: 0px; } @media (prefers-reduced-motion: reduce) { *, ::before, ::after { animation-delay: -1ms !important; animation-duration: 1ms !important; animation-iteration-count: 1 !important; *background-attachment: initial !important; scroll-behavior: auto !important; transition-duration: 0s !important; transition-delay: 0s !important; } }