@font-face {
    font-family: "Gotham";
    src: url("/GothamMedium.ttf") format("truetype");
  } 
  
 @font-face {
    font-family: "GothamLight";
    src: url("/GothamLight.ttf") format("truetype");
  } 

  @font-face {
    font-family: 'FontAwesome';
    src: url("/fa-regular-400.woff2") format("woff2"), url("/fa-regular-400.ttf") format("truetype"); 
  }
  
  @font-face {
    font-family: 'FontAwesomeSolid';
    font-style: normal;
    font-weight: 900;
    font-display: block;
    src: url("/fa-solid-900.woff2") format("woff2"), url("/fa-solid-900.ttf") format("truetype"); 
}
 
body { 
    font-size: 18px !important;
}

body, html, h1, h2, h3, h4, h6, .h1, .h2, .h3, .h4, .h6, .siteTitle  {
    font-family: "Gotham" !important;
}

h1, h2, h3, h4, h6, .h1, .h2, .h3, .h4, .h6 {color: #002554 !important;}

h1 {
    font-weight: 500 !important;
    font-size: 1.8em !important;
}
h2 {font-size: 1.4em !important; }

.siteTitle:hover, .siteTitle:focus {
    text-decoration: none !important;  /* Remove underline on hover, or at least try */
}

@media screen and (max-width: 767px){
.container {margin-left: 1em; margin-right: 1em}
}


/* commented out for now. Should ideally be handing varying text sizes with % or em where possible unless ER tell us otherwise
h1{
    letter-spacing: -1px !important;
    margin-bottom: 40px !important;
}

@media screen and (max-width: 767px){
h1 {font-size: 32px !important;}

}

@media screen and (min-width: 768px){
h1 {font-size: 48px !important;}

}
*/

h5, .h5 {
  font-family: "GothamLight" !important;
}

h4, .h4 {
    font-style: normal !important;
    font-weight: 500 !important;
}

a[href="~/"]:hover {
    text-decoration: none !important; /* Remove underline on hover for siteTitle */
}

a:not(.button3):not(.btn-info),
.a {
  color: #2A2C2E;
  font-family: GothamLight !important;
  font-weight: 400 !important;
  font-size: 100% !important;
}

a:not(.button3):not(.btn-info):hover,
.a:not(.button3):hover,
.a:not(.btn-info):hover,
.a:not(.button3):focus,
.a:not(.btn-info):focus {
  color: #2A2C2E;
  font-weight: bold;
}
                                                                                        

/* to satisfy a AAA grade accessibility check on pagination link arrows*/
a.entity-pager-next-link, .entity-pager-prev-link {
    color: #333 !important;
    font-weight: 500 !important;
}

/* to satisfy a AAA grade accessibility check on pagination numbers */
.pagination>li>a, .pagination>li>span {
    position: relative;
    float: left;
    padding: 6px 12px;
    line-height: 1.42857;
    text-decoration: none;
    color: #333;
    background-color: #fff !important;
    border: 1px solid #ddd;
    margin-left: -1px;
}  

.pagination li.active a, .pagination li.active a:hover{color: #FFFFFF;}

p, .p {
    color: #2A2C2E;
    font-family: GothamLight !important;
    font-size: 100% !important;
    line-height: 1.5;
}

.navbar-static-top.navbar .menu-bar > .navbar-nav > li > a {
     font-family:  "Gotham" !important;
}

/*checkbox labels*/
.radio label,
.checkbox label {
    min-height: 21px;
    padding-left: 20px;
    margin-bottom: 0;
    font-weight: normal;
    cursor: pointer;
    font-family: "GothamLight" !important;
}

/* Add rounded corners and adjust height for the input box */
.input-group .form-control {
    border-radius: 5px !important;
    height: 36px !important;
}

/* Add rounded corners to the input-group button */
.input-group-btn .btn {
    height: 36px !important;
}

/* Add border-radius property for curved edges to .button2 and .btn-default */
.button2, .btn-default {
    border-radius: 5px !important;
}

.betacontainer {margin-top: 1.5em; margin-bottom: 1.5em; display: block;}
.buttoncontainer {margin-top: 1.5em; margin-bottom: 1.5em; display: block;}

.button3 a {font-family: Gotham;}

.beta-button a:hover, .button a:hover {text-decoration: none!important; text-decoration: none!important; }

.beta-button {
    color: #fff!important;
    background-color: #002554!important;
    font-family: Gotham;
    font-weight: 500;
    padding: 6px 20px;
    border-style: solid;
    border-color: #002554!important;
    border-radius: 10px; /* Add border-radius property for curved edges */
}

@media screen and (min-width: 768px){
    .beta-button {width: fit-content; display: inline! important;}
    .button3 {width: fit-content; display: inline! important;}
}

@media screen and (max-width: 767px){
    .beta-button {width: 100%; margin-bottom: 1em; text-align: center;}
    .button3, .a.button3 {width: 100%; text-align: center; display: block; margin-bottom: 1em;}
}


.button3 {
    color: #002554;
    border: solid 2px #FEA002;
    font-family: Gotham;
    font-size: 20px;
    font-weight: 500;
    padding: 6px 20px;
    border-style: solid;
    background-color: #fff;
    border-radius: 10px; /* Add border-radius property for curved edges */
}

.button3:not(.gjs-selected):hover {
    color: #2A2C2E;
    background-color: #FEA002;
    border-color: #FEA002;
    text-decoration: none !important;
}

.calendar-views {
    color: #002554;
}

/* for the download button */
.btn-info {
    background-color: #002554 !important;
    border-radius: 5px; /* Add border-radius property for curved edges */
    font-size: 16px !important;
    font-weight: 500 !important;
    padding: 6px 20px !important;
    font-family: "Gotham" !important;
}

.btn-info:not(.gjs-selected):hover {
    background-color: #FEA002 !important;
    border-color: #FEA002 !important;
    text-decoration: none !important;
}

.xrm-attribute-value {
    font-weight: 300 !important;
    font-color: #2A2C2E!important;
}

/*for search input and box */
button[aria-label="Search Results"] {
    color: black !important;
}

input[data-original-title="To search on partial text, use the asterisk (*) wildcard character. "] {
    border-color: #002554 !important;
}

/*for sections titles */
.section-title {
    color: #002554 !important;
}

/* for apply and search buttons*/
.btn-default {
    background-color: #f1b434 !important;
    color: black !important;
    font-family: Gotham !important;
    font-size: 16px !important;
    font-weight: 500 !important;
}

.btn-default:not(.gjs-selected):hover {
    background-color: #FEA002 !important;
}

/*cookies reject button*/
.btn-reject {
    color: #002554 !important;
    font-family: Gotham !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    border-radius: 5px;
    padding: 6px 20px !important;
    background-color: white !important;
    border: solid 2px #f1b434;
}

.btn-reject:not(.gjs-selected):hover {
    background-color: #FEA002 !important;
    color: #002554 !important;
    text-decoration: none !important;
}

/* for form tab titles */
h2.tab-title {
    color: #002554;
}

/* style the white box divs */
.white-box {
    width: 350px;
    height: 120px;
    margin-top: 50px;
    margin-left: auto;
    margin-right: auto;
    background: rgba(255, 255, 255, 0.9);
    padding: 20px;
    -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
    -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
    box-shadow: 2px 2px 20px rgb(0 37 84 / 20%);
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    border-radius: 5px;
    position: relative;
}

.mainTextBox {
    position: absolute;
    top: 10px;
    text-decoration: overline;
    text-decoration-thickness: 7px;
    font-size: 25px;
}

/* make the information text of each box under the h1 element */
.infoTextBox {
    font-size: 15px;
    margin-top: 13%;
}

.pointerMouse {
    cursor: pointer;
}

/* used for menus with more than 2 items so it can fit 3 white boxes in each line */
.menuLine {
    display: block;
}

/* align custom page content with the borders I want */
.CustomPageContent {
    margin-left: -2%;
}

/* Remove download icon in download button */
.fa.fa-download {
    display: none;
}

/* style the lists views */
.entity-grid.entitylist {
    background-color: rgba(217, 222, 229, 0);
}

.crmEntityFormView, .entitylist, .modal-content, .popover-content {
    background-color: #FFFFFF;
    color: #000000;
    border: transparent !important;
}

/* style the backGround */
.wrapper-body {
    background-color: rgba(217, 222, 229, 0);
}

/* hide "add folder" button from sharepoint subgrid, this is because this folders don't appear in MDA and can even break syncing of submission/tef case attachments (not for this portal though) */
.add-folder.btn.btn-info.action {
    display: none;
}

.hr-line {
    height: 4px;
    border-width: 0;
    color: #002554;
    background-color: #002554;
}

.form-text-bold {
    color: #002554 !important;
    font-size: x-large;
    font-weight: bold;
    direction: ltr;
}

.form-text-bold-Medium {
    color: #002554 !important;
    font-size: large;
    font-weight: bold;
    direction: rtl;
}

a[href^="$$"] {
    background-color: #7BAFD4;
    color: #069 !important;
    font-size: medium;
    font-weight: bold;
}

#qvmainsubmission {
    color: #002554 !important;
    font-size: medium;
}

#qvmainsubmission > div.tab.clearfix > div > div > fieldset > legend {
    color: white !important;
    font-size: large;
    font-weight: bold;
    background-color: #002554;
}

