body {
    font-family: "Roboto", sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 1.05rem;
}

.roboto-bold {
    font-family: "Roboto", sans-serif;
    font-weight: 700;
    font-style: normal;
}

.roboto-mono-500 {
    font-family: "Roboto Mono", monospace;
    font-optical-sizing: auto;
    font-weight: 500;
    font-style: normal;
}

input::placeholder {
    opacity: 0.6 !important;
    color: grey !important;
}

/* bootstrap 5 seems to have dropped this */
div.form-group {
    margin-bottom: 1.4rem;
}

.text-scred {
    color: #f00;
}

.text-scyellow {
    color: #ecb53e;
}

.text-scblue {
    color: #0851a1;
}

.text-dkblue a:link {
    color: #0851a1;
    text-decoration: underline;
}

.text-dkblue a:visited {
    color: #0851a1;
    text-decoration: underline;
}

.text-dkblue a:hover {
    color: #fff;
    text-decoration: underline;
}

.text-white a:link {
    color: #fff;
    text-decoration: underline;
}

.text-white a:visited {
    color: #fff;
    text-decoration: underline;
}

.text-white a:hover {
    color: #fff;
    text-decoration: underline;
}

.text-rotate {
    transform: rotate(-90deg);
}

/* for table cells */
.text-pmatch {
    font-size: 0.9rem;
}

/* Misc */
.bg-scred {
    background-color: #f00;
}

.bg-scyellow {
    background-color: #ecb53e;
}

.bg-scblue {
    background-color: #0851a1;
}

.bg-tableblue {
    background-color: #0851a1 ! important;
}

/* panel background images */
.dc1 {
    background-image: url("/images/cat-dog-2.avif"), url("/images/cat-dog-2.jpg");
    background-repeat: no-repeat;
    background-position: top left;
    background-size: cover;
    min-height: 400px;
    border-right: solid #fff 4px;
    position: relative;
}

.dc2 {
    min-height: 400px;
    position: relative;
    background-image: url("/images/animal-licence-types.avif"), url("/images/animal-licence-types.jpg");
    background-repeat: no-repeat;
    background-position: top left;
    background-size: cover;
    border-right: solid #fff 4px;
}

.inspection-square {
    background-repeat: no-repeat;
    background-position: top left;
    background-size: cover;
    min-height: 400px;

    position: relative;
}

.inspection-HOH {
    background-color: rgba(236, 181, 62, .8); /* yellow */
    background-blend-mode: multiply;
    background-image: url("/images/inspection-types/HOH.avif"), url("/images/inspection-types/HOH.jpg");
}

.inspection-CBO {
    /* background-color: rgb(255, 255, 255); */ /* rgba(161, 85, 168, .8);  purpleish*/
    background-blend-mode: multiply;
    background-image: url("/images/inspection-types/CBO.avif"), url("/images/inspection-types/CBO.jpg");
}

.inspection-PET {
    background-color: rgb(198, 129, 129); /* rgba(104, 77, 77, .8); red/pink */
    background-blend-mode: multiply;
    background-image: url("/images/inspection-types/PET.avif"), url("/images/inspection-types/PET.jpg");
}

.inspection-AFE {
    background-color: rgb(93, 155, 179); /* rgba(45, 136, 40, 0.8); */
    background-blend-mode: multiply;
    background-image:  url("/images/inspection-types/AFE.avif"), url("/images/inspection-types/AFE.jpg");
}

.inspection-DBO {
    background-color: rgb(96, 84, 73); /* rgba(241, 136, 41, 0.6); */
    background-blend-mode: multiply;
    background-image: url("/images/inspection-types/DBO.avif"), url("/images/inspection-types/DBO.jpg");
}

.inspection-DHB {
    background-color: rgb(121, 207, 219); /* rgba(103, 172, 197, 0.8); blue */
    background-blend-mode: multiply;
    background-image: url("/images/inspection-types/DHB.avif"), url("/images/inspection-types/DHB.jpg");
}

.inspection-DDC {
    background-color: rgba(234, 234, 128, 0.8); /* blue */
    background-blend-mode: multiply;
    background-image: url("/images/inspection-types/DDC.avif"), url("/images/inspection-types/DDC.jpg");
}

