:root {
    --site-color: #025098; 
    --site-color2: #b02b2c;
    
    /* Either navitem inherits or set colours */
    --navitem-background-color: inherit;
    --navitem-color: inherit;
    --navitem-border: 2px solid var(--site-color);
}

.container-fluid {
    padding: 0px 3px 0px 3px;
    background-color: #ffffff;
}

@media only screen and (min-width: 768px) {
    .container-fluid {
        padding: 0px 65px 0px 65px;
    }
}

/* Extra small devices (portrait phones, less than 576px)
 No media query since this is the default in Bootstrap */

body {
    font-size: 0.8em; /* 0.9x default size */
}

/* Small devices (landscape phones, 576px and up) */
@media all and (min-width: 576px) {
    body {
        font-size: 0.9em; /* 1.0x default size */
    }
}

/* Medium devices (tablets, 768px and up) */
@media all and (min-width: 768px) { 
    body {
        font-size: 0.9em; /* 1.0x default size */
    }
}

/* Large devices (desktops, 992px and up) */
@media all and (min-width: 992px) {
    body {
        font-size: 1.0em; /* 1.1x default size */
    }
}

/* Extra large devices (large desktops, 1200px and up) */
@media all and (min-width: 1200px) { 
    body {
        font-size: 1.0em; /* 1.0x default size */
    }
}





nav li.nav-item.active a {
    background-color: inherit;
    color: #025098;
}
nav li.nav-item a:hover {
    background-color: inherit;
    color: #025098;
}

ul li.nav-item.active a {
    background-color: inherit;
    color: inherit;
    border-bottom: 2px solid #025098;
}
ul li.nav-item a:hover {
    background-color: inherit;
    color: inherit;
    border-bottom: 2px solid #025098;
}


.carousel-item {
    max-height: 300px;
}

.jjl.border-bottom {
    border-color: #025098 !Important;
}

.jjl-wrap {
    overflow-wrap:break-word;
}
.jjl-div-hdr {
    background-color: #025098;
    color: white;
}

div.jjl-div-bg {
    border-radius: 25px;
    width: 300px;
    height: 100px;
    padding: 15px;
    background-color: lightgrey !Important; 
    box-shadow: 10px 10px 5px #025098 !Important;
}

.jjl-hide {
	display: none;
}

.site-color {
    color: #025098;
    display: inline-block;
}

.site-color2 {
    color: #b02b2c;
    display: inline-block;
}

.site-tr {
	background-color: #025098;
	color: white;
}

.site-table tbody tr {
	cursor: pointer;
}

.site-table td, .site-table th {
    padding: .16rem;
    vertical-align: top;
    border-top: none !Important;
}

.site-table tr img {
	display: inline-block;
}

.jojel-td-anchor,.jojel-td-anchor:link,.jojel-td-anchor:visited,.jojel-td-anchor:hover,.jojel-td-anchor:focus,.jojel-td-anchor:active{
    color: inherit;
    text-decoration: none;
}

/* Gradient transparent - color - transparent */

hr.style-two {
    border: 0;
    height: 1px;
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
}
hr.sitesolid1{
	border-top: 1px solid #025098;
}
hr.sitesolid2{
	border-top: 1px solid #b02b2c;
}

hr.sitefade1 {
    border: 0;
    height: 1px;
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0), #025098, rgba(0, 0, 0, 0));
    margin-bottom: 25px;
}

hr.sitefade2 {
    border: 0;
    height: 1px;
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0), #b02b2c, rgba(0, 0, 0, 0));
}

hr.dashfade1 {
	border-top: 1px dashed #8c8b8b;
}


.cookiealert {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    margin: 0 !important;
    z-index: 999;
    opacity: 0;
    border-radius: 0;
    background: #212327;
    transform: translateY(100%);
    transition: all 500ms ease-out;
    color: #ecf0f1;
}

.cookiealert.show {
    opacity: 1;
    transform: translateY(0%);
    transition-delay: 1000ms;
}

.cookiealert a {
    text-decoration: underline
}

.cookiealert .acceptcookies {
    margin-left: 10px;
    vertical-align: baseline;
}