::-moz-selection {
    color: #fff;
    background: #505050;
}
::selection {
    color: #fff;
    background: #505050;
}
body {
    color: #505050;
}
a {
    color: #6EA19D;
}
a:hover {
    color: #D5477D;
}
.codeHTML {
    font-family: Courier New,Courier,Lucida Sans Typewriter,Lucida Typewriter,monospace;
    font-weight: 400;
    color: #00F;
}
.brand-colour {
    color: red;
    background-color: green;
}
.btn-primary {
    color: #fff;
    background-color: #6EA19D;
    border-color: #6EA19D;
}
.btn-primary:hover {
    color: #fff;
    background-color: #58837F;
    border-color: #58837F;
}
.btn-primary.focus,
.btn-primary:focus {
    box-shadow: 0 0 0 0.2rem rgba(80,122,88,0.5);
}
.btn-primary.disabled,
.btn-primary:disabled {
    color: #fff;
    background-color: #6EA19D;
    border-color: #6EA19D;
}
.btn-primary:not(:disabled):not(.disabled).active,
.btn-primary:not(:disabled):not(.disabled):active,
.show > .btn-primary.dropdown-toggle {
    color: #fff;
    background-color: #58837F;
    border-color: #6EA19D;
}
.btn-primary:not(:disabled):not(.disabled).active:focus,
.btn-primary:not(:disabled):not(.disabled):active:focus,
.show > .btn-primary.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem rgba(80,122,88,0.5);
}
.btn-default {
    color: #fff;
    background-color: silver;
    border-color: silver;
}
.btn-default:hover {
    color: #fff;
    background-color: gray;
    border-color: gray;
}
.btn-default.focus,
.btn-default:focus {
    box-shadow: 0 0 0 0.2rem rgba(201,201,201,0.5);
}
.bg-primary {
    background-color: #6EA19D!important;
}
.border-primary {
    border-color: #6EA19D!important;
}
.bg-default {
    background-color: #6EA19D!important;
}
.border-default {
    border-color: #efefef!important;
}
.breadcrumb-wrapper {
    background: #F8F8F8;
    border-top: 4px solid #6EA19D;
    border-bottom: 1px solid #efefef;
}
.breadcrumb {
    display: flex;
    flex-wrap: wrap;
    padding: 0.75rem 1rem;
    margin-bottom: 1rem;
    list-style: none;
    background-color: transparent;
    border-radius: 0.25rem;
}
.breadcrumb-item + .breadcrumb-item {
    padding-left: 0.5rem;
}
.breadcrumb-item + .breadcrumb-item::before {
    display: inline-block;
    padding-right: 0.5rem;
    color: #6c757d;
    content: "/";
}
.breadcrumb-item + .breadcrumb-item:hover::before {
    text-decoration: underline;
    text-decoration: none;
}
.breadcrumb-item.active {
    color: #6c757d;
}
footer {
    background-color: #505050;
}
.card > * {
    flex: 0 0 auto;
}
.bg-lightGrey {
    background-color: #F8F8F8;
}
.scrollToTop {
    position: fixed;
    background: gray;
    color: #000;
    opacity: 0.4;
    bottom: 30px;
    right: 30px;
    display: none;
    border: 0;
    z-index: 10;
}
.scrollToTop:hover {
    text-decoration: none;
    color: #fff;
}
.pence {
    font-size: 25pt;
}
input[type=text] {
    width: 100%;
    padding: 12px 20px;
    margin: 8px 0;
    box-sizing: border-box;
}
@media (max-width: 575.98px) {
    .display-4 {
        font-size: 28pt;
    }
    .pence {
        font-size: 18pt;
    }
}
@media (min-width: 576px) {
    .display-4 {
        font-size: 35pt;
    }
    .pence {
        font-size: 25pt;
    }
}
@media (min-width: 768px) {
    .display-4 {
        font-size: 35pt;
    }
    .pence {
        font-size: 25pt;
    }
}
@media (min-width: 992px) {
    .display-4 {
        font-size: 30pt;
    }
    .pence {
        font-size: 20pt;
    }
}
@media (min-width: 1200px) {
    .display-4 {
        font-size: 42pt;
    }
    .pence {
        font-size: 25pt;
    }
}
hr.divider-white {
    border-width: 0.1rem;
    border-color: #fff;
}
h1.text-primary {
    color: red;
}
footer input.form-control,
footer textarea.form-control {
    background-color: transparent!important;
    border: 1px solid silver;
    color: #fff;
}
footer input.form-control:focus,
footer textarea.form-control:focus {
    color: #fff;
    border: 1px solid #76A19D;
    box-shadow: none;
    -webkit-box-shadow: none;
}
footer input.form-control::-webkit-input-placeholder,
footer textarea.form-control::-webkit-input-placeholder {
    color: silver;
}

