/*@media (min-width: 1200px) {
     :root {
        --size-divisor: .67;
    }
} */


/*.gj-picker gj-picker-bootstrap datepicker gj-unselectable {
    top: 267px;
    left: 204px;
    display: none;
}*/

#wrongInfo {
    color: #990000;
}


/* Extra small devices (phones, 600px and down) */

@media only screen and (max-width: 600px) {
    #printButton {
        margin-left: 0%;
        margin-top: 5%;
    }
    .customButton {
        margin-bottom: 4%;
        padding: 3px 23px;
        font-size: 15px;
    }
    #labelName {
        font-size: 97%;
        /*  margin-left: 31%; */
    }
    #pHistory {
        font-size: 126%;
        /*   margin-left: 32%; */
    }
    .table {
        width: 100%;
    }
    #loginDiv {
        margin-left: 0%;
        padding-top: 0%;
        width: 100%;
    }
    label {
        text-align: left;
    }
    #pRequest {
        padding-left: 3%;
    }
    .tableHistory {
        width: 137%;
    }
    .login-form {
        width: 100%;
    }
    .leaveButtons {
        width: 173%;
    }
    #idP {
        font-size: 9pt;
    }
    #hTitle2 {
        margin-left: 4%;
        font-size: 17px;
        text-align: center;
    }
    #loginform {
        width: 76%;
    }
    #logoImageLogin {
        width: 75%;
        margin-left: -26%;
    }
    #singForm form {
        width: 65%;
    }
    th {
        font-size: 9pt;
    }
    #IdModal {
        width: 55%;
    }
    .mainBody {
        height: 1130px;
    }
    #idLabelsHistory {
        padding-right: 0%;
        padding-left: 13%;
    }
    #personalData {
        color: white;
    }
    #pHistory {
        color: white;
    }
    #labelName {
        color: white;
    }
    #idSuccessful {
        padding-left: 8%;
    }
}


/* Small devices (portrait tablets and large phones, 600px and up) */

@media only screen and (min-width: 600px) {
    #printButton {
        margin-left: -11%;
        margin-top: 0%;
    }
    .customButton {
        margin-bottom: 2%;
        padding: 13px 23px;
        font-size: 18px;
    }
    #labelName {
        font-size: 130%;
    }
    #pHistory {
        font-size: 150%;
    }
    .table {
        width: 90%;
    }
    #loginDiv {
        margin-left: 5%;
        padding-top: 5%;
        width: 43%;
    }
    label {
        text-align: center;
    }
    #pRequest {
        padding-left: 21%;
    }
    .login-form {
        width: 202%;
        margin-left: 0%;
    }
    .leaveButtons {
        width: auto;
    }
    #idP {
        font-size: 15pt;
    }
    #hTitle2 {
        margin-left: 32%;
        text-align: center;
    }
    #logoImageLogin {
        width: 33%;
        margin-left: -7%;
    }
    #singForm form {
        width: 85%;
    }
    th {
        font-size: 9pt;
    }
    #IdModal {
        width: 100%;
    }
    .mainBody {
        height: 800px;
    }
    #idLabelsHistory {
        padding-right: 0%;
        padding-left: 13%;
    }
    #idLabelsHistory {
        padding-right: 0%;
        padding-left: 10%;
    }
    #personalData {
        color: #8ba3e7;
    }
    #pHistory {
        color: #8ba3e7;
    }
    #labelName {
        color: #8ba3e7;
    }
    #idSuccessful {
        padding-left: 33%;
    }
}


/* Medium devices (landscape tablets, 768px and up) */

