/**************************************************************************
    Color Palettes (note dashes are to avoid replace-all here)
    WCS             Web         100%        Print       LightPrint
        Blue        #-0083AA;   #-0083AA;   #-006486;   #-D4E5EB;
        Green       #-92C856;   #-92C856;   #-7EBA31;   #-E9F3DC;
        Gray        #-A7A9AC;   #-A7A9AC;   #-8B8D8C;   #-EBECEC;

    BCM             Web         100%        Print       LightPrint
        Navy(Pri)   #-084062    #-244061;               #-80879A;
        Blue(Pri)   #-41BFEF    #-00C4FF;               #-ABDBF5;
        Yellow(2nd) #-D7DF23    #-D6DF23;               #-E9EC99;
        Orange(2nd) #-F15A29    #-F05A28;               #-F8A987;
        Purple(2nd)             #-91268F;               #-BC8CBE;
        Gray(2nd)   #-656565    #-646464;               #-B4B4B4;

    NOTE:  https://color-hex.org/color/XXXXX  //editor for particular color

    NOTE: Reference only.  Sticking with WCS colors
          as the BCM blues didn't look too great on 
          first try.

***************************************************************************/


html {
    overflow-y: auto;
}

body {
    font-family: "Arial", sans-serif;
    font-size:12px;
}

h1, h2, h3, h4, h5 {
    font-family: "Arial", sans-serif;
}

.wgtmsr {
    width: 100px;
}


/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}

.image-link {
    width: 200px;
    height: 54px;
    background-repeat: no-repeat;
    background-size: 200px 60px;
    background-image: url('../Images/BCM1-notag.png');
}

.image-link-large {
    width: 500px;
    height: 135px;
    background-repeat: no-repeat;
    background-size: 500px 135px;
    background-image: url('../Images/BCM1-notag.png');
}

/*.navbar, .navbar div, .navbar-brand, .navbar-header {
     min-height: 40px;
     max-height: 100px;
     height: 500px;
  }*/
/* Set width on the form input elements since they're 100% wide by default */
input,
select,
textarea {
    max-width: 480px;
}

/* CSS used here will be applied after bootstrap.css */
/*@media (max-width: 767px) {
	.content {
		padding: 15px;
		margin-top: 10px;
	}
}*/

/*old font*/
/*
@font-face {
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 400;
  src: local('Raleway'), local('Raleway-Regular'), url(https://fonts.gstatic.com/s/raleway/v11/0dTEPzkLWceF7z0koJaX1A.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}
*/



@font-face {
    font-family: 'Arial';
    /*src: url('../fonts/Raleway-Regular.eot');*/
    /*src: url('../fonts/Raleway-Regular.eot?#iefix') format('embedded-opentype'), url('../fonts/Raleway-Regular.woff') format('woff'), url('../fonts/Raleway-Regular.ttf') format('truetype'), url('../fonts/Raleway-Regular.svg#Raleway') format('svg');*/
}

.fontpro, .fontpro-35199 {
    font-family: Arial,sans-serif;
}

.nav-brand > h3 {
    margin-top: 0;
    margin-bottom: 0;
}

table {
    border-collapse: separate !important;
    border-spacing: 0;
}

.well {
    box-shadow: 0 0 20px black;
}

.hidden {
    display: none;
}

.wcs-windows-logo {
    width: 25px;
    height: 25px;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url('../Images/WindowsLogoSquare.png');
    cursor: pointer;
    position: relative;
    top: 8px;
}

.myform input.form-control {
    display: block; /* allows labels to sit on input when inline */
    margin-bottom: 15px; /* gives padding to bottom of inline inputs */
}

.login-form-control {
    width: 90%;
    max-width: unset;
}

/**this to make a label show the asterisk when required*/

.required:after {
    color: red;
    content: ' *';
    display: inline;
    font-weight: bold;
}

.blank_space:after {
    content: '\00a0\00a0';
    display: inline;
}

.blank_space:before {
    content: '\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0';
    display: inline;
}

/* ALIGN GRID ACTION ICONS */
.img_grid_action {
    padding-left: 6px;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 20px;
    cursor: pointer;
}

.action-grid-cell {
    display: inline-block;
    border-left: 1px solid lightgray;
    padding-left: 12px;
}

.main-grid-create-button {
    position: relative;
    left: 10px;
    top: 20px;
    width: 40px;
    height: 25px;
    background-image: url("../Images/test3.png");
    background-repeat: no-repeat;
    background-position: center center;
    z-index: 100;
}

.hiddden {
    display: none;
}


.main-grid-header {
    font-size: 24px;
    font-weight: bold;
    background: lightgray;
    border: 1px solid gray;
    border-radius: 10px;
    padding: 5px;
    margin-top: 10px;
}

.main-grid {
    position: relative;
    top: -30px;
}

.details-area {
    display: none;  /* until a main-grid choice is selected*/
    padding:10px, 10px, 10px, 10px;
}

.collapse-area {
   width: 100%;
}

.collapse-area-icon {
    display: inline-block;
    cursor: pointer;
    margin-left: 3px;
    margin-bottom: 0;   /* undo bootstrap change to label*/
}

.collapse-area-icon-collapsed::after {
    content: '\25BA';    /* right triangle */
}

.collapse-area-icon-expanded::after {
    content: '\25BC';    /* down triangle */
}

.collapse-area-header {
    font-size: 16px;
    font-weight: bold;
    vertical-align: middle;
}