/* Evidence - case label */
#QuickviewControl1660207943680 > div.tab.clearfix > div > div > fieldset > table > tbody > tr:nth-child(2) > td.clearfix.cell.sharepoint-documents.table.table-striped-cell > div.info > label {
    color: #002554 !important;
    font-size: medium;
}

/* Evidence - Assessment label */
#qvevidence > div.tab.clearfix > div > div > fieldset > table > tbody > tr:nth-child(2) > td.clearfix.cell.sharepoint-documents.table.table-striped-cell > div.info > label {
    color: #002554 !important;
    font-size: medium;
}

/* Panel hub meeting section hide */
#mainContent > div.container > div.child-navigation.content-panel.panel.panel-default {
    display: none !important;
}

#QuickviewControl1667388854301 > div.tab.clearfix > div > div > fieldset > table > tbody > tr:nth-child(1) > td.clearfix.cell.textarea.form-control-cell > div.info {
    color: #002554 !important;
    font-size: medium;
}

#ofs_verificationnotes_label {
    color: #002554 !important;
    font-size: medium;
}

.calendar-title {
    color: #002554;
    font-weight: bold;
}

.badge-important {
    background-color: #002554 !important;
}

.calendar-views #YearViewToggleButton {
    color: white !important;
}

.table>thead>tr>th, .table>thead>tr>td, .table>tbody>tr>th, .table>tbody>tr>td, .table>tfoot>tr>th, .table>tfoot>tr>td {
    font-family: "GothamLight";
    border: 1px solid #dee1e5;
    padding: 10px 15px;
    font-size: 16px !important;
}