@media only screen and (min-width: 768px) {
    #printButton {
        margin-left: 13%;
        margin-top: 0%;
    }
    .customButton {
        margin-bottom: 2%;
        padding: 13px 23px;
        font-size: 18px;
    }
    #labelName {
        font-size: 130%;
    }
    #pHistory {
        font-size: 150%;
    }
    .table {
        width: 80%;
    }
    #loginDiv {
        margin-left: 5%;
        padding-top: 5%;
        width: 43%;
    }
    label {
        text-align: center;
    }
    #pRequest {
        padding-left: 21%;
    }
    .login-form {
        width: 202%;
        margin-left: 0%;
    }
    .leaveButtons {
        width: auto;
    }
    #idP {
        font-size: 15pt;
    }
    #hTitle2 {
        margin-left: -13%;
        font-size: 22px;
        text-align: center;
    }
    #logoImageLogin {
        width: 53%;
        margin-left: -34%;
    }
    #singForm form {
        width: 90%;
    }
    .tableHistory {
        width: 113%;
    }
    th {
        font-size: 11pt;
    }
    #IdModal {
        width: 100%;
    }
    .mainBody {
        height: 1100px;
        width: auto;
    }
    #idLabelsHistory {
        padding-right: 0%;
        padding-left: 8%;
    }
    #personalData {
        color: #8ba3e7;
    }
    #pHistory {
        color: #8ba3e7;
    }
    #labelName {
        color: #8ba3e7;
    }
    #idSuccessful {
        padding-left: 33%;
    }
}


/* Large devices (laptops/desktops, 992px and up) */

@media only screen and (min-width: 992px) {
    #printButton {
        margin-left: 20%;
        margin-top: 0%;
    }
    .customButton {
        margin-bottom: 0%;
        padding: 13px 23px;
        font-size: 18px;
    }
    #labelName {
        font-size: 130%;
    }
    #pHistory {
        font-size: 150%;
    }
    .table {
        width: 70%;
    }
    #loginDiv {
        margin-left: 5%;
        padding-top: 5%;
        width: 43%;
    }
    label {
        text-align: center;
    }
    #pRequest {
        padding-left: 21%;
    }
    .login-form {
        width: 189%;
        margin-left: 0%;
    }
    .leaveButtons {
        width: auto;
    }
    #idP {
        font-size: 15pt;
    }
    #hTitle2 {
        margin-left: -23%;
        text-align: center;
    }
    #logoImageLogin {
        width: -36%;
        margin-left: -7%;
    }
    #singForm form {
        width: 90%;
    }
    .tableHistory {
        width: 90%;
    }
    th {
        font-size: 14pt;
    }
    #IdModal {
        width: 100%;
    }
    .mainBody {
        height: 1110px;
    }
    #idLabelsHistory {
        padding-right: 10%;
        padding-left: 0%;
    }
    #personalData {
        color: #8ba3e7;
    }
    #pHistory {
        color: #8ba3e7;
    }
    #labelName {
        color: #8ba3e7;
    }
    #idSuccessful {
        padding-left: 33%;
    }
}


/* Extra large devices (large laptops and desktops, 1200px and up) */

@media only screen and (min-width: 1200px) {
    #printButton {
        margin-left: 34%;
        margin-top: 0%;
    }
    .customButton {
        margin-bottom: 0%;
        padding: 13px 23px;
        font-size: 18px;
    }
    #labelName {
        font-size: 130%;
        /*   margin-left: -10%;  */
    }
    #pHistory {
        font-size: 150%;
        /*   margin-left: -10%; */
    }
    .table {
        width: 70%;
    }
    #loginDiv {
        margin-left: 5%;
        padding-top: 1%;
        width: 43%;
    }
    label {
        text-align: center;
    }
    #pRequest {
        padding-left: 21%;
    }
    .login-form {
        width: 155%;
        margin-left: 0%;
    }
    .leaveButtons {
        width: auto;
    }
    #idP {
        font-size: 15pt;
    }
    #hTitle2 {
        margin-left: 0%;
        text-align: center;
    }
    #logoImageLogin {
        width: 33%;
        margin-left: -7%;
    }
    #singForm form {
        width: 90%;
    }
    .tableHistory {
        width: 90%;
    }
    th {
        font-size: 15pt;
    }
    #IdModal {
        width: 100%;
    }
    .mainBody {
        height: 800px;
    }
    #idLabelsHistory {
        padding-right: 3%;
        padding-left: 0%;
    }
    #personalData {
        color: #8ba3e7;
    }
    #pHistory {
        color: #8ba3e7;
    }
    #labelName {
        color: #8ba3e7;
    }
    #idSuccessful {
        padding-left: 33%;
    }
}

