/*** BASIC ELEMENTS ***/

  * {
    margin:0;
    padding:0;
    font-family:'Arial',sans-serif;
  }

  body {
    font-size:9.75pt;
  }

  hr {
    border:none;
    height:1px;
    border-top:1px solid #e5e5e5;
    margin:20px 0px;
    clear:both;
  }

  br {
    clear:both;
  }

/* TEXT FORMATTING */

  h1, h2, h3, h4, h5, h6 {
    margin:5px 0px;
    font-weight:normal;
  }

  h1 { font-size:28pt; }
  h2 { font-size:20pt; }
  h3 { font-size:16pt; }
  p { margin:10px 0px; }

  small {
    color:#858585;
    font-size:70%;
  }

  a {
    text-decoration:none;
    color:#F97A24;
  }

  a:active {
    text-decoration:none !important;
  }

  a:hover {
    text-decoration:underline;
    color:#F97A24;
  }

  a .mdi {
    color:#163241;
  }

  a:hover .mdi {
    color:#fff;
  }

  a.priority_low_today, a.priority_low_today .mdi {
    color:#ccc !important;
  }

  .center {
    text-align:center;
  }

  .b { font-weight:bold; }
  .i { font-style:italic; }
  .bi { font-weight:bold; font-style:italic; }

/* TABLES */

  table {
    border-collapse: collapse;
    min-width:200px;
  }
  td, th {
    padding:5px;
    text-align:left;
    border-bottom:1px solid #f0f0f0;
  }
  tr:last-of-type td {
    border-bottom:none;
  }
  thead tr:last-of-type td {
    font-weight:bold;
    border-bottom:1px solid #8CB8DE;
  }

  th {
    font-weight:bold;
    background:#f0f0f0;
  }
  .rows tr:nth-child(even) {
    background-color: #f8f8f8;
  }
  .borderless, .borderless td, .borderless th {
    border:none;
  }
  .sep {
    margin:0px 15px;
    opacity: 0.25;
  }
  fieldset {
    border:1px solid #E8E8E8;
    border-radius:2px;
    padding:20px 30px 25px 20px;
    margin:30px 0px 20px 0px;
  }
  legend {
    padding:0px 10px;
    color:#5C6770;
  }

/*** CONTENT ***/

  .dot:after {
    content:'•';
    margin:0px 7px;
  }

/*** FORMS ***/

  form table td {
    border:none;
    padding:2px 6px;
  }

  input[type=text], input[type=password], input[type=email], input[type=date], input[type=button].dateSelect, textarea, select {
    font-size:9.75pt;
    color:#333;
    background:#f6f6f6;
    padding:6px 6px;
    border:1px solid #f3f3f3;
    margin:5px 0px;
  }
  select {
    padding:6px 6px 5px 6px;
  }

  textarea {
    min-height:100px;
  }
  input {
    margin:5px 0px;
  }
  input[type=file] {
    padding-top:6px;
  }
  input[type=checkbox], input[type=radio] {
    margin-top:5px;
  }
  label {
    margin:5px;
    display:inline-block;
    min-width:60px;
  }
  option {
    padding:0px 6px;
  }

