/*GENERAL STYLES*/
.mt_20 {
    margin-top: 20px;
}
.mt_30 {
    margin-top: 30px;
}
.mt_40 {
    margin-top: 40px;
}
.mb_10 {
    margin-bottom: 10px;
}
.mb_20 {
    margin-bottom: 20px;
}
.mb_50 {
    margin-bottom: 50px;
}
.IconFontSize {
    font-size: 25px;
    margin-right: 5px;
}
.pt_20 {
    padding-top: 20px;
}
.pd_0 {
    padding: 0px;
}
.pd_10 {
    padding: 10px;
}
.pd_20 {
    padding: 20px;
}
.pd_30 {
    padding: 30px;
}
.pd_40 {
    padding: 40px;
}
.pd_50 {
    padding: 50px;
}

.pl_20 {
    padding-left: 20px;
}
.pl_50 {
    padding-left: 50px;
}
.pr_20 {
    padding-right: 20px;
}
.pr_50 {
    padding-right: 50px;
}
.pd_20 {
    padding: 20px;
}
.pb_20 {
    padding-bottom: 20px;
}
.pb_50 {
    padding-bottom: 50px;
}

.noBorder .ui-collapsible-content.ui-body-inherit {
    border: none !important;
}
.noBorder .ui-btn {
    padding: 0px !important;
}
.noListStyle {
  list-style: none !important;
  position: relative;
}
.textLeft {
    text-align: left;
}
.textCenter {
    text-align: center;
}
.whiteBorder {
    border: 2px solid #fff;
    padding: 10px 15px;
    border-radius: 25px;
    font-size: 16px !important;
}
/*NETWORK RAIL STYLES*/
#networkRailLogo {
    width: 50%;
    max-width: 320px;
    margin: 30px auto;
}
.custom-collapsible .ui-collapsible-heading .ui-btn {
  background-color: var(--blue) !important; /* Blue */
  border-radius: 30px !important;
  color: var(--white);
  padding: 10px 20px;
}
.custom-red .ui-collapsible-heading .ui-btn {
  background-color: var(--red) !important; /* Blue */
  border-radius: 30px !important;
  color: var(--white);
  padding: 10px 20px;
}
#railRisksLinks {
    padding: 0px !important;
    margin: 0px !important;
}
#railRisksLinks ul li a {
    font-family: var(--defaultBoldFont) !important;
    font-weight: normal !important;
}
#railRisksLinks .ui-page-theme-a .ui-btn.textRed {
    color: var(--red) !important;
}
#railRisksLinks .ui-btn-icon-right::after {
    right: 1.3em !important;
}
.whiteBtn::after,
#railRisksLinks a.ui-btn-icon-right.textRed:first-child::after {
    background-color: var(--red) !important
}
table {
    width:100%;
}
table thead tr td {
    text-align: center;
    font-family: var(--defaultBoldFont) !important;
    font-weight: normal !important;
}
table tr td {
    border: 2px solid var(--black) !important;
    width: auto;
    padding: 15px 0px;
    text-align: center;
}

.redButtons {
    background-color: var(--red) !important;
    list-style: none !important;
    border-radius: 30px;
    text-align: left;
    color: #fff; 
    padding: 10px 15px !important;
    
}
.redButtons a {
    background-color: var(--red) !important;
    padding: 0px !important;
}
#buttonsContainer ul,
#railActionButtons ul,
#railPurposeAndScopeLinksTwo ul,
#railPurposeAndScopeLinks ul,
#railGuidanceButtons ul,
#railTouchThirdRailLinks ul,
#railDirectCurrentLinks ul,
#railOverheadLineLinks ul,
#responderActButOne ul,
#railSAFEButtons ul,
#railGuidanceButtons ul,
.alertButtons {
    padding: 0px;    
    margin: 0px;
}
#buttonsContainer li,
#railActionButtons li,
#railPurposeAndScopeLinksTwo li,
#railPurposeAndScopeLinks li,
#railGuidanceButtons li,
#railTouchThirdRailLinks li,
#railDirectCurrentLinks li,
#railOverheadLineLinks li,
#responderActButOne li,
#railGuidanceButtons li,
#railSAFEButtons li {
    list-style: none;
    border-radius: 30px !important;
    position: relative !important;
}