.customButton {
    display: inline-block;
    cursor: pointer;
    text-align: center;
    text-decoration: none;
    outline: none;
    color: #fff;
    background-color: #697cb1;
    border: none;
    border-radius: 15px;
    box-shadow: 0 7px #999;
}

.container-fluid {
    padding-right: 0px;
    padding-left: 0px;
}

.mainBody {
    background-image: url('../images/mainImage.jpg');
    margin-right: -15px !important;
    margin-left: -15px !important;
    margin-top: 0px !important;
    margin-bottom: auto;
    /* height: 800px; */
    width: auto;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: cover !important;
}

@media only screen and (min-width: 1440px) {
    #printButton {
        margin-left: 34%;
        margin-top: 0%;
    }
    .customButton {
        margin-bottom: 0%;
        padding: 13px 23px;
        font-size: 18px;
    }
    #labelName {
        font-size: 130%;
        /*   margin-left: -10%;  */
    }
    #pHistory {
        font-size: 150%;
        /*   margin-left: -10%; */
    }
    .table {
        width: 70%;
    }
    #loginDiv {
        margin-left: 5%;
        padding-top: 1%;
        width: 43%;
    }
    label {
        text-align: center;
    }
    #pRequest {
        padding-left: 21%;
    }
    .login-form {
        width: 100%;
        margin-left: 0%;
    }
    .leaveButtons {
        width: auto;
    }
    #idP {
        font-size: 15pt;
    }
    #hTitle2 {
        margin-left: 0%;
        text-align: center;
    }
    #logoImageLogin {
        width: 33%;
        margin-left: -7%;
    }
    #singForm form {
        width: 90%;
    }
    .tableHistory {
        width: 90%;
    }
    th {
        font-size: 15pt;
    }
    #IdModal {
        width: 100%;
    }
    .mainBody {
        height: 800px;
    }
    #idLabelsHistory {
        padding-right: 13%;
        padding-left: 0%;
    }
    #personalData {
        color: #8ba3e7;
        font-size: 140%;
    }
    #pHistory {
        color: #8ba3e7;
    }
    #labelName {
        color: #8ba3e7;
    }
    #idSuccessful {
        padding-left: 33%;
    }
}

.customButton {
    display: inline-block;
    cursor: pointer;
    text-align: center;
    text-decoration: none;
    outline: none;
    color: #fff;
    background-color: #697cb1;
    border: none;
    border-radius: 15px;
    box-shadow: 0 7px #999;
}

.container-fluid {
    padding-right: 0px;
    padding-left: 0px;
}


/*  location of nav menu */

#navMenu {
    padding-top: 0%;
    padding-left: 15%;
}

.nav-link {
    font-size: 1.3em;
    color: brown;
    font-family: 'Times New Roman';
    font-style: normal;
    text-align: center;
}

#activeMenu {
    color: blue;
}

.navbar-collapse {
    display: flex !important;
    flex-basis: auto;
}


/* LOGIN REGISTRATION SIGNUP PAGE */

.form-control {
    min-height: 41px;
    background: #fff;
    box-shadow: none !important;
    border-color: #e3e3e3;
}

.form-control:focus {
    border-color: #70c5c0;
}

.form-control,
.btn {
    border-radius: 2px;
}

.login-form1 {
    width: 380px;
    margin: 0 auto;
    padding: 180px 0 30px;
    margin-left: 15%;
}

.login-form1 form,
.sing-up-form form {
    color: #7a7a7a;
    border-radius: 2px;
    margin-bottom: 15px;
    font-size: 13px;
    background: #ececec;
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
    padding: 30px;
    position: relative;
    box-shadow: 7px 10px #999;
}

.login-form1 h2,
.sing-up-form h2 {
    font-size: 22px;
    margin: 35px 0 25px;
}

.login-form1 .avatar,
.sing-up-form .avatar {
    position: absolute;
    margin: 0 auto;
    left: 0;
    right: 0;
    top: -50px;
    width: 95px;
    height: 95px;
    border-radius: 50%;
    z-index: 9;
    background: #697cb1;
    padding: 15px;
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1);
}

