﻿.form-group.required .control-label:after {
    margin-left: 5px;
    content: "*";
    color: red;
}

input:focus {
    background-color: rgb(255,255,204);
}

select:focus {
    background-color: rgb(255,255,204);
}

.mandatory:before {
    margin-left: -20px;
    content: "*";
    color: red;
    float: left;
}

.form-horizontal .control-label {
    /* text-align:right; */
    text-align: left;
    /* background-color:#ffa;*/
}
/* added by Jacques from W3 Schools*/
/* Tooltip container */
.tooltip1 {
    position: relative;
    display: inline-block;
    border-bottom: 1px dotted black; /* If you want dots under the hoverable text */
}

    /* Tooltip text */
    .tooltip1 .tooltiptext {
        visibility: hidden;
        width: 120px;
        background-color: #555;
        color: #fff;
        text-align: center;
        padding: 5px 0;
        border-radius: 6px;
        /* Position the tooltip text */
        position: absolute;
        z-index: 1;
        bottom: 125%;
        left: 50%;
        margin-left: -60px;
        /* Fade in tooltip */
        opacity: 0;
        transition: opacity 1s;
    }

        /* Tooltip arrow */
        .tooltip1 .tooltiptext::after {
            content: "";
            position: absolute;
            top: 100%;
            left: 50%;
            margin-left: -5px;
            border-width: 5px;
            border-style: solid;
            border-color: #555 transparent transparent transparent;
        }

    /* Show the tooltip text when you mouse over the tooltip container */
    .tooltip1:hover .tooltiptext {
        visibility: visible;
        opacity: 1;
    }
/*---------------------------------------------------------------------------------------*/
.help-tip {
    position: absolute;
    top: 0px;
    right: 30px;
    text-align: center;
    background-color: #BCDBEA;
    border-radius: 50%;
    width: 24px;
    height: 24px;
    font-size: 14px;
    line-height: 26px;
    cursor: default;
}

    .help-tip:before {
        content: '?';
        font-weight: bold;
        color: #fff;
    }

    .help-tip:hover p {
        display: block;
        transform-origin: 100% 0%;
        -webkit-animation: fadeIn 0.3s ease-in-out;
        animation: fadeIn 0.3s ease-in-out;
    }

    .help-tip p { /* The tooltip */
        display: none;
        text-align: left;
        background-color: #1E2021;
        padding: 20px;
        width: 300px;
        position: absolute;
        border-radius: 3px;
        box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);
        right: -4px;
        color: #FFF;
        font-size: 13px;
        line-height: 1.4;
        z-index: 100;
    }

        .help-tip p:before { /* The pointer of the tooltip */
            position: absolute;
            content: '';
            width: 0;
            height: 0;
            border: 6px solid transparent;
            border-bottom-color: #1E2021;
            right: 10px;
            top: -12px;
        }

        .help-tip p:after { /* Prevents the tooltip from being hidden */
            width: 100%;
            height: 40px;
            content: '';
            position: absolute;
            top: -40px;
            left: 0;
        }

/* CSS animation */

@-webkit-keyframes fadeIn {
    0% {
        opacity: 0;
        transform: scale(0.6);
    }

    100% {
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes fadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}




/* Footer for all Pages - in _sitelayout */
.logofooter {
    font-size: 250%;
    font-family: "Rockwell", Verdana, Helvetica, Sans-Serif;
    text-align: center;
}
/*Radio button in employee*/
#GenderRadioBtn .notActive {
    color: #3276b1;
    background-color: #fff;
}
/*Radio button in employee*/
#PayModeRadioBtn .notActive {
    color: #3276b1;
    background-color: #fff;
}
/*Radio button in employee*/
#PayFreqRadioBtn .notActive {
    color: #3276b1;
    background-color: #fff;
}
/*Radio button in employee*/
#EmplTypeRadioBtn .notActive {
    color: #3276b1;
    background-color: #fff;
}
/*Radio button in tds trans*/
#FilingModeRadioBtn .notActive {
    color: #3276b1;
    background-color: #fff;
}
/*Radio button in empwages*/
#PrintModeRadioBtn .notActive {
    color: #3276b1;
    background-color: #fff;
}
/*Radio button in statemol*/
#ScopeRadioBtn .notActive {
    color: #3276b1;
    background-color: #fff;
}
/*Radio button in Leaves Taken*/
#DateRangeRadioBtn .notActive {
    color: #3276b1;
    background-color: #fff;
}
/*Radio button in Salary Increase*/
#IncreaseTypeRadioBtn .notActive {
    color: #3276b1;
    background-color: #fff;
}
/*Radio button in Salary Increase*/
#CompanyRadioBtn .notActive {
    color: #3276b1;
    background-color: #fff;
}
/*Radio button in prgfreturn*/
#ReturnRadioBtn .notActive {
    color: #3276b1;
    background-color: #fff;
}
/*Radio button in company - nov 23*/
#EOY_IndRadioBtn .notActive {
    color: #3276b1;
    background-color: #fff;
}
/*Radio button in company - nov 23*/
#EOY_ProcRadioBtn .notActive {
    color: #3276b1;
    background-color: #fff;
}
/*Radio button in company - nov 23*/
#EOY_TypeRadioBtn .notActive {
    color: #3276b1;
    background-color: #fff;
}