@media (max-width: 575.98px) {
    header.masthead {
        height: calc(100vh - 72px);
    }
    header.masthead h1 {
        font-size: 22pt;
		padding:20px;
		margin-left:20px;
		margin-right:20px;
    }
	header.masthead h2 {
        font-size: 22pt;
		padding:20px;
		margin-left:20px;
		margin-right:20px;
	}
}

@media (min-width: 576px) {
    header.masthead {
        height: calc(100vh - 72px);
    }
}

@media (min-width: 992px) {
    header.masthead {
        height: calc(100vh - 72px);
    }
}

@media (min-width: 1200px) {
    header.masthead {
        height: calc(100vh - 72px);
    }
    header.masthead h1 {
        font-size: 40pt;
		padding:20px;
		margin-left:120px;
		margin-right:120px;
    }
	header.masthead h2 {
		padding:20px;
		margin-left:10px;
		margin-right:10px;
	}
}

header.masthead {
    background: url("../img/Docuneering-Digital-Publishing-Viewing-Procedure-on-Laptop-v1.1.png");
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-size: cover;
}
header.masthead h1 {
	font-weight:bold;
	color:#efefef;
	background:rgba(80,80,80,0.7);
	letter-spacing:1px;
}
header.masthead h2 {
	font:OpenSans;
	font-weight:lighter;
	color:#efefef;
	background:rgba(80,80,80,0.7);
}

hr.divider {
    max-width: 3.25rem;
    border-width: 0.2rem;
    border-color: white;
}
#portfolio .container-fluid {
    max-width: 1920px;
}
#portfolio .container-fluid .portfolio-box {
    position: relative;
    display: block;
}
#portfolio .container-fluid .portfolio-box .portfolio-box-caption {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    width: 100%;
    height: 100%;
    position: absolute;
    bottom: 0;
    text-align: center;
    opacity: 0;
    color: #fff;
    background: rgba(118, 161, 157, 0.9);
    transition: opacity 0.25s ease;
    text-align: center;
}
#portfolio .container-fluid .portfolio-box .portfolio-box-caption .project-category {
    font-family: "Merriweather Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    font-size: 1.0rem;
    font-weight: 600;
    text-transform: none;
}
#portfolio .container-fluid .portfolio-box .portfolio-box-caption .project-name {
    font-family: "Open Sans", "Merriweather Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    font-weight: 400;
    font-size: 1.3rem;
    padding-left: 50px;
    padding-right: 50px;
}
#portfolio .container-fluid .portfolio-box:hover .portfolio-box-caption {
    opacity: 1;
}



/* WCAG-508 */
.docuneering {
	font-size:40pt;
	font-weight: bold;
	letter-spacing: 1px;
	padding: 20px;
	margin-left: 120px;
	margin-right: 120px;
	color: #efefef;
    background: rgba(80,80,80,0.7);
}
.docuneeringBanner {
	font-size:24pt;
	font-weight: lighter;
	padding: 20px;
	margin-left: 10px;
	margin-right: 10px;
	color: #efefef;
    background: rgba(80,80,80,0.7);
	line-height: 1.2;
}
div.header1 {
	font-size:2.5rem;
	font-weight: 500;
    line-height: 1.2;
}
div.header2 {
	font-size:2rem;
	font-weight: 500;
    line-height: 1.2;
}
div.header3 {
	font-size:1.75rem;
	font-weight: 500;
    line-height: 1.2;
}
div.header4 {
	font-size:1.5rem;
	font-weight: 500;
    line-height: 1.2;
}
div.header5 {
	font-size:1.25rem;
	font-weight: 500;
    line-height: 1.2;
}
div.header6 {
	font-size:1rem;
	font-weight: 500;
    line-height: 1.2;
}