#buttonsContainer li a,
#railPurposeAndScopeLinksTwo li a,
#railPurposeAndScopeLinks li a,
#railGuidanceButtons li a,
#railTouchThirdRailLinks li a,
#railDirectCurrentLinks li a,
#railOverheadLineLinks li a,
#responderActButOne li a,
#railGuidanceButtons li a,
#railSAFEButtons li a {
    padding: 0px !important;
    margin: 0px !important;
    background-color: #1D70B7 !important;
    list-style: none;
    text-align: left;
    padding: 10px 15px;
    border-radius: 30px !important;
    font-weight: normal !important;
    font-family: var(--defaultFont) !important;
    font-size:1.3em;
    display: block;
}
#railPurposeAndScopeLinks li a,
#railPurposeAndScopeLinksTwo li a,
#railSAFEButtons li a ,
#railGuidanceButtons li a {
    padding: 10px 15px !important;
}
#railActionButtons li a {
    font-size:1.3em;
    padding: 0px;
    margin: 0px;
    list-style: none;
    text-align: left;
    padding: 10px 15px;
    border-radius: 30px !important;
    font-weight: normal !important;
    font-family: var(--defaultFont) !important;
}

.railSafeCover {
    background-color: #cccccc;
    padding: 50px;
    margin-top: 20px;
}
#responderContAdditionalHeader p,
#responderContEmServConActionsHeader p,
#responderContRiskHeader p,
#responderActWithRioHeader p,
#responderActWithOutRioHeader p,
#responderActExtremeHeader p {
    font-size: 1.3em;
    line-height: 1 !important;
    font-weight: normal;
}
#responderContAdditionalHeader p,
#responderContEmServConActionsHeader p,
#responderContRiskHeader p,
#responderActWithRioHeader p,
#responderActWithOutRioHeader p,
#responderActExtremeHeader p,
#responderActList ul li {
    color:var(--white) !important;
}
#railRisksLinks ul li {
    border-bottom: 1px solid #707070;
}
#buttonsContainer ul li::after,
#responderActButOne ul li::after,
#railActionButtons ul li::after,
#railPurposeAndScopeLinksTwo ul li::after,
#railPurposeAndScopeLinks ul li::after,
#railGuidanceButtons ul li::after,
#railTouchThirdRailLinks ul li::after,
#railDirectCurrentLinks ul li::after,
#railOverheadLineLinks ul li::after,
#railRisksLinks ul li::after,
#railSAFEButtons ul li::after {
    content: "";
    display: inline-block;
    background-image: url("/webapp/css/images/icons-png/carat-r-white.png"); /* or your theme's icon sprite */
    background-repeat: no-repeat;
    width: 20px;
    height: 20px;
    border-radius: 50px;
    background-position: center;
    background-color: #707070;
    position: absolute;
    z-index:1001;
    top:15px;
    right: 15px;
    pointer-events: none;
}
#railPurposeAndScopeLinks ul li::after,
#railPurposeAndScopeLinksTwo ul li:last-child::after,
#railSAFEButtons ul li::after {
   background-image: url("/webapp/css/images/icons-png/External_link_icon.png") !important; /* or your theme's icon sprite */ 
   background-size: 30px;
   border-radius: 0 !important;
   filter: brightness(0) invert(1);
}

#railActionButtons .redButtons a,
#railRisksLinks ul li:first-child::after {
    background-color: var(--red) !important;
}
#buttonsContainer ul li::after,
#railSAFEButtons ul li::after,
#responderActButOne ul li::after,
#railActionButtons ul li::after,
#railPurposeAndScopeLinksTwo ul li::after,
#railPurposeAndScopeLinks ul li::after,
#railGuidanceButtons ul li::after,
#railTouchThirdRailLinks ul li::after,
#railDirectCurrentLinks ul li::after,
#railOverheadLineLinks ul li:first-child::after {
    background-color: transparent !important;
}
#railThinkResilBtnText {
    position: relative;
    width:200px;
    font-weight: normal !important;
    font-family: var(--defaultBoldFont) !important;
}
 
#railThinkResilBtnText::after {
    content: "";
    display: inline-block;
    background-image: url("/webapp/css/images/icons-png/External_link_icon.png") !important; /* or your theme's icon sprite */ 
    background-repeat: no-repeat;
    width: 20px;
    height: 20px;
    border-radius: 0px;
    background-position: center;
    position: absolute;
    z-index:1001;
    top:10px;
    right: 15px;
    pointer-events: none;
    background-size: 30px;
    
    filter:brightness(0) saturate(100%) invert(11%) sepia(50%) saturate(7463%) hue-rotate(-1deg) brightness(96%) contrast(105%);
}
.info-go {
    font-weight: normal !important;
    font-family: var(--defaultBoldFont) !important;
}