/*** DROP-DOWN MENUS ***/

  .noBorder .dropbtn {
    border:none;
  }

  .dropbtn {
    margin:0px;
    list-style-type:none;
    display:inline-block;
    color:#333;
    background:#fff;
    padding:8px 18px 7px 18px;
    border:1px solid #e5e5e5;
    border-radius:0px;
    border-right-width:0px !important;
    cursor:default;
  }
  .dropdown:first-of-type .dropbtn {
    border-radius:0px;
  }
  .dropdown:last-of-type .dropbtn {
    border-radius:0px;
    border-right-width:1px !important;
  }

  .dropdown {
    position: relative;
    display: inline-block;
    float:left;
    margin:0px;
    list-style-type:none;
    cursor:default;
  }

  .dropdown-content {
    display: none;
    position: absolute;
    left:0px;
    background-color: #fff;
    min-width: 150px;
    max-width: 250px;
    margin-left:0px;
    width:auto;
    border:1px solid #e5e5e5;
    border-radius:0px;
    list-style-type:none;
    box-shadow:3px 3px 10px rgba(0,0,0,0.1);
    cursor:default;
    z-index:1000;
  }

  .dropdown-content a {
    text-decoration: none;
    display:block;
    padding:12px 14px;
    color:#333;
    cursor:default;
  }

  .dropdown-content a:hover {
    color:#fff !important;
    background-color:#163241;
    text-decoration:none;
    cursor:default;
  }

  .dropdown:hover .dropdown-content {
    display: block;
  }

  .dropdown:hover .dropbtn {
    text-decoration:none;
    cursor:default;
  }

  .dropdown-content h6 {
    font-size:10.5pt;
    padding:8px 16px;
    margin:0;
    color:#888;
  }

  .separator {
    display:block;
    border-top:1px solid #e5e5e5;
    height:1px;
    margin-top:0px;
  }