.inspection-DBR {
    background-color: rgba(176, 120, 204, 0.8); /* blue */
    background-blend-mode: multiply;
    background-image: url("/images/inspection-types/DBR.avif"), url("/images/inspection-types/DBR.jpg");
}

/* tint background images */
.tint-scred {
    background-color: rgba(134, 3, 3, .8);
    background-blend-mode: multiply;
}

.tint-scyellow {
    background-color: rgba(223, 190, 145, .8);
    background-blend-mode: multiply;
}

.tint-scblue {
    background-color: rgba(8, 81, 161, .8);
    background-blend-mode: multiply;
}


.mapheader {
    background-image: url("/images/mapheader.avif"), url("/images/mapheader.jpg");
    background-repeat: no-repeat;
    background-position: top left;
    background-size: cover;
    min-height: 80px;
    position: relative;
}


/* position text botton of coloured panel div */
.dc1-txt {
    position: absolute;
    bottom: 20px;
    width: 97%;
}

/* vertical line down a div */
.divflowline {
    background: linear-gradient(#999, #999) no-repeat center/2px 100%;
}

/* transition for 'advanced search' option box */
.toggle-content {
    display: none;
    height: 0;
    opacity: 0;
    overflow: hidden;
    transition: height 350ms ease-in-out, opacity 750ms ease-in-out;
}

.show-fast {
    transition: height: 100ms ease-in-out, opacity 300ms ease-in-out;
}

.show-slow {
    transition: height: 2000ms ease-in-out, opacity 2500ms ease-in-out;
}

.toggle-content.is-visible {
    display: block;
    height: auto;
    opacity: 1;
}

.all-scroll {
    cursor: all-scroll;
}

/* top blue banner */
.banner {
    background-image: url("/images/banner4.avif"), url("/images/banner4.jpg");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    /* see below for override on min-height for md+ sized devices */
}

.bannerssub {
    position: relative;
}

/* custom blue button */
.btn-scblue, .btn-primary {
    color: #ffffff;
    background-color: #26559D;
    /* border-color: #130269; */
}

.btn-primary:hover,
.btn-scblue:hover,
.btn-scblue:focus,
.btn-scblue:active,
.btn-scblue.active,
.open .dropdown-toggle.btn-scblue {
    color: #ffffff;
    background-color: #4F6BB3;
    /* border-color: #130269; */
}

.btn-primary:active,
.btn-scblue:active,
.btn-scblue.active,
.open .dropdown-toggle.btn-scblue {
    background-image: none;
}

.btn-scblue.disabled,
.btn-scblue[disabled],
fieldset[disabled] .btn-scblue,
.btn-scblue.disabled:hover,
.btn-scblue[disabled]:hover,
fieldset[disabled] .btn-scblue:hover,
.btn-scblue.disabled:focus,
.btn-scblue[disabled]:focus,
fieldset[disabled] .btn-scblue:focus,
.btn-scblue.disabled:active,
.btn-scblue[disabled]:active,
fieldset[disabled] .btn-scblue:active,
.btn-scblue.disabled.active,
.btn-scblue[disabled].active,
fieldset[disabled] .btn-scblue.active {
    background-color: #26559D;
    /* border-color: #130269; */
}

.btn-primary .badge,
.btn-scblue .badge {
    color: #26559D;
    background-color: #ffffff;
}

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {

}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
    p {
        font-size: 1.15rem;
    }

    .text-pmatch {
        font-size: 1.15rem;
    }

    .dc1, .dc2 {
        border-right: solid #fff 4px;
        position: relative;
    }
    .banner.frontpage {
        min-height: 450px;
    }

}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
    p {
        font-size: 1.25rem;
    }

    .text-pmatch {
        font-size: 1.25rem;
    }

    .dc1, .dc2 {
        border-right: solid #fff 4px;
        position: relative;
    }

    /* frontpage news */
    .news_carousel {
        min-height: 1000px;
    }
}

/* X-Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
    .banner.frontpage {
        min-height: 500px;
    }
}

/* XX-Large devices (larger desktops, 1400px and up) */
@media (min-width: 1400px) {

}