﻿.neonText {
    color: yellow;
    text-shadow: 0 0 7px #fff, 0 0 10px #fff, 0 0 21px #fff, 0 0 42px #0fa, 0 0 82px #0fa, 0 0 92px #0fa, 0 0 102px #0fa, 0 0 151px #0fa;
    font-size: 4.2rem;
    animation: neonText 1.5s infinite alternate;
}

@keyframes neonText {

    0%, 18%, 22%, 25%, 53%, 57%, 100% {
        text-shadow: 0 0 4px #fff, 0 0 11px #fff, 0 0 19px #fff, 0 0 40px #0fa, 0 0 80px #0fa, 0 0 90px #0fa, 0 0 100px #0fa, 0 0 150px #0fa;
    }

    20%, 24%, 55% {
        text-shadow: none;
    }
}


body {
  font-family: Arial,sans-serif;
  font-size:12px;
  background-image:url(../Images/main_bg.jpg);
  background-repeat:repeat;
  background-size:cover;
  margin:0;
  padding:0;
}

.main-body {
    width:1200px;
    margin:0 auto;
    background-color:#ffffff;
}

header {
    background-color:#435159;
    overflow:hidden;
    padding:20px 25px;
}

.float-left {
    float:left;
}

.float-right {
    float:right;
}

.site-title {
    margin:0;
    padding:0;
}

#login {
    padding-top:50px;
}

#login span {
    color:#ffffff;
    font-size:14px;    
}

.username {
    color:#fff;
    text-transform:uppercase;
    font-size:15px;
    text-decoration:none;
}

#logoutForm {
    margin-top:10px;
}

.logoff-btn {
    border: 1px solid #00848f;
    outline: none;
    border-radius: 0;
    padding: 5px 20px;
    font-size: 13px;
    font-weight: 600;
    background: #00acba;
    color: #ffffff;
    -webkit-transition: all 0.5s ease;
    transition: all 0.5s ease;
    -webkit-appearance: none;
    text-decoration:none;
    font-family:Arial, sans-serif;
    float:right;
}

#nav-main {
    background-color:#00acba;
    height:50px;
}

#menu {
    padding:0;
    margin:0;
    width:100%;   
}





#menu li:first-child a {
    padding-left:40px;
}

#menu li:first-child a:hover {
    padding-left:40px;
}

#menu li a:hover {
    color:#fff;
    font-size:16px;
    text-decoration:none;
    padding:16px 20px 16px 20px;
    background-color:#0d5eb4;
    display:block;
}

#body {
    padding:20px 25px;
}

.report_tbl {
    width:100%;
    overflow:auto;
    
}

.mytimeEntry {
    width:1150px;
    border:1px solid #9c9c9c;
    /*top:5px;
    position:relative;*/
    border-collapse:collapse;
}

.mytimeEntry th {
    text-align: left;
    background-color: #828282;
    margin: 0;
    padding: 10px;
    border-right:1px #9c9c9c solid ;
}

.mytimeEntry th:last-child {
    border-right:none;
}

.mytimeEntry th a {
    font-size:15px;
    font-weight:bold;
    color:#efefef;
    text-decoration:none;
}

.mytimeEntry td {
    font-size:13px;
    padding:7px 10px;
    border-bottom:1px solid #9c9c9c;
    border-right:1px solid #9c9c9c;
}

.page-head {
    padding:0 0 10px 0;
    margin:0 0 10px 0;
    color:#00acba;
    font-size:20px;
    border-bottom:1px solid #9c9c9c;
}

.table-search {
    float:right;
    margin-bottom:10px;
}

.table-search span {
    font-size:14px;
}

.date-search {
    outline:none;
    padding:5px;
}

.submit-btn {
    border: 0;
    outline: none;
    border-radius: 0;
    padding: 7px 15px;
    margin-left:3px;
    font-size: 13px;
    font-weight: 600;
    background: #00acba;
    color: #ffffff;
    -webkit-transition: all 0.5s ease;
    transition: all 0.5s ease;
    -webkit-appearance: none;
    text-decoration:none;
    font-family:Arial, sans-serif;
    /*float:right;*/
    cursor:pointer;
}

.form-name {
    font-size:14px;
    width:60px;
}

.select-box {
    width:300px;
    padding:6px 5px;
    outline:none;
}