/*New classes for Bootstrap*/
.col-md-1-5 {
    width: 12.49999%;
}

.col-md-2-5 {
    width: 20.83333%;
}

.col-md-8-5 {
    width: 70.83333%;
}
/*Radio button in paydedcode*/
#PayDedTypeRadioBtn .notActive {
    color: #3276b1;
    background-color: #fff;
}
/*Radio button in paydedcode*/
#InputTypeRadioBtn .notActive {
    color: #3276b1;
    background-color: #fff;
}
/*Radio button in bulk payment*/
#BankTypeRadioBtn .notActive {
    color: #3276b1;
    background-color: #fff;
}
/*Radio button in bulk payment*/
#BankFlgRadioBtn .notActive {
    color: #3276b1;
    background-color: #fff;
}
/* Read only fields label colour*/
.dispOnly {
    color: #1135e3;
}

/* Red label colour*/
.labRed {
    color: red;
}

/* Bold*/
.boldlabel {
    font-weight: bold;
}

/*--------------------------------------------------------------------------
+	Our Team Style
--------------------------------------------------------------------------*/
.team-member {
    position: relative;
    background: #FFF;
    margin-bottom: 20px;
    border: 8px solid #FFF;
    -webkit-box-shadow: inset 0 1px #fff,0 0 8px #c8cfe6;
    -moz-box-shadow: inset 0 1px #fff,0 0 8px #c8cfe6;
    box-shadow: inset 0 1px #fff,0 0 8px #c8cfe6;
}

    .team-member img {
        max-width: 100%;
    }

    .team-member ul {
        list-style-type: none;
        margin-left: 0;
        margin-top: 20px;
    }

        .team-member ul li {
            line-height: 28px;
        }

    .team-member:hover .team-member-image {
        -webkit-opacity: 1;
        -moz-opacity: 1;
        opacity: 1;
    }

    .team-member .team-member-image {
        text-align: center;
        position: relative;
        -webkit-transition: opacity .25s linear;
        -moz-transition: opacity .25s linear;
        -o-transition: opacity .25s linear;
        -ms-transition: opacity .25s linear;
        transition: opacity .25s linear;
        -webkit-opacity: 0.85;
        -moz-opacity: 0.85;
        opacity: 0.85;
    }

    .team-member .team-member-name {
        font-size: 1.3em;
        text-transform: uppercase;
    }

    .team-member .team-member-social {
        position: absolute;
        right: 10px;
        -webkit-opacity: 0.5;
        -moz-opacity: 0.5;
        opacity: 0.5;
        -webkit-transition: opacity .25s linear;
        -moz-transition: opacity .25s linear;
        -o-transition: opacity .25s linear;
        -ms-transition: opacity .25s linear;
        transition: opacity .25s linear;
    }

        .team-member .team-member-social .team-member-social i {
            margin-top: 3px;
        }

        .team-member .team-member-social:hover {
            -webkit-opacity: 1;
            -moz-opacity: 1;
            opacity: 1;
        }

hr.style14 {
    border: 0;
    height: 1px;
    background-image: -webkit-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
    background-image: -moz-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
    background-image: -ms-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
    background-image: -o-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
}

.container {
    width: auto;
    margin: 0 auto;
    padding: 10px 25px;
    border: 1px solid #ccc;
    background: #fff;
}

.responsive-image {
    height: auto;
    width: 100%;
}