.table>thead>tr>th {
    background-color: #e6e6e6;
    color: black;
	vertical-align: top;
}

.table>thead>tr>td {
    font-size: 18px !important;
    font-weight: bolder !important;
}

/* table header override 2 */
a:not(.btn) {
    text-decoration: auto !important;
}

.pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover {
    background-color: #002554 !important;
}

/* filter box formatting */
.panel-default > .panel-body, .list-group-item {
    background-color: #EAEBEE !important;
    color: #002554;
}

/* underline hover sections */
a:hover, a:focus, .a:hover, .a:focus {
    color: #2A2C2E;
    text-decoration: underline !important;
}

/* Search.... text */
.form-control {
    color: #000000;
    font-family: 'GothamLight';
    width: max-content !important;
}

.navbar {
    min-height: 50px;
}

/*automatic height for header if text is too long for one line*/
.navbar-static-top.navbar-inverse .navbar-brand {
    height: auto !important;
}

.breadcrumb {
    border-bottom: 2px solid #EAEBEE;
    display: block;
    font-size: 16px;
    height: auto;
    padding: 10px 0;
    width: auto;
}

.tablelink a {text-decoration: underline !important;}
.tablelink:hover {
    background-color: #EAEBEE !important; 
    cursor: pointer;
}

/*Hero*/
#hero {
    background-color: #e6e6e6; 
    padding: 2em; 
    margin-bottom: 2em;}

@media screen and (min-width: 768px){
    #hero img {float: right; margin-bottom: 1.5em; margin-left: 1.2em;}
}

@media screen and (max-width: 767px){
    #hero img {margin-bottom: 1.5em; width: 280px;}
}


#hero .xrm-attribute-value {margin-top: 1em;}

.profile__body:before {
    content: "";
    height: 6px;
    width: 101px;
    display: inline-block;
    top: -10px;
    position: relative;
    background-color: #be3a34;
}


/*banners and alerts*/
.alert-info {    
    background-color: #d9edf7 !important;
    border: #bce8f1 !important;
    color:#31708f;
    font-family: "GothamLight"!important; 
}
.alert-warning{
    background-color: #fcf8e3!important;
    border: #faebcc!important;
    color:#594726;
    font-family: "GothamLight"!important;
}
.alert-danger {
    background-color: #f9f1f1;
    border-color: #f9f1f1;
    color: #000;
}
.alert {
    font-size: 16px;
    width: 100%;
}
/*banners and alerts*/
/* .alert-info {    
    background-color: #d9edf7 !important;
    border: #bce8f1 !important;}
.alert-warning{
    background-color: #fcf8e3!important;
    border: #faebcc!important;
} */


/*font awesome icons*/
.fa-solid {
    font-family: 'FontAwesomeSolid';
    font-weight: 900; 
}

.fa-arrow-up-right-from-square::before {
    font-family: 'FontAwesomeSolid';
    content: "\f08e"; 
}
.highlight-block {
    background-color: #EAEBEE;
    margin-bottom: 30px;
    margin-top: 1.5em;
    padding: 15px 20px 5px 20px;
}

.fa-arrow-right::before {
    font-family: 'FontAwesomeSolid';
    content: "\f061"; 
}

a.link-primary {
    color: #006699!important; 
    /*color: #0000EE!important;*/
    font-weight: 700!important;
    border-bottom: solid 1px rgba(0, 102, 153, 0.5);
    text-decoration: none !important;}

a.link-primary:hover {
    border-bottom-color: #00417a !important;
    color: #00417a !important;
    text-decoration: none !important; }

/*feedback form description*/
.description.above, .field-label{
    font-family: GothamLight;
}

#comments.textarea, .text {
    width: 100% !important;
}
.skip a
{
    background-color: #FEA002 !important;
    color: #002554 !important;
    font-weight: bold !important;
    margin: 0;
    padding: 6px 20px;
    position: fixed;
    top: -40px;
    left: 0;
    -webkit-transition: top 1s ease-out, background 1s linear;
    transition: top 1s ease-out, background 1s linear;
    z-index: 9999;
    font-size: 15px;
}