.searchbox {
    width:250px;
    outline:none;
    padding:7px 5px;
    border:1px solid #9c9c9c;
}

#tblAutoSelect {
    width:100%;
    border:1px solid #9c9c9c;
    border-collapse:collapse;
    position:relative;
    top:5px;
}

#tblAutoSelect td:first-child {
    width: 190px;
    padding: 7px 5px;
    font-size: 13px;
}

#tblAutoSelect td a {
    font-size: 13px;
    text-transform: uppercase;
    font-weight: bold;
    text-decoration:none;
    color:#000;
}

#tblAutoSelect td:last-child {
    font-size: 13px;
    text-transform: uppercase;
    font-weight: bold;
    text-decoration:none;
    color:#000;
}

#formAction {
    width: 200px;
    padding: 7px 5px;
}

.btnaction {
    border: 0;
    outline: none;
    border-radius: 0;
    padding: 8px 15px;
    margin-left:3px;
    font-size: 13px;
    font-weight: 600;
    background: #00acba;
    color: #ffffff;
    -webkit-transition: all 0.5s ease;
    transition: all 0.5s ease;
    -webkit-appearance: none;
    text-decoration:none;
    font-family:Arial, sans-serif;
    float:right;
    cursor:pointer;
}

.linkEngReport {
    position:relative;
    top:10px;
    font-size:14px;
    width:240px;
    float:left;
}

.linkEngReport a {
    color:#00acba ;
    font-size:15px;
}

.linkEngReport a:hover {
    color:#00acba ;
    font-size:15px;
    text-decoration:none;
}

#engActions {
    float:right;
}

.time-form {
    width:130px;
    font-size:13px;
}

.time-entry-table input[type='text'], input[type='date'], input[type='number'] {
    width:250px;
    outline:none;
    padding:7px 5px;
    border:1px solid #9c9c9c;
}

.time-entry-table textarea {
    width:350px;
    max-width:700px;
    outline:none;
    padding:7px 5px;
    height:70px;
    border:1px solid #9c9c9c;
}

.clientname {
    font-size:13px;
    text-transform:uppercase;
}

.save-btn {
    border: 1px solid #00848f;
    outline: none;
    border-radius: 0;
    padding: 5px 5px;
    font-size: 13px;
    font-weight: 600;
    background: #00acba;
    color: #ffffff;
    -webkit-transition: all 0.5s ease;
    transition: all 0.5s ease;
    -webkit-appearance: none;
    text-decoration:none;
    font-family:Arial, sans-serif;
}

.field-validation-error {
    font-size:12px;
    color:#ff0000;
}

footer {
    background-color:#435159;
    overflow:hidden;
    padding:12px 0;    
    text-align:center;
}

.content-wrapper div p {
    color:#fff;
}

.search_header {
    overflow:hidden;
}

.search_header label {
    float:left;
    position:relative;
    top:7px;
}

.search_header div {
    float:left;
    margin-right:5px;
}

.form-div {
    width:100%;
    margin-top:10px;
}

.form-div label {
    float:left;
}

.time-entry-table {
    overflow:hidden;
}

.linkAccount {
    font-size: 13px;
    text-transform: uppercase;
    font-weight: bold;
    color: #00acba !important;
    text-decoration: underline !important;
    cursor:pointer;
}

.linkEmployee {
    font-size: 13px;
    text-transform: uppercase;
    font-weight: bold;
    color: #00acba !important;
    text-decoration: underline !important;
    cursor:pointer;
}

.loading {
    position: fixed;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    background: rgba(0,0,0,0.5);
    display:none;
}

.loading > img {
    z-index:9999999;
    width:100px;
    height:100px;
    position: absolute;
    left: 45%;
    top: 40%;
}

.ui-autocomplete {
    max-height: 400px;
    overflow-y: auto;
    /* prevent horizontal scrollbar */
    overflow-x: hidden;
}
 /* IE 6 doesn't support max-height
* we use height instead, but this forces the menu to always be this tall
*/
* html .ui-autocomplete {
    height: 400px;
}

.ui-autocomplete-loading {
    background: white url("../Images/ui-anim_basic_16x16.gif") right center no-repeat;
}

.clearlink {
    cursor: pointer;
    display: none;
    position: relative;
    left: -25px;
    top: 3px;
    text-decoration: none;
}

