@font-face {
      font-family: "Myriad Pro";
      src: url("/assets/fonts/MyriadPro-REGULAR.otf");
      }
      @font-face {
      font-family: "Myriad Pro Bold";
      src: url("/assets/fonts/MyriadPro-BOLD.otf");
      }
      @font-face {
      font-family: "Myriad Pro Light";
      src: url("/assets/fonts/MyriadPro-Light.otf");
      }
      @font-face {
      font-family: "Myriad Pro Semi Bold";
      src: url("/assets/fonts/MyriadPro-Semibold.otf");
      }
      
    .loginInput {width:360px;height:30px;background-color:#e8f0fe;border:2px solid #e5e5e5;border-radius: 3px;color:gray;padding:5px;font-family: 'Myriad Pro';font-size:14px;letter-spacing: .2px;}
    .loginInput::placeholder {color:#999999;}
    .loginInput:placeholder-shown {background-color: white;}
    input, textarea {border:1px solid #e5e5e5;padding:4px;border-radius: 3px;font-family:'Myriad Pro Light';letter-spacing: .2px;}
    input::placeholder, textarea::placeholder {color:#999;}
    input:focus, textarea:focus {outline:2px solid #4a9cdb;}
    #searchForm input{border:1px solid #e5e5e5;padding:4px;border-radius: 3px;font-family:'Myriad Pro Light';letter-spacing: .2px;width: 150px;font-size: 12px;}
    #searchForm input[type=submit],#searchForm input[type=button]{font-family: 'Myriad Pro';width:auto;padding-left:9px;padding-right:9px;padding-bottom:4px;padding-top:7px;border-radius:5px;border:0;letter-spacing: .2px;}
    .filterInput {min-height:50px;margin-left:10px;font-weight: bold;}
    .loginButton {background-color:#4a9cdb;border:0;color:white;width:360px;height:40px;border-radius: 5px;font-size:medium;cursor: pointer;margin-bottom:10px;font-family: 'Myriad Pro';font-weight: bold;letter-spacing: 1px;}
    .loginButton:hover {background-color: #37fb2;}
    .loader-container {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 120px; }

.loader {
  border: 10px solid #f3f3f3;
  border-radius: 50%;
  border-top: 10px solid #3498db;
  width: 50px;
  height: 50px;
  -webkit-animation: spin 2s linear infinite;
  /* Safari */
  animation: spin 2s linear infinite; }

  @keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

.caret {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: 2px;
    vertical-align: middle;
    border-top: 4px dashed;
    border-top: 4px solid\9;
    border-right: 4px solid transparent;
    border-left: 4px solid transparent;
}
.caretDown{}
.caretRight{transform: rotate(-90deg);}
.caretLeft{transform: rotate(90deg);}
.caretUp{transform: rotate(-180deg);}

        .openCaret {
            width: 10.8px;
            height: 14.4px;
            position: relative;
            cursor: pointer;
            transition: transform 0.3s ease;

        }
        .openCaret::before,
        .openCaret::after {
            content: '';
            position: absolute;
            background-color: #CCCCCC;
            width: 8.2px;  /* increase or decrease for better alignment based on line thickness */
            height: 3.2px;
            right: 0;
        }
        .openCaret::before {
            top: 3.8px;
            transform: rotate(-45deg);
            transform-origin: bottom right;
        }
        .openCaret::after {
            bottom: 3.8px;
            transform: rotate(45deg);
            transform-origin: top right;
        }
        .openCaretDown {
            transform: rotate(90deg);
        }
        .openCaretRight {}

        .bluecaret-down {
            width: 12px;
            height: 14.4px;
            position: relative;
        }
        .bluecaret-down::before,
        .bluecaret-down::after {
            content: '';
            position: absolute;
            top: 0;
            width: 7.9px;
            height: 3.2px;
            background-color: #499cdb;
        }
        .bluecaret-down::before {
            left: -0.8px;
            transform: rotate(45deg);
            transform-origin: 100% 50%;
        }
        .bluecaret-down::after {
            right: -0.8px;
            transform: rotate(-45deg);
            transform-origin: 0% 50%;
        }

.menuItem {float:left;height:70px;padding:20px;padding-top:25px;text-align: center;cursor: pointer;font-size:14px;}
.menuItem:hover {border-bottom:4px solid #faa340;background-color:#f5f5f5;height:70px;transition: border-bottom .5s ease-in;}
.menuSubItem {padding: 15px;font-size: 12px;border-bottom:1px solid #999;cursor: pointer;background-color: white;white-space: nowrap;}
.menuSubItem:hover {background-color:#f5f5f5;}
.tableList {width:100%;background-color: #f9f9f9;}
.tableList th {background-color: #4a9cdb;color:white;font-size: 13px;padding-top:10px;padding-bottom: 10px;cursor: pointer;text-align: left;padding-left:10px;white-space: nowrap;font-weight: 400;font-family: 'Myriad Pro';}
.tableList th:hover {background-color:#337fb2;}
.tableList tr:hover td {background-color:#f5f5f5;}
.tableList td {padding:7px;font-size: 13px;padding-left:10px;}
.updateButton{background-color:#4a9cdb;border:0;color:white;padding:10px;border-radius:3px;margin-left:10px;cursor:pointer;font-family: 'Myriad Pro';font-size: 12px;}
.updateButton:hover{background-color: #337fb2;}
a {color:#4a9cdb;text-decoration: none;}
.pageNumber {float:left;background-color:#f5f5f5;border-radius: 3px;padding:8px;color:#4c4c4c;margin-left: 3px;cursor: pointer;font-size:12px;margin-top:4px;border:0;height:25px;font-weight: 600;}
.pageNumber:hover {color:white;background-color:#4a9cdb;}
.selectedPageNumber {float:left;background-color:#4a9cdb;border-radius: 3px;padding:7px;color:white;margin-left: 3px;font-size:11px;margin-top:4px;border:0;height:25px;}
.alert {color:#999;font-size:medium;position:absolute;margin-right:20px;right:0;background-color: white;border-radius:5px;box-shadow: 5px 5px 5px gray;text-align: left;width:300px;}
.grayButton{background-color:#e9e9e9;border:0;color:#999;padding:10px;border-radius:3px;margin-left:10px;cursor:pointer;font-family: 'Myriad Pro';font-size:12px;}
.grayButton:hover{background-color: #dcd9d9;}
.orangeButton{background-color:#faa340;border:0;color:white;padding:7px;border-radius:3px;margin-left:10px;cursor:pointer;font-family: 'Myriad Pro';font-size:14px;}
.orangeButton:hover{background-color: #f47b20;}
.tableActions{color:#4a9cdb;background-color: #e9e9e9;padding:5px;height:30px;border-radius: 2px;border:0;font-family: 'Myriad Pro';letter-spacing: .2px;font-size:13px; font-weight: 400;}
.tableActions * {background-color: white;color:#999;font-family: 'Myriad Pro';letter-spacing: .2px;font-size:12px;}

/*
.tableActions {    
    background: url(/assets/img/blueDownArrow.png) no-repeat left #e9e9e9;

    -webkit-appearance: none;
    background-position-x: 10px;padding-left:25px;
background-size:11px 27px;} */
.dropTable tr:hover td {background-color: #f5f5f5;}
.dropTable td {padding:5px;color:gray;font-family:'Myriad Pro Light';}


.modal-header {background-color:#e5e5e5;padding:0;border-top-left-radius: 5px;border-top-right-radius: 5px;font-family: 'Myriad Pro';}

hr {margin-top: 20px;margin-bottom: 20px;border: 0;border-top: 1px solid #eee;}
.dropOptions {border-bottom-right-radius: 5px;border-bottom-left-radius: 5px;padding:10px;background-color: white;cursor: pointer;}
.dropOptions:hover {background-color: #337ab7;color:white;}
.downloadButton {padding:3px;border-radius: 3px;cursor: pointer;color:#4a9cdb;font-weight: bold;width:20px;text-align: center;}
.downloadButton:hover {background-color: #4a9cdb;color:#ffffff;}
.left {float:left;width:25%;border:1px solid lightgray;padding:10px;border-radius: 5px;}
.right {float:right;width:70%;}
select {padding:3px;border:1px solid lightgray;border-radius: 3px;}
.subHeaderMenu a {padding:10px;border:1px solid lightgray;border-radius: 5px;}
.subHeaderMenu a:hover {text-decoration: none;background-color: #337ab7;border-radius: 5px;padding:10px;color:white;}
.clearfix {margin-bottom:20px;}
.col-xs-6 {float:left;width:48%;margin:5px;}
.optionsDiv {margin:5px;}
        .control-container {
            max-width: 200px;
            
        }
        .control-group {
          
        }
        .control-label {
            font-weight: bold;
            
            display: block;
        }
        .button-group {
            display: flex;
            gap: 10px;
            justify-content: flex-start;
        }
        .button-group label {
            width: 60px;
            text-align: center;
            padding: 5.3px 0;
            background-color: #f0f0f0;
            font-family: 'Myriad Pro Light';
            font-size:12px;
            border-radius: 4px;
            cursor: pointer;
            transition: all 0.3s ease;
        }
        .button-group label:hover {
            background-color: #e9e9e9;
        }
        .button-group input[type="checkbox"] {
            display: none;
        }
        .button-group input[type="checkbox"]:checked + label {
            background-color: #4a9cdb;
            border-color: #0056b3;
            color: white;
        }

.switch {
            position: relative;
            display: inline-block;
            width: 24px;
            height: 13.6px;
            vertical-align: middle;
            margin-left: 5px;
            margin-right: 5px;
        }
        .switch input {
            opacity: 0;
            width: 0;
            height: 0;
        }
        .slider {
            position: absolute;
            cursor: pointer;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background-color: #ccc;
            transition: .4s;
            border-radius: 13.6px;
        }
        .slider:before {
            position: absolute;
            content: "";
            height: 10.4px;
            width: 10.4px;
            left: 1.6px;
            bottom: 1.6px;
            background-color: white;
            transition: .4s;
            border-radius: 50%;
        }
        input:checked + .slider {
            background-color: #2196F3;
        }
        input:focus + .slider {
            box-shadow: 0 0 1px #2196F3;
        }
        input:checked + .slider:before {
            transform: translateX(10.4px);
        }
        .filter-input {
            font-family: 'Myriad Pro', sans-serif;
            font-size: 12px;
            margin-bottom: 5px;
        }
        .account-manager-container {
            display: flex;
            align-items: center;
            margin-bottom: 5px;
        }
        .status-label {
            font-size: 10px;
            color: #666;
        }