/*** ALERTS ***/

  .alert {
    border-radius: 0px;
    margin-bottom: 20px;
    padding: 15px;
    cursor:pointer;
    display:inline-block;
    font-size:10.5pt;
  }

  .alert-green {
    color:#3c763d;
    background-color:#dff0d8;
    border:1px solid #d6e9c6;
  }

  .alert-blue {
    color:#31708f;
    background-color:#d9edf7;
    border:1px solid #bce8f1;
  }

  .alert-yellow {
    color:#8a6d3b;
    background-color:#F8EEB9;
    border:1px solid #F7DFB0;
  }

  .alert-red {
    color:#a94442;
    background-color:#f2dede;
    border:1px solid #ebccd1;
  }

  .alert-green strong, .alert-green em, .alert-green span { color:#3c763d; }
  .alert-blue strong, .alert-blue em, .alert-blue span { color:#31708f; }
  .alert-yellow strong, .alert-yellow em, .alert-yellow span { color:#8a6d3b; }
  .alert-red strong, .alert-red em, .alert-red span { color:#a94442; }

/*** BUTTONS ***/

  .btn {
    display:inline-block;
    color:#333;
    background:#fff;
    padding:7px 18px;
    border:1px solid #e9e9e9;
    border-radius:0px;
    font-size:10pt;
    cursor:default;
  }

  .btn:first-of-type {
    margin-left:0;
  }

  .btn:hover {
    color:#222;
    background:#f3f3f3;
    text-decoration:none;
    border:1px solid #D9D9D9;
  }

  .white {
    color:#333;
    background:#fff;
    border:1px solid #e5e5e5;
  }

  .white:hover {
    color:#222;
    background:#f3f3f3;
    border:1px solid #D9D9D9;
  }

  .blue {
    color:#fff;
    background-color:#F97A24;
    border:1px solid #EF6306;
  }

  .blue:hover {
    color:#fff;
    background-color:#EF6306;
    border:1px solid #E05D06;
  }

  .cyan {
    color:#fff;
    background-color:#5BC0DE;
    border:1px solid #45B6D9;
  }

  .cyan:hover {
    color:#fff;
    background-color:#30AED5;
    border:1px solid #289FC3;
  }

  .green {
    color:#fff;
    background-color:#5CB85C;
    border:1px solid #4CAE4C;
  }

  .green:hover {
    color:#fff;
    background-color:#449C44;
    border:1px solid #3D8A3D;
  }

  .yellow {
    color:#fff;
    background-color:#F0AD4E;
    border:1px solid #EDA135;
  }

  .yellow:hover {
    color:#fff;
    background-color:#EB961E;
    border:1px solid #DD8913;
  }

  .red {
    color:#fff;
    background-color:#D9534F;
    border:1px solid #D4403A;
  }

  .red:hover {
    color:#fff;
    background-color:#C9312C;
    border:1px solid #B42C27;
  }

  .wide {
    padding-left:25px;
    padding-right:25px;
  }

/*** LAYOUT ***/

  .col1 { width:16.6666%; }
  .col2 { width:33.3333%; }
  .col3 { width:50%; }
  .col4 { width:66.6666%; }
  .col5 { width:83.3333%; }
  .col1,.col2,.col3,.col4,.col5 { display:block; float:left; }
  .clr { clear:both; }

  .left { float:left; }
  .right { float:right; }

  .w10p { width:10%; }
  .w20p { width:20%; }
  .w25p { width:25%; }
  .w30p { width:30%; }
  .w40p { width:40%; }
  .w50p { width:50%; }
  .w60p { width:60%; }
  .w70p { width:70%; }
  .w75p { width:75%; }
  .w80p { width:80%; }
  .w90p { width:90%; }
  .w100p { width:100%; }

  .w100 { width:100px; }
  .w110 { width:110px; }
  .w120 { width:120px; }
  .w150 { width:150px; }
  .w200 { width:200px; }
  .w250 { width:250px; }
  .w300 { width:300px; }
  .w350 { width:350px; }
  .w400 { width:400px; }
  .w450 { width:450px; }
  .w500 { width:500px; }
  .w550 { width:550px; }
  .w600 { width:600px; }
  .w650 { width:650px; }
  .w700 { width:700px; }
  .w750 { width:750px; }
  .w800 { width:800px; }
  .w850 { width:850px; }
  .w900 { width:900px; }

  .pad5  { padding:5px; }
  .pad10 { padding:10px; }
  .pad20 { padding:20px; }
  .pad25 { padding:25px; }
  .pad30 { padding:30px; }

/* FLOATING WINDOW */

  .window {
    box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.1);
    background:#fff;
    display:none;
    margin:auto;
    min-width: 200px;
    min-height: 50px;
    position:fixed;
    z-index:10;
  }

  .windowTitle {
    color:#fff;
    cursor:move;
    display:block;
    font-size:12pt;
    padding:12px 15px 11px 15px;
    position:relative;
    width:auto;
    background:#0D1D26;
    transition:ease 200ms;
    font-family:'Raleway',sans-serif;
    border:1px solid #1B3D50;
  }
  .windowContent {
    padding:15px;
  }
  .windowClose {
    width:32px;
    height:32px;
    padding:13px 0px 10px 0px;
    line-height:0;
    font-size:24pt;
    text-align:center;
    color:#fff;
    position:absolute;
    z-index:2;
    top:8px;
    right:8px;
    cursor:default;
    text-decoration:none;
    font-weight:normal;
    border-radius:25px;
    border:1px solid transparent;
  }
  .windowClose:hover {
    color:#fff;
    text-decoration:none;
    border:1px solid #556168;
  }
  .windowButtons {
    clear:both;
    border-top:1px solid #f0f0f0;
    text-align:right;
    padding-top:10px;
    margin-top:10px;
  }
  .windowButtons .btn:first-of-type {
    margin-right:5px;
  }


/* MISC */
  #menu {
    position:relative;
    float:right;
  }

  .table_btn {
    display:inline-block;
    position:relative;
    width:32px;
    height:32px;
    border:none;
    margin-bottom:-3px;
    cursor:default;
    border-radius:35px;
    background-color:#f6f6f6;
  }

  .btn_contact       { background:url(../img/btn_contact.png) center center no-repeat #f6f6f6; }
  .btn_contact:hover { background:url(../img/btn_contact_white.png) center center no-repeat #163241; }
  .btn_phone         { background:url(../img/btn_phone.png) center center no-repeat #f6f6f6; border-radius:20px !important; margin-right:5px; }
  .btn_phone:hover   { background:url(../img/btn_phone_white.png) center center no-repeat #163241; }
  .btn_mail          { background:url(../img/btn_mail.png) center center no-repeat #f6f6f6; border-radius:20px !important; }
  .btn_mail:hover    { background:url(../img/btn_mail_white.png) center center no-repeat #163241; }
  .btn_task          { background:#f6f6f6; text-align:center; padding-top:4px; }
  .btn_task:hover    { background:#163241; color:#fff; }
  .btn_note          { background:url(../img/btn_note.png) center center no-repeat #f6f6f6; }
  .btn_note:hover    { background:url(../img/btn_note_white.png) center center no-repeat #163241; }
  .btn_link          { background:url(../img/btn_link.png) center center no-repeat #f6f6f6; }
  .btn_link:hover    { background:url(../img/btn_link_white.png) center center no-repeat #163241; }
  .btn_url           { background:url(../img/btn_url.png) center center no-repeat #f6f6f6; }
  .btn_url:hover     { background:url(../img/btn_url_white.png) center center no-repeat #163241; }
  .btn_restore       { background:url(../img/btn_restore.png) center center no-repeat #f6f6f6; margin-right:5px; }
  .btn_restore:hover { background:url(../img/btn_restore_white.png) center center no-repeat #449C44; }
  .btn_trash         { background:url(../img/btn_trash.png) center center no-repeat #f6f6f6; }
  .btn_trash:hover   { background:url(../img/btn_trash_white.png) center center no-repeat #cc0000; }
  .btn_user          { background:url(../img/btn_user.png) center center no-repeat #f6f6f6; }
  .btn_user:hover    { background:url(../img/btn_user_white.png) center center no-repeat #163241; }
  .protected         { background:url(../img/icon_protected.png) center center no-repeat; }

  .btn_mail          { background:url(../img/btn_mail_grey.png) center center no-repeat #f6f6f6; }
  .btn_mail:hover    { background:url(../img/btn_mail_white.png) center center no-repeat #163241; }

  .menu_today          { background:url(../img/menu_today_white.png) 13px center no-repeat #0D1D26; color:#fff; }
  .menu_today:hover    { background:url(../img/menu_today_white.png) 13px center no-repeat #F97A24; text-decoration:none; color:#fff; }
  .menu_calendar       { background:url(../img/menu_calendar_white.png) 13px center no-repeat #0D1D26; color:#fff; }
  .menu_calendar:hover { background:url(../img/menu_calendar_white.png) 13px center no-repeat #F97A24; text-decoration:none; color:#fff; }
  .menu_tasks          { background:url(../img/menu_tasks_white.png) 13px center no-repeat #0D1D26; color:#fff; }
  .menu_tasks:hover    { background:url(../img/menu_tasks_white.png) 13px center no-repeat #F97A24; text-decoration:none; color:#fff; }
  .menu_contacts       { background:url(../img/menu_contacts_white.png) 13px center no-repeat #0D1D26; color:#fff; }
  .menu_contacts:hover { background:url(../img/menu_contacts_white.png) 13px center no-repeat #F97A24; text-decoration:none; color:#fff; }
  .menu_notes          { background:url(../img/menu_notes_white.png) 13px center no-repeat #0D1D26; color:#fff; }
  .menu_notes:hover    { background:url(../img/menu_notes_white.png) 13px center no-repeat #F97A24; text-decoration:none; color:#fff; }
  .menu_links          { background:url(../img/menu_links_white.png) 13px center no-repeat #0D1D26; color:#fff; }
  .menu_links:hover    { background:url(../img/menu_links_white.png) 13px center no-repeat #F97A24; text-decoration:none; color:#fff; }
  .menu_trash          { background:url(../img/menu_trash_white.png) 13px center no-repeat #0D1D26; color:#fff; }
  .menu_trash:hover    { background:url(../img/menu_trash_white.png) 13px center no-repeat #F97A24; text-decoration:none; color:#fff; }
  .menu_settings       { background:url(../img/menu_settings_white.png) 13px center no-repeat #0D1D26; color:#fff; }
  .menu_settings:hover { background:url(../img/menu_settings_white.png) 13px center no-repeat #F97A24; text-decoration:none; color:#fff; }
  .menu_users          { background:url(../img/menu_users_white.png) 13px center no-repeat #0D1D26; color:#fff; }
  .menu_users:hover    { background:url(../img/menu_users_white.png) 13px center no-repeat #F97A24; text-decoration:none; color:#fff; }

  .menu_keys           { background:url(../img/menu_keys_white.png) 13px center no-repeat #0D1D26; color:#fff; }
  .menu_keys:hover     { background:url(../img/menu_keys_white.png) 13px center no-repeat #F97A24; text-decoration:none; color:#fff; }
  .menu_mail           { background:url(../img/menu_mail_white.png) 13px center no-repeat #0D1D26; color:#fff; }
  .menu_mail:hover     { background:url(../img/menu_mail_white.png) 13px center no-repeat #F97A24; text-decoration:none; color:#fff; }

.calendarDate {
  display:inline-block;
  width:80px;
  text-align:center;
  padding-top:0px;
  padding-bottom:10px;
  background:#f9f9f9;
  color:#444;
  border-radius:2px;
  border-top:15px solid #163241;
  text-shadow: 1px 1px 2px #D9D9D9;
  box-shadow:0px 0px 3px rgba(0,0,0,0.15);
  margin-bottom:30px;
}
.calendarDate:hover {
  background:#fff;
  border-top:15px solid #F97A24;
  cursor:default;
}
.calendarDate .date {
  font-size:28pt;
}
.calendarDate .day {
  font-size:8pt;
  letter-spacing:0.35px;
}

/*** MOD_CALENDAR ***********************************************************************/
/*******************************Calendar Top Navigation*********************************/
div#calendar{
  margin:0px auto 0px auto;
  padding:0px;
  width: 100%;
}

div#calendar div.box{
  position:relative;
  height:40px;
}

div#calendar div.header, #yearCal .header {
  display:flex;
  justify-content:space-between;
}

div#calendar div.header a.prev, div#calendar div.header a.next, #yearCal .header  a.prev, #yearCal .header  a.next {
  cursor:pointer;
  text-decoration:none;
  color:#FFF;
  padding:10px;
  font-weight:normal;
}

div#calendar div.header span.title, #yearCal div.header span.title {
  color:#FFF;
  font-size:18px;
  padding:7px;
  font-weight:normal;
}
#yearCal th {
  padding:0;
}
.yearlyCalendar th {
  padding:5px !important;
}
.yearlyCalendarDiv {
  margin:5px;
  height:281px;
  background:#f9f9f9;
  outline:0px solid #EAEDF1;
}

.yearlyCalendarDiv:hover {
  outline:4px solid #F97A24;
  cursor:default;
}
.yearlyCalendarDiv:hover th {
  background:#F97A24;
}

/*******************************Calendar Content Cells*********************************/
div#calendar div.box-content{
}

div#calendar table.lab {
  margin: 0px;
  padding: 0px;
  width:100%;
  table-layout: fixed;
}

div#calendar table.lab td {
  border:1px solid #eee;
}
div#calendar table.lab thead td {
  text-align:center;
  font-size:13px;
  font-weight:normal;
  background:#E9EEF1;
  border-bottom:1px solid #DDE8EE;
}
div#calendar a:hover {
  text-decoration:none;
}

div#calendar table.lab tbody td{
  margin:0px;
  padding:5px;
  vertical-align:top;
  text-align:right;
  color:#000;
  background-color: #fff;
}

div#calendar table.lab tbody td:first-of-type{
  transition: linear 100ms;
}

div#calendar table.lab tbody tr:hover td:first-of-type{
  border-left:10px solid #F97A24;
}

div#calendar table.lab tbody .mask {
  background:#f9f9f9;
}
.dayNum {
  display:inline-block;
  padding:7px;
  font-size:11pt;
  color:#333;
}
.dayNum:hover {
  font-weight:bold;
  cursor:pointer;
}
.tasksList {
  height:120px;
  overflow:auto;
}

div#calendar .dates table {
  width:100%;
}

div#calendar .dates{
  margin: 0px;
  padding: 0px;
}

div#calendar .dates td{
  margin:0px;
  padding:0px;
  vertical-align:middle;
  height:80px;
  font-size:25px;
  background-color: #DDD;
}

div#calendar table.lab tr td:first-of-type {
  border-left:none;
}
div#calendar table.lab tr td:last-of-type {
  border-right:none;
}

:focus{
  outline:none;
}

div.clear{
  clear:both;
}
.calendarTask {
  display:block;
  margin-top:1px;
  font-size:9pt;
  background:#f5f5f5;
  border:none;
  padding:2px 6px;
  text-align:left;
  color:#163241;
}
.calendarTask .priority_high {
  display:inline-block;
  color:#F97A24;
  font-family: 'Open Sans', sans-serif;
  font-size:10pt;
  padding:0 4px 0 0;
}
.calendarTask .priority_normal {
  display:inline-block;
  font-size:9pt;
  padding:0;
}
.calendarTask .priority_low {
  display:inline-block;
  color:#005D8F;
  font-family: 'Open Sans', sans-serif;
  font-size:9pt;
  padding:0 0 0 0;
  margin-right:5px;
  margin-left:0px;
  opacity:50%;
}
.calendarAnniversary {
  display:block;
  margin-top:1px;
  font-size:9pt;
  background:#FBF5D5;
  padding:4px 6px;
  text-align:left;
  color:#163241;
}
.calendarTask:hover, .today .calendarTask:hover, .calendarAnniversary:hover, .today .calendarAnniversary:hover {
  background:#1C303B !important;
  color:#fff;
  text-decoration:none;
  cursor:default;
}
div[id^=hr] {
  position:absolute;
  height:1px;
}
div[id^=hr] a {
  float:left;
  background-color:rgba(209, 219, 224, 0.20);
}
div#am7 {
  position:relative;
  top:350px;
}

.hrTask {
  display:inline-block;
  height:25px;
  float:left;
  position:relative;
}

.hrTask .calendarTask, .hrTask .calendarAnniversary {
  display:inline-block;
  float:left;
  margin:0px 0px 0px 4px;
  padding:3px 8px 4px 8px;
  width:300px;
  overflow:hidden;
}

.weekend {
  color:#F97A24 !important;
}
.weekend .dayNum {
  color:#F97A24 !important;
}
.today {
  background:#0D1D26 !important;
  color:#fff !important;
}
.today .calendarTask {
  display:block;
  margin-top:1px;
  font-size:9pt;
  padding:2px 5px;
  text-align:left;
  background:#2E4856 !important;
  color:#fff !important;
}
.today .calendarTask:hover {
  background:#39586A !important;
}
.today .dayNum {
  color:#fff;
}

.yearlyCalendar {
  width:100%;
  table-layout:fixed;
  cursor:default;
}

.yearlyCalendar td, .yearlyCalendar tr:last-of-type td {
  text-align:right;
  vertical-align:top;
  font-size:8pt;
  border:1px solid #eee !important;
  padding:4px 7px 17px 13px;
  background:#fff;
}
.yearlyCalendar .dayNames td {
  font-weight:bold;
  text-align:center;
  padding:5px;
  background:#E9EEF1;
  border-bottom:1px solid #DDE8EE;
  border:none;
}

.yearlyCalendar th {
  text-align:center;
  font-size:11pt;
  font-weight:normal;
  color:#fff;
  background:#0D1D26;
}
#dataTable_wrapper {
  clear:both;
}
.mobile-red {
  color:#fff !important;
  background:#C9312C;
  text-align:center;
}
.mobile-green {
  color:#fff !important;
  background:#449C44;
  text-align:center;
}
.pagination a {
  cursor:default;
}

.priority_high {
  background:#FDE6AF !important;
}
.priority_normal {
}
.priority_low {
  opacity:0.5;
}

.priority_high_today {
  border:1px solid #F97A24;
}
.priority_normal_today {
  color:#333 !important;
}
.priority_low_today {
  color:#ccc !important;
}

.today .priority_high {
  color:#FBC956 !important;
}

.today .priority_low {
  color:#668799 !important;
}

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

@media screen and (max-width: 800px) {
/*** LAYOUT ***/
  .col1,.col2,.col3,.col4,.col5 { width:100%; }
}