a.clearlink:hover {
    background-color: white;
}

.popup_name {
    width:130px;
    font-size:13px;
    color:#000;
}

.popup_field {
    font-size:15px;
    text-transform:uppercase;
}

#tblDetails input[type='text'], input[type='date'], input[type='number'], input[type='password'] {
    width: 250px;
    outline: none;
    padding: 7px 5px;
    border: 1px solid #9c9c9c;
}

#tblDetails select {
    width: 260px;
    outline: none;
    padding: 7px 5px;
    border: 1px solid #9c9c9c;
}

#tblDetails textarea {
    width:300px;
    height:50px;
}

.validation-summary-errors {
    color: red;
    font-size: 14px;
    font-weight: bold;
}

.validation-summary-errors ul{
    list-style:none;
}

.from_div {
    margin-bottom:10px;
}

.from_div label {
    font-size:12px;
    color:#000;
    padding-bottom:7px;
    float:left;
    width:120px;
    padding-top:3px;
}

.popup_innerdiv input[type="text"] {
    width:65% !important;
    padding:4px 5px !important;
    border:1px solid #ccc !important;
    outline:none !important;
}

.datepicker_div {
   overflow:hidden;
   margin-bottom:10px;
}



.fromdate_div label {
    font-size:12px;
    color:#000;
    padding-bottom:7px;
    float:left;
    width:60px;
    padding-top:3px;
}

.fromdate_div div input[type="text"] {
    width:30% !important;
    padding:4px 5px !important;
    border:1px solid #ccc !important;
    outline:none !important;
    float:left !important;
}



.todate_div label {
    font-size:12px;
    color:#000;
    padding-bottom:7px;
    float:left;
    width:60px;
    text-align:right;
    padding-right: 10px;
    padding-top: 3px;
}

.todate_div div input[type="text"] {
    width:30% !important;
    padding:4px 5px !important;
    border:1px solid #ccc !important;
    outline:none !important;
    float:left !important;
}

/*table.table-autocomplete {
    width: 100%;
}
table.table-autocomplete thead tr {
    border-bottom: solid 1px #B6B6B6;
}
table.table-autocomplete thead tr th {
    padding: 5px;
}
table.table-autocomplete .ui-menu-item td {
    border-left: solid 1px #B6B6B6;
    padding: 5px;
}*/


@media only screen and (max-width: 1200px) {
.main-body {
    width: 100%;
    margin: 0 auto;
    background-color: #ffffff;
}
}


@media only screen and (max-width: 768px) {
.dynamic_div {
    margin-top:10px;
}

#engActions {
    float: left;
}
}

@media only screen and (max-width: 480px) {
.main-body {
    width: 100%;
    margin: 0 auto;
    background-color: #ffffff;
}

#login {
    padding-top: 30px;
}

.site-title a img {
    width:180px;
}

.searchbox {
    width: 96%;
    outline: none;
    padding: 7px 5px;
    border: 1px solid #9c9c9c;
}

.select-box {
    width: 100%;
    padding: 6px 5px;
    outline: none;
}

.time-entry-table textarea {
    width: 250px;
    max-width: 100%;
    outline: none;
    padding: 7px 5px;
    height: 70px;
    border: 1px solid #9c9c9c;
}
}

@media only screen and (max-width: 360px) {
.logoff-btn {
    border: 1px solid #00848f;
    outline: none;
    border-radius: 0;
    padding: 8px 20px;
    font-size: 13px;
    font-weight: 600;
    background: #00acba;
    color: #ffffff;
    -webkit-transition: all 0.5s ease;
    transition: all 0.5s ease;
    -webkit-appearance: none;
    text-decoration: none;
    font-family: Arial, sans-serif;
    float: none;
    width: 100px;
}

#logoutForm {
    margin-top: 10px;
    text-align: center;
    width: 100%;
}

#login {
    padding-top: 10px;
    text-align: center;
}

.float-right {
    float: none;
}

.float-left {
    float: none;
}

.site-title a img {
    width: 300px;
}

.search_header {
    overflow:hidden;
}

.search_header label {
    float:none;
    position:relative;
    top:7px;
}

.search_header div {
    float:none;
    margin-right:0;
    margin-top:10px;
}