.login-form1 .avatar img,
.sing-up-form .avatar img {
    width: 100%;
}

.login-form1 .btn,
.login-form .btn:active,
.sing-up-form .btn,
.sing-up-form .btn:active {
    font-size: 16px;
    font-weight: bold;
    background: #697cb1 !important;
    border: none;
    margin-bottom: 20px;
}

.login-form1 .btn:hover,
.login-form1 .btn:focus,
.sing-up-form .btn:hover,
.sing-up-form .btn:focus {
    background: #50b8b3 !important;
}

.login-form1 a,
.sing-up-form a {
    color: #fff;
    text-decoration: underline;
}

.login-form1 a:hover,
.sing-up-form a:hover {
    text-decoration: none;
}

.login-form1 form a,
.sing-up-form form a {
    color: #7a7a7a;
    text-decoration: none;
}

.login-form1 form a:hover,
.sing-up-form form a:hover {
    text-decoration: underline;
}

.login-form1 .bottom-action,
.sing-up-form .bottom-action {
    font-size: 14px;
}

#empty {
    background-color: 3%;
}

#logoImage {
    /*  margin-top: 1%; */
    width: 32%;
}

#hTitle1 {
    margin-left: 46%;
}

#hTitle2 {
    color: #697cb1;
}

#signup {
    color: #697cb1;
}

#forgetPassword {
    color: #697cb1;
}

.sing-up-form {
    display: none;
    width: 380px;
    margin: 0 auto;
    padding: 180px 0 30px;
    margin-left: 15%;
}


/* SENDMESSAGE CHECKMESSAGE FORGETPASSWORD PAGE */

#singTelephone {
    width: 380px;
    margin: 0 auto;
    padding: 180px 0 30px;
    margin-left: 15%;
}

#singRandomNumber {
    width: 380px;
    margin: 0 auto;
    padding: 180px 0 30px;
    margin-left: 15%;
}

#signUpRandomNumber {
    display: none;
}

#singTelephone form,
#singRandomNumber form,
#singForm form {
    color: #7a7a7a;
    border-radius: 2px;
    margin-bottom: 15px;
    font-size: 13px;
    background: #ececec;
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
    padding: 30px;
    position: relative;
    box-shadow: 7px 10px #999;
}

#singTelephone h2,
#singRandomNumber h2,
#singForm h2 {
    font-size: 22px;
    margin: 35px 0 25px;
}

#singTelephone .avatar,
#singRandomNumber .avatar,
#singForm .avatar {
    position: absolute;
    margin: 0 auto;
    left: 0;
    right: 0;
    top: -50px;
    width: 95px;
    height: 95px;
    border-radius: 50%;
    z-index: 9;
    background: #697cb1;
    padding: 15px;
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1);
}

#singTelephone .avatar img,
#singRandomNumber .avatar img,
#singForm .avatar img {
    width: 100%;
}

#singTelephone .btn,
.login-form .btn:active,
#singRandomNumber .btn,
#singForm .btn,
#singRandomNumber .btn:active,
#singForm .btn:active {
    font-size: 16px;
    font-weight: bold;
    background: #697cb1 !important;
    border: none;
    margin-bottom: 20px;
}

#singTelephone .btn:hover,
#singTelephone .btn:focus,
#singRandomNumber .btn:hover,
#singRandomNumber .btn:focus,
#singForm .btn:focus,
#singForm .btn:hover {
    background: #50b8b3 !important;
}

#singTelephone a,
#singRandomNumber a,
#singForm a {
    color: #fff;
    text-decoration: underline;
}

#singTelephone a:hover,
#singRandomNumber a:hover,
#singForm a:hover {
    text-decoration: none;
}

#singTelephone form a,
#singRandomNumber form a,
#singForm form a {
    color: #7a7a7a;
    text-decoration: none;
}

#singTelephone form a:hover,
#singRandomNumber form a:hover,
#singForm form a:hover {
    text-decoration: underline;
}

