@font-face{
    font-family:"Avenir Next W01";
    src:url("Fonts/670c4af6-0f8f-4dfa-89d7-0213a1f77b7d.woff2") format("woff2"),url("Fonts/b25f4dd5-5498-47ad-bf13-ed8d085f0ace.woff") format("woff");
font-weight: 300;
font-style: normal;
}
@font-face{
    font-family:"Avenir Next W01";
    src:url("Fonts/f5ab1a5d-da17-451b-9f60-c9d132b69cb8.woff2") format("woff2"),url("Fonts/15076b53-6450-4913-a4dd-af93d4e59311.woff") format("woff");
font-weight: 300;
font-style: italic;
}
@font-face{
    font-family:"Avenir Next W01";
    src:url("Fonts/c4691e94-080d-4452-8f9f-8b3db6b68d55.woff2") format("woff2"),url("Fonts/a1adabe6-efe5-40b7-b619-48111c8ff883.woff") format("woff");
font-weight: 400;
font-style: normal;
}
@font-face{
    font-family:"Avenir Next W01";
    src:url("Fonts/6afe4676-059a-4aa8-b891-29856bbcba22.woff2") format("woff2"),url("Fonts/a9817c16-2a79-49bf-8543-6c846d73a52f.woff") format("woff");
font-weight: 700;
font-style: normal;
}

@font-face{
    font-family:"ITC Caslon";
    src:url("Fonts/f907744b-74d5-403d-aca6-bebd57b6ab35.woff2") format("woff2"),url("Fonts/2d3f50f0-92c5-4531-8975-0d4cdc84cbde.woff") format("woff");
font-weight: 500;
font-style: normal;
}



/*
#cda05f
#7b0606
#3d3b3d
*/