.form-div div {
    width: 100%;
    float: left;
    margin: 5px 0;
}

.ui-dialog {
    position: absolute;
    height: auto !important;
    width: 95% !important;
    top: 25% !important;
    left: 10px;
    display: block;
    z-index: 101;
    right: auto;
    bottom: auto;
}

.from_div {
    margin-bottom:10px;
}

.from_div label {
    font-size:12px;
    color:#000;
    padding-bottom:7px;
    float:none;
    width:100%;
    padding-top:0;
}

.popup_innerdiv input[type="text"] {
    width:96% !important;
    padding:4px 5px !important;
    border:1px solid #ccc !important;
    outline:none !important;
}

.datepicker_div {
   overflow:hidden;
   margin-bottom:10px;
}



.fromdate_div label {
    font-size:12px;
    color:#000;
    padding-bottom:7px;
    float:none;
    width:100%;
    padding-top:0;
}

.fromdate_div div input[type="text"] {
    width:96% !important;
    padding:4px 5px !important;
    border:1px solid #ccc !important;
    outline:none !important;
    float:left !important;
}



.todate_div label {
    font-size:12px;
    color:#000;
    padding-bottom:7px;
    float:none;
    width:100%;
    text-align:right;
    padding-right: 10px;
    padding-top: 3px;
}

.todate_div div input[type="text"] {
    width:96% !important;
    padding:4px 5px !important;
    border:1px solid #ccc !important;
    outline:none !important;
    float:none !important;
}
}



/*-------------------------Nav-------------------------- */
#nav-trigger {
  display: none;
  text-align: center; }
  #nav-trigger span {
    display: inline-block;
    padding: 20px 0;
    background-color: #00acba;
    color: white;
    cursor: pointer;
    text-transform: uppercase;
    width:100%;
    border-bottom:1px solid #007e88;
  }
    /*#nav-trigger span:after {
      display: inline-block;
      margin-left: 10px;
      width: 20px;
      height: 10px;
      content: "";
      border-left: solid 10px transparent;
      border-top: solid 10px #fff;
      border-right: solid 10px transparent; }*/
    #nav-trigger span:hover {
      background-color: #00acba; }
    #nav-trigger span.open:after {
      border-left: solid 10px transparent;
      border-top: none;
      border-bottom: solid 10px #fff;
      border-right: solid 10px transparent; }

/*nav {
  margin-bottom: 30px; }*/

nav#nav-main {
  background-color: #00acba;
  }
  nav#nav-main ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
     }
  #menu li {
    float:left;
    display:inline-block;
    list-style:none;
}

#menu li a {
    color:#fff;
    font-size:16px;
    text-decoration:none;
    padding:16px 20px 16px 20px;
    display:inline-block;
}
  /*nav#nav-main li {
    display: inline-block;
    border-right: solid 1px #0d5eb4;
     }
    nav#nav-main li:last-child {
      border-right: none; }
  nav#nav-main a {
    display: block;
    color: white;
     }
    nav#nav-main a:hover {
      background-color: #0d5eb4;
      color: #fff; }*/

nav#nav-mobile {
  position: relative;
  display: none; }
  nav#nav-mobile ul {
    display: none;
    list-style-type: none;
    position: absolute;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    background-color: #00acba; }
  nav#nav-mobile li {
    display: inline-block;
    margin: 0;
    border-bottom: solid 1px #007e88;
    width:100%;
  }
    nav#nav-mobile li:last-child {
      border-bottom: none; }
  nav#nav-mobile a {
    display: block;
    color: white;
    /*padding: 10px 30px;*/
    
  }
    nav#nav-mobile a:hover {
      background-color: #0d5eb4;
      color: #fff;
    
    }


/* =Sections
-------------------------------------------------------------- */
section h1 {
  margin-bottom: 10px; }

section p {
  margin-bottom: 30px; }
  section p:last-child {
    margin-bottom: 0; }

/* =Media Queries
-------------------------------------------------------------- */
@media all and (max-width: 900px) {
  #nav-trigger {
    display: block; }

  nav#nav-main {
    display: none; }

  nav#nav-mobile {
    display: block;
    z-index:99999;
  } }

/*-------------------------Nav-------------------------- */

#conversionNote {
    font-size: 0.9em;
    color: #28a745;
    font-style: italic;
}