#singTelephone .bottom-action,
#singRandomNumber .bottom-action,
#singForm .bottom-action {
    font-size: 14px;
}

#idGoMain {
    color: #697cb1;
}

#singForm {
    width: 380px;
    margin: 0 auto;
    padding: 180px 0 30px;
    margin-left: 15%;
}


/* leaveRequest CSS 40px */

#loginDiv {
    position: relative;
}

.login-form {
    background: #697cb1;
    border-radius: 50px;
    color: white;
    box-shadow: 5px 10px #999;
    padding: 4%;
}

#formTitle {
    font-size: 1.8em;
    color: white;
    font-family: 'Times New Roman';
    font-style: normal;
    text-align: center;
    margin-top: -3%;
}

#endDate {
    color: black;
}

#idSuccessful {
    /*  padding-left: 33%; */
    color: #00FF00;
}

.error {
    color: #990000;
    font-size: 17px;
    text-align: center;
    padding-left: 3em;
}


/* leaveCategory CSS */

.modal-header {
    background-color: #98ace4;
}

.modal-body {
    background-color: rgb(224, 224, 224);
}

.customButton:hover {
    background-color: #415281
}

.customButton:active {
    background-color: #4a5f99;
    box-shadow: 0 5px #666;
    transform: translateY(4px);
}

#firstButton {
    padding-top: 0%;
    margin-left: 5%;
}

.leaveButtons {
    padding-top: 2%;
    margin-left: 5%;
}

.textHelpCategories {
    margin-top: 5%;
    margin-left: 5%;
}

#personalData {
    padding-top: 1%;
    margin-left: 6%;
    /*  color: #8ba3e7;  */
}


/* leaveHelp */

#idP {
    color: white;
    padding-top: 7%;
    padding-left: 3%;
}

#strongID {
    color: #98ace4;
}


/* leaveHistory */


/* gia tin kanoniki selida */


/*
thead,
tbody {
    display: block;
}

*/


/*
thead,
tbody tr {
    display: table;
    width: 100%;
    table-layout: fixed;
}

*/

th {
    color: black;
}

#logoImagePrint {
    width: 30%;
}

td {
    color: black;
    font-size: 9pt;
    font-weight: bold;
    height: 30px;
}

.labelSelect {
    margin-left: 3%;
    margin-bottom: 1%;
}

#idbody {
    overflow-y: auto;
}

.table {
    border: 1px solid black;
    outline-style: ridge;
    outline-width: 7pt;
    outline-offset: 7pt;
    outline-color: #8ba3e7;
    resize: both;
}

#accordion {
    padding-top: 3%;
    margin-left: 9%;
}

#idH5 {
    color: white;
    width: 30%;
}

.formCategoryHistory {
    padding-top: 3%;
    margin-left: 6%;
}

.categoryLabel {
    font-size: 18px;
    color: #8ba3e7;
}

.formClass {
    padding-top: 2%;
    margin-left: 4%;
}

label {
    /*   text-align: center;  */
    color: #b2c2ee;
    font-size: 12pt;
}

#idTitleForm {
    color: white;
    font-size: 18pt;
}

.customButtonSubmit {
    margin-left: 1%;
    display: inline-block;
    padding: 6px 15px;
    font-size: 15px;
    cursor: pointer;
    text-align: center;
    text-decoration: none;
    outline: none;
    color: #fff;
    background-color: #697cb1;
    border: none;
    border-radius: 10px;
    box-shadow: 0 3px #999;
}

.customButtonSubmit:hover {
    background-color: #415281
}

.customButtonSubmit:active {
    background-color: #4a5f99;
    box-shadow: 0 5px #666;
    transform: translateY(4px);
}

.textLeaveRest {
    font-size: 16pt;
    color: #c0bfbf;
    padding-top: 5%;
    margin-left: 13%;
}

.textLeaveHelp {
    padding-top: 7%;
    margin-left: 8%;
}

#pRequest {
    color: white;
}


/*
.bootstrap-datetimepicker-widget {
    list-style: none;
}

.bootstrap-datetimepicker-widget.dropdown-menu {
    margin: 2px 0;
    padding: 4px;
    width: 19em;
}
*/