.collapse-area-body {
    padding-top: 0px;
    padding-left: 10px;
}

.border-around {
    border: 1px solid;
}

.border-right {
    border-right: 1px solid;
}

.fuzzy-border {
    border: 1px gray;
    border-radius: 10px;
    box-shadow: 0 0 10px black;
    margin: 5px 5px 15px 5px;
    padding: 10px 10px 20px 10px;
}

/*JQX Window overrides*/

.headerStyles {
    background-color: white;
    color: #656565; /* BCM Gray */
    font-size: 24px;
}

/*End JQX Window overrides*/

.wcs-blue-text {
    color:  #084062; /* BCM Navy */
}

.wcs-blue-text-hover:hover {
    color:  #084062; /* BCM Navy */
}

.wcs-blue-back {
    background-color:  #084062; /* BCM Navy */
}

.wcs-blue-back-hover:hover {
    background-color:  #084062; /* BCM Navy */
}

.wcs-green-text {
    color: #F15A29; /* BCM Orange */
}

.wcs-green-text-hover:hover {
    color: #F15A29; /* BCM Orange */
}

.wcs-green-back {
    background-color:  #F15A29; /* BCM Orange */
}

.wcs-green-back-hover:hover {
    background-color: #F15A29; /* BCM Orange */
}

.wcs-gray-text {
    color:  #656565; /* BCM Gray */
}

.wcs-gray-text-hover:hover {
    color:  #656565; /* BCM Gray */
}

.wcs-gray-back {
    background-color:  #656565; /* BCM Gray */
}

.wcs-gray-back-hover:hover {
    background-color:  #656565; /* BCM Gray */
}

.whitesmoke-background {
    background-color: whitesmoke;
}

.cust-sel-outer {
    padding: 5px;
    border-radius: 10px;
}

.cust-sel-header {
    font-weight: bold;
    font-size: 16px;
    padding-left: 10px;
}

.cust-sel-err-msg {
    color: #084062; /* BCM Navy */
    font-size: 24px;
    height: 200px;
    background-color: white;
    text-align: center;
}

.waiting {
    height: 100px;
    width: 250px;
    position: fixed;
    top: 50%;
    left: 50%;
    margin-top: -50px;
    margin-left: -125px;
    background-repeat: no-repeat;
    background-position: right center;
    background-size: contain;
    background-image: url("../Images/wcs_loading.gif");
    background-color:  whitesmoke;
    border: 5px solid #656565; /* BCM Gray */
    border-radius: 10px;
    display: none;
    padding-top: 27px;
    padding-left: 10px;
    z-index: 999;
}

.waiting::after {
    content: 'Loading...';
    color: #656565; /* BCM Gray */
    font-size: 24px;
}

.clear-when-waiting {

}

.ajax-loader-gif {
    background-image: url('../Images/ajax-loader.gif');
    height: 25px;
    width: 25px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    margin: 0 auto; /* center within parent */
}

.wide-horizon {
    overflow-x: auto;
    white-space: nowrap;
    padding: 3px 3px 3px 3px;
}

.portal-border-around {
    border: 1px solid #084062; /* BCM Navy */
}

.portal-border-no-left {
    border: 1px solid #084062; /* BCM Navy */
    border-left: none;
}

.portal-border-right {
    border-right: 1px solid #084062; /* BCM Navy */
}

.portal-border-left {
    border-left: 1px solid #084062; /* BCM Navy */
}

.portal-body-outer {
    border: 1px gray;
    border-radius: 10px;
    box-shadow: 0 0 10px black;
    margin: 3px 3px 3px 3px;
    padding: 3px 3px 3px 3px;
    background-color: whitesmoke;
}

.portal-body-inner {
    border-top: 2px solid #084062; /* BCM Navy */
    margin: 3px 3px 3px 3px;
    padding: 3px 3px 3px 3px;
    overflow: auto;
}

.portal-body-header {
    font-size: 18px;
    margin-left: 10px;
    color: #084062; /* BCM Navy */
}

.portal-body-noscroll {
    overflow: hidden;
}

.portal-file-get-msg {
    display: none;   /* only displayed when needed */
    color: #F15A29; /* BCM Orange */
    font-size: 16px;
    padding-left: 15px;
}

.inner-content-box {
    border-top: 2px solid #084062; /* BCM Navy */
    background-color: white;
    overflow: hidden;
}

.settings-zone {
    border: 1px solid gray;
    width: 100%;
    padding: 10px;
    margin: 10px;
    font-size: 14px;
    vertical-align: middle;
}

.settings-caption {
    color: #084062; /* BCM Navy */
}

.settings-note {
    font-size: 12px;
    color: #084062; /* BCM Navy */
    margin-left: 10px;
}

.settings-dropdown {
    width: 250px;
}

.error-text-area {
    font-size: 2.0em;
    color: darkred;
    max-width: 750px;
    width:750px;
    height: 200px;
    border: none;
    overflow: auto;
	text-align: center;
}

.mail-area {
    display: inline-block;
    position: relative;
}

.mail-icon {
    height: 32px;
    width: 32px;
    background-image: url('../Images/mail.png');
    cursor: pointer;
}

.mail-badge {
    background-color: red;
    color: white;
    border-radius: 4px;
    padding: 1px 3px;
    font-size: 10px;
    position: absolute;
    top: 0;
    right: 0;
    cursor: pointer;
}