
.flex-content.align-items-center{align-items: center;}
.flex-content.align-items-start{align-items:flex-start;}
.flex-content.align-items-end{align-items:flex-end}

#payment-options{padding-top: 48px;}
#payment-options section{margin-bottom: 36px;}
#payment-options section:before{width:20%; padding-top:20%; max-width: 188px; background-size: contain; background-position: center top; background-repeat: no-repeat; float: right; margin-left: 24px; display: block; content:'';}
#payment-options section:after{content:''; display: block; clear: both;}
#payment-options section:nth-child(2n):before{float:left; margin-left: 0px; margin-right: 24px;}
#payment-options section h2{color:#083250;}
#payment-options section.bank:before{background-image: url(images/payment-icons/bank.png);}
#payment-options section.dropbox:before{background-image: url(images/payment-icons/drop-box.png);}
#payment-options section.inperson:before{background-image: url(images/payment-icons/desk.png); max-width: none; width: 50%;}
#payment-options section.mail:before{background-image: url(images/payment-icons/mail.png);}
#payment-options section.online:before{background-image: url(images/payment-icons/online.png);}
#payment-options section.stormwater:before{background-image: url(images/payment-icons/Stormwater.png);}
#payment-options section.utility:before{background-image: url(images/payment-icons/utility.jpg);}
#payment-options section.walmart:before{display: none;}


figure.aside{float:left; width:350px; max-width: 30%; margin:0px 24px 24px 0px;}
figure.aside.right{float:right; margin:0px 0px 24px 24px;}
figure.aside.six{width:auto; max-width: 50%;}
ul.recreation-activities li{margin-bottom: 24px;}
.billing-rates{margin-top:48px;}
.billing-rates .flex-cell.justify-content-stretch{align-items: center;}
.billing-rates .flex-cell.justify-content-stretch .figure{flex-grow: 2; display: flex; align-items: center; padding-top:24px; padding-bottom: 24px;}
.billing-rates .datatable tbody th{background-color:#083250; color:#fff;}
.billing-rates table caption{background-color:#083250; color:#fff; font-size: 1.2em; padding:8px; font-weight: 700; }

#irrigation-rates{margin-top:48px; margin-bottom: 48px;}
#irrigation-rates .flex-cell.justify-content-stretch{align-items: center;}
#irrigation-rates .flex-cell.justify-content-stretch .figure{flex-grow: 2; display: flex; align-items: center; padding-top:24px; padding-bottom: 24px;}
#irrigation-rates .datatable tbody th{background-color:#083250; color:#fff;}
#irrigation-rates table caption{background-color:#083250; color:#fff; font-size: 1.2em; padding:8px; font-weight: 700;;}
.datatable{border:1px solid #083250;}
.datatable caption{background-color:#083250; color:#fff; font-size: 1.2em; padding:8px; font-weight: 700; }
.datatable .ltblue{background-color:#0c84a6}
.datatable .whte{background-color:#fff; color:#083250}
.datatable caption .ltblue{margin-left: -7px; margin-right: -7px; padding:16px 8px;}
.datatable caption .whte{margin-left: -7px; margin-right: -7px; padding:16px 8px;}
.datatable tbody tr.grey{background-color:#ccc; }
.datatable td.spacer{height: 16px;}
.datatable tbody th{background-color:#fff; border:1px solid #083250}
ul.checklist{}
ul.checklist{list-style: none;}
ul.checklist li{padding-left: 32px; background-image: url(../images/2021/Checkmark-mdblue.svg); background-size: 18px auto; background-position: top 2px left; background-repeat: no-repeat; margin-bottom: 12px;}

.empbox3{
    border:5px solid #083250; padding:18px; text-align: center; margin-top: 24px; margin-bottom: 24px;;
}
.empbox3 h2{color:#083250;}

.empbox2.gold{background-color:#ffba2e; color:#083250; border:1px solid #0c84a6;}
.empbox2.gold a{color:#083250}

.video-wrap{display: block; position: relative; max-width:100%; width: 450px; padding-top:67.2%; background-color:#000;}
.video-wrap video,
.video-wrap iframe{position: absolute; top:0px; left:0px; right:0px; bottom:0px; margin:auto; width:100%; height: 100%;}

table.inspection-fees{width:100%; border:1px solid #333;}
table.inspection-fees td{padding:12px 16px;}
table.inspection-fees th{text-align: left; font-weight: normal;padding:12px 16px;}
table.inspection-fees tr:nth-child(1) td,
table.inspection-fees tr:nth-child(1) th{padding-top:24px;}
table.inspection-fees tr:last-child td,
table.inspection-fees tr:last-child th{padding-bottom:24px;}

#billingrates2 > .flex-cell:nth-child(1){order:1;}
#billingrates2 > .flex-cell:nth-child(2){order:0;}
#billingrates2 > .flex-cell:nth-child(3){order:2;}

.conservation .flex-content{margin-bottom: 32px;}
.conservation .flex-content .golden-large{min-height: 250px; display: flex; justify-content: center; align-items: center; flex-direction: column;}
.conservation .flex-content .golden-small{ display: flex; justify-content: center;}


@media screen and (min-width:484px){
    .video-wrap{max-width:450px; margin-left:auto; margin-right:auto; padding-top:302px;}
}

@media screen and (max-width:600px){
    .datatable caption{display: block;}
    .conservation .flex-content{flex-direction: column;}
    .conservation .flex-content .golden-large,
    .conservation .flex-content .golden-small{width:auto; padding:0px; display: block; max-width: 100%; min-height: 0px;}
    #Main.rates-and-fees .flex-content{flex-direction: column;}
    #Main.rates-and-fees .flex-cell{width:100%; padding:0px;}
    #Main.rates-and-fees .flex-cell.figure{text-align: center;}
    #Main.rates-and-fees .flex-content .golden-large,
    #Main.rates-and-fees .flex-content .golden-small{width:auto; padding:0px; display: block; max-width: 100%; min-height: 0px;}

}