/*
@media (min-width: 479px) {
    .mainBody {
        width: auto;
        height: 840px;
    }
}

@media (min-width: 2px) {
    .bootstrap-datetimepicker-widget.dropdown-menu.timepicker-sbs {
        width: 38em;
    }
}

@media (min-width: 992px) {
    .bootstrap-datetimepicker-widget.dropdown-menu.timepicker-sbs {
        width: 38em;
    }
}

@media (min-width: 1200px) {
    .bootstrap-datetimepicker-widget.dropdown-menu.timepicker-sbs {
        width: 38em;
    }
}

.bootstrap-datetimepicker-widget.dropdown-menu:before,
.bootstrap-datetimepicker-widget.dropdown-menu:after {
    content: '';
    display: inline-block;
    position: absolute;
}

.bootstrap-datetimepicker-widget.dropdown-menu.bottom:before {
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-bottom: 7px solid #cccccc;
    border-bottom-color: rgba(0, 0, 0, 0.2);
    top: -7px;
    left: 7px;
}

.bootstrap-datetimepicker-widget.dropdown-menu.bottom:after {
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-bottom: 6px solid white;
    top: -6px;
    left: 8px;
}

.bootstrap-datetimepicker-widget.dropdown-menu.top:before {
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-top: 7px solid #cccccc;
    border-top-color: rgba(0, 0, 0, 0.2);
    bottom: -7px;
    left: 6px;
}

.bootstrap-datetimepicker-widget.dropdown-menu.top:after {
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 6px solid white;
    bottom: -6px;
    left: 7px;
}

.bootstrap-datetimepicker-widget.dropdown-menu.pull-right:before {
    left: auto;
    right: 6px;
}

.bootstrap-datetimepicker-widget.dropdown-menu.pull-right:after {
    left: auto;
    right: 7px;
}

.bootstrap-datetimepicker-widget .list-unstyled {
    margin: 0;
}

.bootstrap-datetimepicker-widget a[data-action] {
    padding: 6px 0;
}

.bootstrap-datetimepicker-widget a[data-action]:active {
    box-shadow: none;
}

.bootstrap-datetimepicker-widget .timepicker-hour,
.bootstrap-datetimepicker-widget .timepicker-minute,
.bootstrap-datetimepicker-widget .timepicker-second {
    width: 54px;
    font-weight: bold;
    font-size: 1.2em;
    margin: 0;
}

.bootstrap-datetimepicker-widget button[data-action] {
    padding: 6px;
}

.bootstrap-datetimepicker-widget .btn[data-action="incrementHours"]::after {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
    content: "Increment Hours";
}

.bootstrap-datetimepicker-widget .btn[data-action="incrementMinutes"]::after {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
    content: "Increment Minutes";
}

.bootstrap-datetimepicker-widget .btn[data-action="decrementHours"]::after {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
    content: "Decrement Hours";
}

.bootstrap-datetimepicker-widget .btn[data-action="decrementMinutes"]::after {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
    content: "Decrement Minutes";
}

.bootstrap-datetimepicker-widget .btn[data-action="showHours"]::after {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
    content: "Show Hours";
}

.bootstrap-datetimepicker-widget .btn[data-action="showMinutes"]::after {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
    content: "Show Minutes";
}

.bootstrap-datetimepicker-widget .btn[data-action="togglePeriod"]::after {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
    content: "Toggle AM/PM";
}

.bootstrap-datetimepicker-widget .btn[data-action="clear"]::after {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
    content: "Clear the picker";
}

.bootstrap-datetimepicker-widget .btn[data-action="today"]::after {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
    content: "Set the date to today";
}

.bootstrap-datetimepicker-widget .picker-switch {
    text-align: center;
}

.bootstrap-datetimepicker-widget .picker-switch::after {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
    content: "Toggle Date and Time Screens";
}

.bootstrap-datetimepicker-widget .picker-switch td {
    padding: 0;
    margin: 0;
    height: auto;
    width: auto;
    line-height: inherit;
}

.bootstrap-datetimepicker-widget .picker-switch td span {
    line-height: 2.5;
    height: 2.5em;
    width: 100%;
}

.bootstrap-datetimepicker-widget table {
    width: 100%;
    margin: 0;
}

.bootstrap-datetimepicker-widget table td,
.bootstrap-datetimepicker-widget table th {
    text-align: center;
    border-radius: 4px;
}

.bootstrap-datetimepicker-widget table th {
    height: 20px;
    line-height: 20px;
    width: 20px;
}

.bootstrap-datetimepicker-widget table th.picker-switch {
    width: 145px;
}

.bootstrap-datetimepicker-widget table th.disabled,
.bootstrap-datetimepicker-widget table th.disabled:hover {
    background: none;
    color: #777777;
    cursor: not-allowed;
}

.bootstrap-datetimepicker-widget table th.prev::after {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
    content: "Previous Month";
}

.bootstrap-datetimepicker-widget table th.next::after {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
    content: "Next Month";
}

.bootstrap-datetimepicker-widget table thead tr:first-child th {
    cursor: pointer;
}

.bootstrap-datetimepicker-widget table thead tr:first-child th:hover {
    background: #eeeeee;
}

.bootstrap-datetimepicker-widget table td {
    height: 54px;
    line-height: 54px;
    width: 54px;
}

.bootstrap-datetimepicker-widget table td.cw {
    font-size: .8em;
    height: 20px;
    line-height: 20px;
    color: #777777;
}

.bootstrap-datetimepicker-widget table td.day {
    height: 20px;
    line-height: 20px;
    width: 20px;
}

.bootstrap-datetimepicker-widget table td.day:hover,
.bootstrap-datetimepicker-widget table td.hour:hover,
.bootstrap-datetimepicker-widget table td.minute:hover,
.bootstrap-datetimepicker-widget table td.second:hover {
    background: #eeeeee;
    cursor: pointer;
}

.bootstrap-datetimepicker-widget table td.old,
.bootstrap-datetimepicker-widget table td.new {
    color: #777777;
}

.bootstrap-datetimepicker-widget table td.today {
    position: relative;
}

.bootstrap-datetimepicker-widget table td.today:before {
    content: '';
    display: inline-block;
    border: 0 0 7px 7px solid transparent;
    border-bottom-color: #337ab7;
    border-top-color: rgba(0, 0, 0, 0.2);
    position: absolute;
    bottom: 4px;
    right: 4px;
}

.bootstrap-datetimepicker-widget table td.active,
.bootstrap-datetimepicker-widget table td.active:hover {
    background-color: #337ab7;
    color: #ffffff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
}

.bootstrap-datetimepicker-widget table td.active.today:before {
    border-bottom-color: #fff;
}

.bootstrap-datetimepicker-widget table td.disabled,
.bootstrap-datetimepicker-widget table td.disabled:hover {
    background: none;
    color: #777777;
    cursor: not-allowed;
}

.bootstrap-datetimepicker-widget table td span {
    display: inline-block;
    width: 54px;
    height: 54px;
    line-height: 54px;
    margin: 2px 1.5px;
    cursor: pointer;
    border-radius: 4px;
}

.bootstrap-datetimepicker-widget table td span:hover {
    background: #eeeeee;
}

.bootstrap-datetimepicker-widget table td span.active {
    background-color: #337ab7;
    color: #ffffff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
}

.bootstrap-datetimepicker-widget table td span.old {
    color: #777777;
}

.bootstrap-datetimepicker-widget table td span.disabled,
.bootstrap-datetimepicker-widget table td span.disabled:hover {
    background: none;
    color: #777777;
    cursor: not-allowed;
}

.bootstrap-datetimepicker-widget.usetwentyfour td.hour {
    height: 27px;
    line-height: 27px;
}

.bootstrap-datetimepicker-widget.wider {
    width: 21em;
}

.bootstrap-datetimepicker-widget .datepicker-decades .decade {
    line-height: 1.8em !important;
}

.input-group.date .input-group-addon {
    cursor: pointer;
}
*/