body{font-size: 18px;  background-color:#fff; color:#343434; font-family: 'Avenir Next W01', sans-serif; font-weight:300;}

#mobile-nav{display: none;}
.menu-toggle{display: none;}
.sr-only{clip: rect(1px, 1px, 1px, 1px);clip-path: inset(50%); height: 1px;width: 1px;margin: -1px;overflow: hidden;padding: 0;position: absolute;}
.hide-lrg{display: none;}
#skiptocontent{}
#skiptocontent a{padding:6px; position: absolute; top:-40px; left:20px; color:#fff; background-color:#8e0404; transition: top 1s ease-out; z-index: 999;}
#skiptocontent a:focus{left:20px; top:0px;}
a{color:#12151e;}
header{position: fixed; top:0px; left:0px; background-color:#12151e;  z-index: 998; width:100%; height:70px; transition: all 0.3s ease-in; }
input[type="submit"], input[type="button"]{font-size: 1em;}
input[type="text"], input[type="number"], input[type="email"], input[type="password"], input[type="tel"]{font-size: 1em;}

header .logo{background-image:url(../images/rockdale-seal.webp); background-size: contain; background-repeat: no-repeat; width:151px; height: 148px;  display: block; margin-top:6px; position: absolute; left: 30px; top:0px; transition: all 0.3s ease-in; z-index: 1; background-position: center;}
header .sitename{color:#fff; display: block; font-weight: 500; font-family: 'ITC Caslon', serif;  margin-left: 192px; font-size: 2.2em; transition: all 0.3s ease-in; font-variant: small-caps; text-decoration: none;}
header .sitename em{font-style: normal; font-size: 0.6em; line-height: 0.6em; display: block; }
#search{position: absolute; right:0px; top:0px; width: 400px; text-align: right; z-index: 1;}
#search .searchbox{display: inline-block; transition: all 0.3s ease-in; width:0px; padding-left:0px; padding-right: 0px; border-radius: 0; border:1px solid #12151e; overflow: hidden;}
#search input[type="submit"]{color:#fff; background:none; border:none; box-shadow: none; display: inline-block;}
#search:focus .searchbox,
#search .searchbox:focus,
#search:hover .searchbox,
#search.active .searchbox{width:230px;}
#zoom{position: absolute; top:0px; right:0px; color:#fff; border:none; display: flex; flex-direction: row; justify-content: space-between; font-size: 0.7em;}
#zoom button{width:32px; height: 32px; margin:0px 2px; cursor: pointer; line-height: 32px; text-align: center; padding:0px;}
#zoom button.no-zoom{font-size: 18px;}
#zoom button.med-zoom{font-size: 24px;}
#zoom button.high-zoom{font-size: 36px;}
.offtop header .logo{height: 64px;}
#google_translate_element{position: absolute; top:70px; right:0px; transition: all 0.3s ease-in;}
.offtop #google_translate_element{opacity: 0; height: 0; overflow: hidden;}
input[type="checkbox"]{width:2em; height: 2em;}
.empbox{border: 1px solid #cda05f;
    margin-left: 48px;
    margin-right: 48px;
    margin-bottom: 48px;
    background-color: #fefbf7; padding:24px 48px;}

@media screen and (max-width:768px) {
    .empbox{margin-left:0px; margin-right: 0px; margin-bottom: 2rem; padding: 2rem 1rem;}
}

.button{ display:inline-block; border-radius: 8px; background-color:#12151e; background:linear-gradient(#365805 0%,#5d8b1b 70%,#4e7b0d 100% ); color:#fff; border:none; height: auto; padding:14px 36px; letter-spacing: 1px; font-weight: 400; font-size: 0.77em; box-shadow: rgba(0,0,0,0.5) 0px 0px 36px; cursor: pointer;}
a.button{text-decoration: none;}
input[type="submit"].button, input[type="button"].button{
    border-radius: 8px; background-color:#12151e; background:linear-gradient(#12151e 0%,#0957b6 70%,#02326d 100% ); color:#fff; border:none; height: 3em; padding:0px 36px; letter-spacing: 1px; font-weight: 400; font-size: 0.77em; box-shadow: rgba(0,0,0,0.5) 0px 0px 36px;
}

#BodyWrap{ padding-top:70px; background-color: #fff;}
#Main{padding-bottom: 48px; position: relative;}
#Main #Page{display: flex; flex-direction: row; justify-content: stretch; margin-left: auto; margin-right: auto; max-width: 1224px; overflow: visible; padding-bottom: 0px;}
#Main #Page .content-wrap{max-width: 1000px; padding-left: 84px; padding-bottom: 48px; margin-left: 0px;}

#Main .navigation-wrap{width:1224px; position: absolute; top:0px; left:0px; bottom:0px; right:0px; margin:auto;}
#Main .navigation-wrap:before{content:''; display: block; position: absolute; width:224px; top:64px; bottom:0px; background-color:rgba(0,0,0,0.48);}
#TopContent .content-wrap{padding-left: 248px;}
footer{background-color:#faf5f5; border-top:10px solid #12151e; position: relative; background-image: url(../images/FooterColumn.webp); background-size: auto 100%; background-repeat: no-repeat; background-position: left bottom;}
footer:before{border-top:32px solid #12151e; border-left: 24px solid transparent; border-right: 24px solid transparent; position: absolute; top:0px; left:50%; display: block; content:''; transform: translateX(-24px);}
footer a{color:#12151e;}

footer .contact{font-size: 0.9em; padding-bottom: 48px; width:50%; float:left;}
footer .info{width:50%; float:right; padding-top:70px;}
footer .info .footer-info{padding-right: 175px; margin-bottom: 24px; position: relative;}
footer .info .footer-info:before{content:''; display: block; position: absolute; background-image:url(../images/rockdale-seal.webp); background-size: contain; background-repeat: no-repeat; width:144px; height: 144px; bottom:0px; right:0px;}
footer .appointment-hours{border:1px solid #cda05f; padding:18px 24px; text-align: right;}
footer .credits{text-align: center; font-size: 0.8em; clear: both; margin-bottom: 16px;}
footer .contact h3{font-size: 1.5em;}
 .sidenav{ width:224px; z-index: 997;  font-size:0.9em; background-color:rgba(36,21,14,0.81); margin-top:-154px;}
 .sidenav ul{display: block; margin:24px 0px; padding:0px; list-style: none;}
 nav.sidenav li{margin-bottom: 16px; position:relative;}
 .sidenav .no-link,
 .sidenav a{ color:#fff; display: block; padding:18px 12px; margin-left:-48px; padding-left: 60px; text-decoration: none; background-color:rgba(128, 163, 91,0); transition:all 0.3s ease-in-out; text-transform: uppercase; background-color:#cda05f; color:#000000;}
 .sidenav .no-link:hover,
 .sidenav a:hover{background-color:#efc892; color:#000000;}
 .sidenav .on > a{background-color:#efc892; color:#000000;}
 .sidenav .submenu{opacity: 0; z-index: -1; width:224px; transition: all 0.3s ease-in-out; margin-top:0px; position: absolute; top:0px; left:0%; background-color:rgba(36,21,14,0.9);}
 .sidenav .submenu li{margin-bottom: 0px;}

 .sidenav li:hover > .submenu,
 .sidenav li.is_focused > .submenu,
 .sidenav .no-link:focus + .submenu,
 .sidenav a:focus + .submenu{opacity: 1; left:100%;}
 .sidenav .submenu:focus{opacity: 1; left:100%;}
 .sidenav .submenu a{margin-left: 0px; padding-left: 18px; background-color:transparent; color:#dbdbdb; border-bottom: 1px solid #fff;}
 .sidenav .submenu .submenu a{}
 .sidenav .submenu li:last-child a{border-bottom: none;;}
 .sidenav .submenu .on > a{ background-color:#302016; color:#fff; }
 .sidenav .submenu a:hover{background-color:#302016; color:#fff;}
 .sidenav  a:focus{border:1px solid #fff;}

#breadcrumbs{font-size: 0.8em; margin-top:-50px; margin-bottom: 32px; text-align: right;}
#breadcrumbs li{display: inline-block; padding:0px 6px; text-transform: lowercase;}
#breadcrumbs li:before{content:''; display: inline-block; height: 1.2em; width:4px; border-left: 1px solid #666; transform-origin: center; transform: rotate(20deg); position: relative; top:5px; left:-3px;}
#breadcrumbs li:first-child:before{display: none;}
#breadcrumbs ul{list-style: none; color:#666;}

 .disclaimer.overlay{ max-width: 800px; margin-left:auto; margin-right: auto; padding-top:74px;  padding-bottom: 74px; display: none;}
 @media screen and (max-width:1224px) {
    .disclaimer.overlay{padding-left: 16px; padding-right: 16px;}
 }
 .has_overlay .disclaimer.overlay{display: block;}
 .has_overlay #Page .content-wrap{display: none;}
 .disclaimer.overlay .acknowledge{display: flex; flex-direction: row; flex-wrap: nowrap; align-items: flex-start; margin-top:2em; margin-bottom: 2em;;}
    .disclaimer.overlay .acknowledge input[type="checkbox"]{display: block; width:2em; height: 2em;}
 .disclaimer.overlay .acknowledge p{margin-top:0px; padding-left: 24px; width:  calc(100% - 4em);}
 .disclaimer.overlay .alert.red_text{display: block; width:400px; max-width: 100%; border:2px solid #8e0404; color:#8e0404; font-weight: 400; padding:16px 24px; margin:24px auto;}

 .home .content-wrap.nav-wrap{position: static;}
 .home #MainNav{position: absolute; margin-top:0px; top:64px; bottom:0px;}
 .home #Main #Page .content-wrap{max-width:1224px; padding-left: 228px;}

 .home #Main #Page .signature{display: inline-block; width:315px; height: 97px; font-size: 0px; text-indent: 315px; overflow: hidden; background-image: url(../images/signature2.webp); background-size: contain; background-repeat: no-repeat; float: right;}

 #ProbateJudge{width:100%}
 #ProbateJudge > h1{position: absolute; z-index: -1;}
 #ProbateJudge .intro-top{display:flex; flex-direction: row; align-items: stretch; justify-content: space-between; width:100%; background-color:#12151e;}
 #ProbateJudge figure.photo{margin:0px; aspect-ratio: 1.337; position: relative;}

 #ProbateJudge figure.photo figcaption{color:#fff; text-align: center; position: absolute; top:60%; width:100%;}
 #ProbateJudge .info-bar{display: block; background-color:#fff;   }
 #ProbateJudge .info-bar .announcement{background-color:#fff; border:1px solid #cda05f; color:#2d2d2d; padding:18px;}
 #ProbateJudge .intro-top .contact-info{padding:16px 12px; color:#fff; text-align: right; background-color:#12151e;}
 #ProbateJudge .intro-top .contact-info .new{background-color:#cda05f; border:1px solid #fff; padding:8px;  color:#1a2345;}
 #ProbateJudge .intro-top .contact-info .new strong{color:#1a2345;}
 #ProbateJudge .intro-top .contact-info .new .astrisk{font-style: normal;}
 #ProbateJudge .intro-top .contact-info .h5{margin-top:0px; margin-bottom: 0px; font-weight: 300; font-size: 1.2em;}
 #ProbateJudge .intro-top .contact-info a{color:#fff; text-decoration: none;}

#Page{padding-top:42px; min-height:1230px;}
.home #Page{min-height: 800px;}
#quicklinkslabel{ font-weight: 300; text-align: center; font-size: 2em;}
#quicklinks{position: relative; margin:0px; padding:0px; list-style: none; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-evenly; align-items: stretch;}
#quicklinks li{width:48%; background-color:#fff; border:1px solid #999; border-radius: 2px; box-shadow: #4d413b -4px -4px 0px 1px;  margin-top: 2%; transition: all 0.3s ease-in; position:relative;}
#quicklinks a{display: block; text-decoration: none; padding:24px; text-align: center; position: relative; background-size:cover; background-repeat: no-repeat; background-position: center;}
#quicklinks a:before{width:37%; padding-top:36%; background-size: contain; background-position: center; background-repeat: no-repeat;content: ''; display: block; margin-left:auto; margin-right: auto; }
#quicklinks a strong{font-size: 1.3em;}
#quicklinks a p{font-size: 0.9em;margin-top:4px;}

#quicklinks #quicklink_0 a{background-image: url(../images/quicklinks/guardianships.webp);}
#quicklinks #quicklink_1 a{background-image: url(../images/quicklinks/estates.webp);}
#quicklinks #quicklink_2 a{background-image: url(../images/quicklinks/vital-records.webp);}
#quicklinks #quicklink_3 a{background-image: url(../images/quicklinks/marriage-2024.webp);}
#quicklinks #quicklink_4 a{background-image: url(../images/quicklinks/gun-permit-2024.webp);}
#quicklinks #quicklink_5 a{background-image: url(../images/quicklinks/mental-health.webp);}



.home #TopContent{background-image: url(../images/home-top-content-1.webp); background-size: cover; background-position: center; padding-top:64px; padding-bottom: 18px; }
#quicklinks li:before{content:''; display: block; position: absolute; top:0px; left:0px; right:0px; bottom:0px; background-size: cover; background-repeat: no-repeat; background-position: center; background-image: url(../images/quicklinks/Layer5.jpg); opacity: 0; transition: all 0.3s ease-in;}
#quicklinks li:hover{box-shadow: #cda05f -4px -4px 0px 1px;}
#quicklinks li:hover:before{opacity: 1;}
#quicklinks li.vital-records a:before{background-image: url(../images/quicklinks/noun_personal\ data_3137779.png);}
#quicklinks li.marriage a:before{background-image: url(../images/quicklinks/noun_Ring_2231492.png);}
#quicklinks li.estate a:before{background-image: url(../images/quicklinks/noun_legal_3395152.png);}
#quicklinks li.guardianship a:before{background-image: url(../images/quicklinks/noun_holding\ hands_149406.png);}
#quicklinks li.guns a:before{background-image: url(../images/quicklinks/noun_gun\ permit_3817852.png);}
#quicklinks li.mental-health a:before{background-image: url(../images/quicklinks/noun_Mental\ Health_4268640.png);}
#quicklinks li.public-records a:before{background-image: url(../images/quicklinks/noun_documents_85213.png);}
#quicklinks li.forms a:before{background-image: url(../images/quicklinks/forms\ icon.png);}



.interior #TopContent{background-color:#302016; background-image: url(../images/interior-top-content2.webp); background-size: cover; background-position: bottom right; padding:26px 0px;}
.interior #TopContent .content-wrap{display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: space-between; align-items: center; min-height: 150px;}
.interior #TopContent h1{color:#e6d8c4; text-transform: uppercase; font-size:2em; font-weight: 700; margin:0px; text-align: left; display: block; }
.interior #TopContent #PageIcon{ width:244px; height: 150px; margin:0px 0px 0px auto; display: block; flex-grow: 0;} 

.accordian{}
.accordian h2{margin:0px; font-size: 1.2em; font-weight: 500;}
.accordian h4{margin:0px; font-size: 1.2em; font-weight: 500;}
.accordian .accordian-item{overflow: hidden; height: auto; max-height: 0px; transition: 0.5s ease-in-out; padding:0px 48px 0px 48px;}
.accordian .accordian-item.on{max-height: 2000px; padding-top:32px; padding-bottom: 32px;}
.accordian .accordian-title{background-color:#efc892; border:1px solid #302016; padding:8px 48px 8px 32px; transition: 0.5s ease-in-out; margin-bottom: 8px; position: relative; cursor: pointer;}
.accordian .accordian-title:hover{background-color:#fefbf7;}
.accordian .accordian-title:after{content:''; display: block; width:16px; height:16px; border-top:1px solid #333; border-right:1px solid #333; transform-origin:center; transform: rotate(45deg); transition:all 0.5s ease-in-out; position: absolute;  right:16px; top:13px;}
.accordian .accordian-title.on{background-color:#fefbf7; border-color:#302016}
.accordian .accordian-title.on:after{transform: rotate(130deg);}

.mobile{display: none;}


.interior #Main{padding-bottom: 0px;}
.interior #Page{overflow: hidden; position: relative; padding-bottom: 48px;}
.interior #BodyWrap{position: relative;}
.interior #BodyWrap:before{content:''; display: block; position:absolute; top:239px; right:-240px; bottom:0px; width:468px; background-image: url(../images/columntop.webp); background-size: 100% auto; background-repeat: no-repeat; opacity: 0.4;}
.interior #BodyWrap:after{content:''; display: block; position:absolute; top:1818px; right:-240px; bottom:0px; width:468px; background-image: url(../images/columntop-repeat.webp); background-size: 100% auto; background-repeat: repeat-y; opacity: 0.4;}

.interior #Main:before{content:''; display: block; width:100%; height: auto; padding-top:100%; background-size: contain; background-position: bottom left; background-repeat: no-repeat; background-image: url(../images/TriangleBackground.webp); position: absolute; bottom:0px; left:0px; opacity: 0.4;}

.news-list{list-style: none; margin:0px; padding:0px;}
.news-list li.item{margin-bottom: 24px; padding-bottom: 24px; border-bottom: 1px solid #1b6f9b; padding-left: 60px;}
.news-list h3{color:#1b6f9b; margin-left: -60px;}
.news-list .date{font-weight: 600;}
.news-list .item.page-off{display: none;}

.folder_contents{list-style: none; margin:0px; padding:0px;}
.folder_contents .subfolder{background-color:#ebeef1; border:1px solid #3a587a; padding:24px; margin-bottom: 24px;}
.folder_contents .subfolder > .name{display: block; color:#3a587a; font-size: 1.17em; font-weight: bold; margin-bottom: 18px; }
.folder_contents .subfolder_contents li{margin-bottom: 12px;}




@keyframes flipinX{
    0%{opacity: 0; transform: rotate3d(1,0,0,90deg); animation-timing-function: ease-in;}
    25%{opacity: 1;}
    40%{transform: rotate3d(1,0,0,-20deg);}
    60%{transform: rotate3d(1,0,0,10deg);}
    80%{transform: rotate3d(1,0,0,-5deg);}
    100%{transform: rotate3d(1,0,0,0deg);}
}

@media screen  and (max-width:1352px){
    .home #Main #Page .content-wrap{width:100%; padding-left: 268px;}
}
@media screen and (max-width:1304px){
    .content-wrap{margin-left: 32px; margin-right: 32px; width:auto;}
    #Main #Page .content-wrap{padding-right: 32px; margin-right: 0px; max-width: calc(100% - 228px); padding-left: 48px;}
   /* .interior #TopContent h1{font-size: 24px;}*/
    #Main #Page .info-section h3{margin-left: 0px;}
}

@media screen and (max-width:1300px){
    #Sidebar{width:275px;}
    #Sidebar figure.intro{width:275px; height: 275px; margin-top:-276px;}
    .home #Sidebar figure.intro img{width:243px; height: 243px;}

    .home #hero{height: 276px; background-size:cover; background-position: center top;}
    .sidenav{}
    #Content{padding:40px 0px 64px 32px;}
    button.round.white{width:184px; height: 184px;}
    .home .four-sections .section{padding-right: 16px;}
    .home .four-sections .section:nth-child(2n){padding-left:16px;}
}



@media screen and (max-width:968px){
    #MainNav{display: none;}
    #Main .navigation-wrap{display: none;}
    #TopContent .content-wrap{padding-left: 0px;}
    #Main #Page .content-wrap{padding-left: 32px; max-width: 100%;}
    .home #Main #Page .content-wrap{padding-left: 32px;}
    .home #Sidebar{display: none;}
    #search{right:90px; top:-10px}
    #zoom{display: none;}
    #Content,
    .interior #Content{padding-left:0px; display: block;}
    hr.large{margin-left: -32px;}
    .on hr.large{width:150%;}
    #Page{min-height: 960px;}
    
    .nosub.table-content{display: block;}
    .nosub #Sidebar{display: none;}
    .nosub #Content{display: block;}
    body{position: relative; left:0px;}
    body#tinymce{padding:0px;}
    
    header .buttons{top:87px; right:16px;}
    
    #BodyWrap{background-color:#fff;padding-top:0px; overflow: hidden;}
    #BodyWrap,
    header,
    footer{transition:all 0.3s ease-in-out; position: relative; z-index: 1}
    header{z-index: 2}
    
    #mobile-nav{display:block; background-color:rgba(36,21,14,0.9); border-top:16px solid rgba(36,21,14,1); position: fixed; line-height: 1.5em; z-index: -1; top:0px;left:-370px; bottom:0px; width:370px; height: 100vh; min-height: 100%; overflow:hidden; overflow-y: auto; max-height: 100vh;  transition: visibility 0s linear 350ms, transform 350ms linear;}
    #mobile-nav .header{position: relative; background-color:#cda05f; height: 58px; display:flex; padding:4px 12px; justify-content: flex-start; align-items: center;}
    #mobile-nav .header .close{border:none; box-shadow: none; cursor: pointer; background:transparent; margin-right: 24px; text-align: center; height: auto; width:auto; display: block; font-size: 0.5em;}
    #mobile-nav .header .close:before{content:''; display: block; width:100%; height: 32px; margin-bottom: 2px; background-size: contain; background-position: center; background-repeat: no-repeat; background-image: url(../images/icon-close.svg);}
    #mobile-nav .header .title{font-weight: 800; color:#111; display: block; padding:4px 8px; font-size: 1  em;}
    #mobile-nav .menu-wrapper{position: absolute; top:70px; left:0px; right: 0px; bottom:0px; }
    #mobile-nav nav{ position: absolute; color:#fff; background-color:rgba(36,21,14,1); width:370px; min-height: 100%; top:0px; bottom:0px; transform: translateX(-370px); z-index: 2; transition: visibility 0s linear 350ms, transform 350ms linear;}
    #mobile-nav .mobile-nav-menu-btn{cursor:pointer; display:flex; justify-content: space-between; align-items:center; color:#000; text-decoration: none; font-size: 1rem; line-height: 1.5; background-color:transparent;  border:none; box-shadow:none; border-bottom:1px solid #333; width:100%; padding:12px 20px 12px 12px; text-transform: uppercase; background-color:#cda05f; margin-bottom: 12px; text-align: left;}
    #mobile-nav .mobile-nav-menu-btn .icon{width:1em; height: 1em; background-size: contain; background-position: center; background-repeat: no-repeat;}
    #mobile-nav .mobile-nav-menu-btn .icon.next{background-image: url(../images/icon-next.svg); }
    #mobile-nav .mobile-nav-menu-btn .icon.back{background-image: url(../images/icon-back.svg); margin-right: 12px; }
    #mobile-nav .mobile-nav-menu-btn.back{justify-content: flex-start; background-color:#efc892; color:#111;}
    #mobile-nav .mobile-nav-menu-title{background-color:#650360;}

    

    body:before{visibility:hidden; display: block; position: fixed; top:0px; bottom:0px; width:100%; height: 100%; content:''; background-color:rgba(0,0,0,0.0); transition: visibility 0s linear 350ms, background-color 350ms linear;}

    body.nav-on:before{visibility: visible; content:''; display: block; position:fixed; left:0px; right:0px; top:0px; bottom:0px; z-index:999; background-color:rgba(0,0,0,0.7);}
    body.nav-on #mobile-nav{z-index: 1000; transform: translateX(100%);}
    body.nav-on #mobile-nav nav.on{ z-index: 0; transform: translateX(0vw);}

    body{padding-top:44px;}
    header .menu-toggle{display: block; visibility: visible; position: absolute; top:4px; left:0px; border:none; box-shadow: none; cursor: pointer; background:transparent; margin-right: 24px; text-align: center; height: auto; width:auto; display: block; font-size: 0.5em; color:#fff; }
    header .menu-toggle:before{content:''; display: block; width:100%; height: 32px; margin-bottom: 2px; background-size: contain; background-position: center; background-repeat: no-repeat; background-image: url(../images/icon-menu.svg);}
    header{ height:52px; position: fixed; top:0px; left:0px; z-index: 999; width:100%; transition:all 0.3s ease-in;}
    
    header .logo{left:auto; right:0px; width:98px; height: 98px; transition: all 0.3s ease-in;}
    .offtop header .logo{height: 42px; width:42px;}
    header .sitename{margin-left: 72px; font-size:1.7em;}
    #google_translate_element{top:52px; left:70px;}
    footer .contact{padding-bottom: 24px;}
    .mobile.contact_info{display: block; border:1px solid #cda05f; max-width: 400px; margin:0px auto;padding:24px;}
    
    .interior #hero{height: 200px; background-size: cover; background-position: center;}
    .interior #hero .content-wrap:before {width:185px; height: 185px;}
    .interior #TopContent .content-wrap{min-height: 120px;}
    .interior #BodyWrap:before{top:152px;}
    .interior #BodyWrap:after{top:1731px;}
    .interior #TopContent #PageIcon{width:114px; height: 120px; margin-right: 40px;}
    footer .content-wrap{background-image:none;}

    .interior #TopContent h1{font-size: 1.54em; padding-left: 24px;}
    .disclaimer.overlay{max-width: 100%; padding-top:32px; padding-bottom: 32px;}

    .accordian .accordian-item{padding-left: 0px; padding-right: 0px;}
    #search:focus .searchbox, #search .searchbox:focus, #search:hover .searchbox, #search.active .searchbox{width:180px}
}
.bg-primary{background-color:#02326d; color:#fff;}
.border{border:2px solid;}
.border.border-danger{border-color:#c41313;}
.text-danger{color:#c41313;}
.icon-alert{background-image: url(../images/triangle-exclamation-solid-full.svg); background-size: contain; background-repeat: no-repeat; background-position: center;}
.icon-inline{display: inline-block; width:2em; height: 2em; vertical-align: -0.5em;}
.p-3{padding:2rem;}
.p-1{padding:0.5rem;}
.d-inline{display:inline;}
.d-inline-block{display:inline-block;}

@media screen and (max-width:740px){
    #ProbateJudge .intro-top{flex-direction: column;}
    #ProbateJudge .intro-top .photo img{width:100%;}
    #ProbateJudge .intro-top .contact-info{text-align: center;}
    #search{display: none;}

}

@media screen and (max-width:700px){
    .content-wrap{margin-left: 16px; margin-right: 16px;}
    #Content{padding-top:16px;}
    header #nav-toggle{}
   
    
    
    header:before{height: 47px;}
    header:after{top:45px;}
    
    
    header .buttons{top:61px;}
    
}

@media screen and (max-width:600px){
    .home #Content .alert{margin-left: -16px; margin-right: -16px;}
    .home .four-sections .section{width:auto; padding-right: 0px; padding-left: 0px;}
    .home .four-sections .section:nth-child(2n){padding-left: 0px;}
    .home #quicklinks ul{column-count: 1;}
    header{z-index: 3;}
    
    
    .home #hero{height: 200px; background-size: cover; background-position: center;}
    .Page{padding-top:110px;}
    header .buttons{top:311px; width:auto; left:16px; right:16px;}
    
    header .button{border-top-left-radius: 8px; border-top-right-radius: 8px; margin-bottom: 18px; display: block; text-align: center; width:auto;}
    header .button:before{margin:0px; border:4px solid #8e0404; border-radius: 8px; }
    #ProbateJudge .info-bar{flex-direction: column;}
    #ProbateJudge .info-bar .announcement{width:auto;}
    #ProbateJudge .info-bar .contact-info{width:auto; text-align: center;}
    #quicklinks li{width:44%;}

    .faq-section{padding-left: 0px;}
    .faq-section h3{margin-left: 0px;}
    #Page {padding-top:8px; min-height: 0px;}
    footer{background-image: none;}
    footer .contact{float:none; width:auto; text-align: center; padding-bottom: 0px; padding-top:16px;}
    footer .info{float:none; width:auto; padding-top:0px;}
    footer .info .footer-info{padding-right: 0px; padding-top:105px;}
    footer .info .footer-info:before{left:0px; right:0px; width:100%; background-position:center; height: 94px;bottom:auto; top:0px;}
    #quicklinks li{width:100%}
    
    .interior #TopContent #PageIcon{display: none;}
    .interior #TopContent h1{padding-left: 0px; text-align: center; width:100%;}

    .interior #Main #Page img.aside{float:none; width:auto; max-width:100%; padding-left:32px; padding-right: 32px;}
    .interior #Page .faq-list.accordian:before{background-size: auto 100%; padding-top:75px;}

    
}

@media screen and (max-width:450px){

    body{font-size: 16px;}
    #quicklinkslabel{font-size: 1.5em;}
    .interior #hero .content-wrap:before{left:0px;}
    
    .interior .Page h1 figure.icon{display: block; margin:0px auto;}
    .interior .Page h1 span.title-block{display: block; padding-left: 0px; text-align: center;}
    
    header .sitename{font-size: 1.5em; position: relative; top:4px;}
    .interior #TopContent h1{font-size: 1.5em;}
    .interior #TopContent{padding:16px 0px;}
    header .logo{width:78px; height: 78px;}
    .accordian h2{font-size: 1.1em;}
    .accordian .accordian-item{padding:0px;}
    .accordian .accordian-item.on{padding-top:18px; padding-bottom: 18px;}
    #breadcrumbs{margin-top:-20px; margin-bottom: 12px;}
    #breadcrumbs li{display: none;}
    #breadcrumbs li:last-child{display: inline-block;}
    #breadcrumbs li:nth-last-child(2){display: inline-block;}
    #Main #Page .content-wrap{padding-left:16px; padding-right: 16px;}
    .home #Main #Page .content-wrap{padding-left: 16px;}
    .home #Main #Page .signature{width:215px;}
    ol{padding-left: 0px;}
}
@media screen and (max-width:360px){
    header .sitename{font-size: 1.1em}
}



body.larger_text{font-size: 24px;}
body.larger_text header{height:87px;}
body.larger_text .sidenav{width:254px;}
body.larger_text .sidenav .no-link, 
body.larger_text .sidenav a{padding-left: 20px;}
body.larger_text.home #Main #Page .content-wrap{padding-left: 274px;}
body.larger_text .sidenav .submenu{width:254px;}
body.larger_text .Page .info-section h3,
body.larger_text .Page .faq-section h3{margin-left: 0px;}
body.larger_text #search{right:130px;}

body.largest_text{font-size:36px;}
body.largest_text header{height:116px;}
body.largest_text.interior #TopContent h1{font-size: 1.5em;}
body.largest_text header .sitename{font-size: 2em;}
body.largest_text .sidenav{width:314px; margin-top:-254px;}
body.largest_text .sidenav .no-link, 
body.largest_text .sidenav a{padding-left: 20px; overflow: hidden;}
body.largest_text.home #Main #Page .content-wrap{padding-left: 338px;}
body.largest_text #Main #Page .content-wrap{padding-left:34px;}
body.largest_text #TopContent .content-wrap{padding-left: 338px;}
body.largest_text #BodyWrap{padding-top:116px;}
body.largest_text .sidenav .submenu{width:338px;}
body.largest_text.interior #TopContent #PageIcon{width:314px; height: 210px;}
body.largest_text .Page .info-section h3,
body.largest_text .Page .faq-section h3{margin-left: 0px;}
body.largest_text #search{right:210px; width:450px;}

@media  screen and (max-width:968px){
    body.larger_text,
    body.largest_text{font-size: 18px;}

    body.largest_text #TopContent .content-wrap{padding-left: 0px;}
}
