/* CSS Document */

@import url(position.css);
@import url(menu.css);
@import url(media.css);
@import url(font-awesome.min.css);
@import url(footable.core.css);
@import url(jquery-ui.css);

html,
body {
    height: 100%;
}

* {
    margin: 0;
    padding: 0;
    outline: none;
    border: none;
    box-sizing: border-box;
    list-style: none;
    text-decoration: none;
}

body, textarea, input {
    font-family: Arial,sans-serif;
    font-size: 13px;
    color: #373737;
    font-family: 'Open Sans', sans-serif;
    background: #fff;
}

i {
    margin-right: 5px;
}

::-webkit-input-placeholder { /* WebKit browsers */
    color: #b3b3b3;
}

:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color: #b3b3b3;
}

::-moz-placeholder { /* Mozilla Firefox 19+ */
    color: #b3b3b3;
}

:-ms-input-placeholder { /* Internet Explorer 10+ */
    color: #b3b3b3;
}

button {
    cursor: pointer;
    padding: 6px 12px;
    border-radius: 2px;
}

input, textarea, select {
    width: 100%;
    max-width: 480px;
    border: 1px solid #c3c3c3;
    border-radius: 2px;
    padding: 6px;
    transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
}

    input[type="submit"] {
        -webkit-appearance: none;
    }

    select:focus, textarea:focus, input:focus {
        border: 1px solid #5f83a2;
        box-shadow: 0 0px 4px rgba(95,131,162,0.5);
    }

    input[type="submit"]:focus {
        border: none;
    }

    input[type="radio"], input[type="checkbox"] {
        width: auto;
        margin: 3px 3px 0 0;
    }

td {
    padding: 5px;
}

img {
    max-width: 100%;
}

a img {
    border: none;
}

a {
    color: #bf1f21;
}

    a:hover {
        color: #e32a2d;
    }
/*a, a:hover {
	-o-transition: color 0.25s ease-in;
	-webkit-transition: color 0.25s ease-in;
	-moz-transition: color 0.25s ease-in;
	transition: color 0.25s ease-in;
}*/
p {
    margin-bottom: 10px;
    line-height: 24px;
}

h1 {
    color: #2a3137;
    font-size: 22px;
}

h2 {
    color: #b80c1a;
    font-size: 16px;
}

h3 {
    margin: 8px 0;
    font-weight: bold;
    color: #154c85;
    font-size: 16px;
}

h4 {
    font-size: 16px;
    color: #154c85;
    margin-bottom: 8px;
}

iframe {
    width: 100% !important;
}

header {
    float: left;
    width: 100%;
    background: #b72b2d;
    padding: 0px 20px;
    border-bottom: 4px solid #a52123;
    position: fixed;
    z-index: 999;
    height: 56px;
}

section {
    float: left;
    width: 100%;
    padding-top: 55px;
}

.wrapper {
    float: left;
    width: 100%;
    padding: 20px;
    min-height: 100%;
}

.widget {
    float: left;
    width: 100%;
    margin-bottom: 20px;
    padding-bottom: 20px;
    border: 1px solid #ccc;
}

footer {
    float: left;
    width: 100%;
    padding: 0;
}

.center {
    text-align: center;
}

.row {
    float: left;
    width: 100%;
    margin-bottom: 8px;
}

.col25 {
    float: left;
    width: 25%;
    padding: 0 15px;
    position: relative;
}

.col10 {
    float: left;
    width: 10%;
    padding: 0 15px;
    position: relative;
}

.col20 {
    float: left;
    width: 20%;
    padding: 0 15px;
    position: relative;
}

.col30 {
    float: left;
    width: 30%;
    padding: 0 15px;
    position: relative;
}

.col40 {
    float: left;
    width: 40%;
    padding: 0 15px;
    position: relative;
}

.col50 {
    float: left;
    width: 50%;
    padding: 0 15px;
    position: relative;
}

.col60 {
    float: left;
    width: 60%;
    position: relative;
    padding: 0 15px;
}

.col75 {
    float: left;
    width: 75%;
    padding: 0 15px;
    position: relative;
}



.field-validation-error {
    color: #C30;
    font-size: 12px;
    float: left;
}

.input-validation-error {
    border: 1px solid #C30;
    box-shadow: 0 0px 4px rgba(240,40,40,0.5);
}

.validation-summary-errors {
    color: #C30;
    font-size: 12px;
}

.submit {
    background: #1692e5;
    color: #fff;
    font-size: 13px;
    cursor: pointer;
    padding: 6px 13px;
    border: none;
    width: auto;
}

    .submit:hover {
        background: #1f82c4;
        color: #fff;
    }

.cancel {
    background: #CC3300;
    color: #fff;
    font-size: 13px;
    cursor: pointer;
    padding: 6px 13px;
    border: none;
    width: auto;
}

    .cancel:hover {
        background: #a6310a;
    }

.reset {
    background: #3196c5;
    color: #fff;
    border: none;
    cursor: pointer;
}

    .reset:hover {
        background: #2d80a7;
    }

.divider {
    background-color: #d4d4d4;
    height: 1px;
    margin: 9px 0;
    overflow: hidden;
}

.pager {
    float: left;
    padding: 0 20px;
    width: 100%;
}

.pagination {
    float: right;
}

    .pagination li {
        display: inline;
        float: left;
        line-height: 30px;
    }

        .pagination li a {
            padding: 6px 12px;
            border: 1px solid #ddd;
            margin-left: -1px;
            color: #373737;
        }

            .pagination li a:hover {
                color: #ba2527;
                background: #fafafa;
            }

        .pagination li.active a {
            background: #ba2527;
            color: #fff;
        }

.prev a:hover {
    background: #fafafa;
}

.disabled a {
    cursor: not-allowed;
    color: #ccc !important;
    background: none;
}

.edit, .edit:hover {
    background: #658db3;
    color: #fff;
    padding: 2px 5px;
}

.delete, .delete:hover {
    background: #e25856;
    color: #fff;
    padding: 2px 5px;
}

.pull-right {
    float: right;
}

.pull-left {
    float: left;
}




.cke_chrome {
    width: 100% !important;
}


.volunteer_btn a {
    border-radius: 2px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    display: inline-block;
}

.or-line {
    width: 100%;
    text-align: center;
    border-bottom: 1px solid #000;
    line-height: 0.1em;
    margin: 10px 0 20px;
}

    .or-line strong {
        background: #fff;
        padding: 0 10px;
    }



/***************** ALERT ******************/

.message {
    -webkit-background-size: 40px 40px;
    -moz-background-size: 40px 40px;
    background-size: 40px 40px;
    background-image: -webkit-gradient(linear, left top, right bottom, color-stop(.25, rgba(255, 255, 255, .05)), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, rgba(255, 255, 255, .05)), color-stop(.75, rgba(255, 255, 255, .05)), color-stop(.75, transparent), to(transparent));
    background-image: -webkit-linear-gradient(135deg, rgba(255, 255, 255, .05) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .05) 50%, rgba(255, 255, 255, .05) 75%, transparent 75%, transparent);
    background-image: -moz-linear-gradient(135deg, rgba(255, 255, 255, .05) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .05) 50%, rgba(255, 255, 255, .05) 75%, transparent 75%, transparent);
    background-image: -ms-linear-gradient(135deg, rgba(255, 255, 255, .05) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .05) 50%, rgba(255, 255, 255, .05) 75%, transparent 75%, transparent);
    background-image: -o-linear-gradient(135deg, rgba(255, 255, 255, .05) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .05) 50%, rgba(255, 255, 255, .05) 75%, transparent 75%, transparent);
    background-image: linear-gradient(135deg, rgba(255, 255, 255, .05) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .05) 50%, rgba(255, 255, 255, .05) 75%, transparent 75%, transparent);
    -moz-box-shadow: inset 0 -1px 0 rgba(255,255,255,.4);
    -webkit-box-shadow: inset 0 -1px 0 rgba(255,255,255,.4);
    box-shadow: inset 0 -1px 0 rgba(255,255,255,.4);
    width: 100%;
    border: 1px solid;
    color: #fff;
    padding: 15px;
    position: fixed;
    _position: absolute;
    z-index: 9999;
    text-shadow: 0 1px 0 rgba(0,0,0,.5);
    -webkit-animation: animate-bg 5s linear infinite;
    -moz-animation: animate-bg 5s linear infinite;
    text-align: center;
}

.info {
    background-color: #4ea5cd;
    border-color: #3b8eb5;
}

.error {
    background-color: #de4343;
    border-color: #c43d3d;
}

.warning {
    background-color: #eaaf51;
    border-color: #d99a36;
}

.success {
    background-color: #61b832;
    border-color: #55a12c;
}

.message h3 {
    margin: 0 0 5px 0;
    color: #fff;
}

.message p {
    margin: 0;
}

@-webkit-keyframes animate-bg {
    from {
        background-position: 0 0;
    }

    to {
        background-position: -80px 0;
    }
}


@-moz-keyframes animate-bg {
    from {
        background-position: 0 0;
    }

    to {
        background-position: -80px 0;
    }
}

.info-trigger {
    background: #53A7CE;
    color: #fff;
}

.error-trigger {
    background: #DE4343;
    color: #fff;
}

.warning-trigger {
    background: #EBB35A;
    color: #fff;
}

.success-trigger {
    background: #69BC3C;
    color: #fff;
}

.requiredstar {
    color: #C30;
}

.nodatafound {
    color: red;
}




/************ Login Page ************/
.login {
    background: url(../images/login-body_top.jpg) no-repeat center top #F9F9F9;
    padding-top: 4%;
}

    .login .logo {
        padding: 20px;
        text-align: center;
        width: 100%;
        float: none;
        font-size: 40px;
        font-weight: bold;
        color: #b72b2d;
    }

    .login .box {
        margin: 0 auto;
        width: 350px;
        background: #fff;
        overflow: hidden;
        border: 1px solid #ddd;
        border-top: 5px solid #b72b2d;
    }

    .login .row {
        margin-bottom: 15px;
    }

    .login .box .content {
        padding: 10px 30px 15px;
        width: 100%;
        text-align: center;
    }

.ui-state-disabled span {
    color: #D8D8D8 !important;
}

.readonly {
    cursor: not-allowed;
    background: #ccc;
}

.no-border {
    border: none;
}

    .no-border td:first-child {
        border-left: none;
    }

.td12 td {
    width: 12.5%;
}

.td-bg {
    background-color: #f6f6f6;
}
/*Certificatio Required Popup*/
.hidechkbox {
    display: none;
}
.brand_popup {
    text-align: center;
    width: 60%;
    margin: auto;
    left: 0;
    right: 0;
    position: fixed;
    top: 150px;
    z-index: 999999;
    height: 50%;
    max-height: 200px;
    max-width: 400px;
    display: none;
    background: #fff;
    border: 5px solid #464646;
}

.black_bg {
    background-color: rgba(0,0,0,0.5);
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    right: 0;
    z-index: 99999;
    display: none;
}

.popup_back {
    background-image: url(../Images/sprite.png);
    background-repeat: no-repeat;
    background-position: -4px -322px;
    width: 17px;
    height: 17px;
    display: inline-block;
    position: absolute;
    cursor: pointer;
    margin-top: 20px;
    margin-left: 20px;
    background-color: #fff;
    border-radius: 14px;
    right: 2px;
    top: -18px;
    background-size: 22px;
}

.pheading {
    width: 100%;
    text-align: center;
    font-weight: 600;
    font-size: 17px;
    padding: 10px 0 14px 0;
    background: #464646;
    color: #fff;
    margin: 0 0 35px 0;
}

.brand_popup .btn-cont {
    width: 100%;
    text-align: center;
    padding: 10px 0;
}

    .brand_popup .btn-cont .submit, .brand_popup .btn-cont .cancel {
        width: 80px;
    }

/*Ends*/


.overlay {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.7);
  transition: opacity 500ms;
  /*visibility: hidden;
  opacity: 0;*/
  z-index:8010;
}
.overlay:target {
  visibility: visible;
  opacity: 1;
}

.popup {
  margin: auto; padding:15px; background: #f9f9f9;
  border-radius: 5px; width: 100%; position: relative;
  transition: all 2s ease-in-out;
    z-index: 99999;
    top: 50px;max-width:850px;
    left:0;right:0;
  
	-webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
	-moz-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
	box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);

}
.pop-iframe{
height: 500px;
overflow:scroll;
}

.popup h2 {
  margin-top: 0;
  color: #333;
  font-family: Tahoma, Arial, sans-serif;
}
.popup .close {
 transition: all 200ms;
    font-size: 20px;
    font-weight: bold;
    text-decoration: none;
    color: #333;
    position: absolute;
    top: -18px;
    right: -18px;
    width: 36px;
    height: 36px;
    cursor: pointer;
    z-index: 8041;
    background: url(/Content/images/close.png);
}
.popup .close:hover { color: #06D85F;}
.popup .content {max-height: 30%; overflow: auto;}

@media screen and (max-width: 700px){
  .box{
    width: 70%;
  }
  .popup{
    width: 70%;
  }
}
 iframe.pop-iframe .content{width:100%!important;}

 .tooltip-date{
     font-size:10px;
     color:#000;
 }
 .g-tooltip{
       padding:8px;
       margin-top:5px;
  }
 .tooltip-clients{
     font-size:14px;
     color:#000;
     display:flex;
 }
 p.tooltip-clients{display:inline-block!important;}
 .tooltip-clients p{
     font-weight:700;
     vertical-align:top;
 }
 /*.google-visualization-tooltip {  margin-left: -80px !important; z-index:+1;top:-10px!important; position:relative !important; top:0 !important;right:0 !important;}*/ 
.apexcharts-tooltip {border: 1px solid #9dc7f1;	box-shadow: 2px 3px 3px #AAAAAA !important;
	border-radius: 4px !important;}
.g-tooltip{color: #000;font-family: 'arial', sans-serif;  padding:8px 8px !important; display:block !important; margin:0 !important; text-align:center;border:#CAD8F2; background-color:#fafafa;}
.g-tooltip p{margin:0; padding:0; line-height:1.4em !important;text-align:center;justify-content:center;}
.tooltip-date{font-size: 10px;color:#000;font-family: 'Open Sans',Arial, sans-serif; white-space:nowrap; }
.tooltip-clients{font-size:11px; position:relative;}
.tooltip-clients span {font-weight:bold; margin-left:10px;}
.tooltip-clients::after{content:""; background-color:#7cb5ec; width:7px; height:7px; border-radius:20px; margin-top:4px; margin-right:4px;left:0px;position:absolute} 
.tooltip-clients.rm-d::after{display:none;}
.google-visualization-tooltip{background-color:#fafafa !important; border: solid 1px #7cb5ec !important;}
.g-tooltip.client-served .tooltip-clients{white-space:nowrap;}
.g-tooltip.age-served .tooltip-clients{white-space:nowrap;}
.g-tooltip.age-served{font-family: Verdana,Arial, sans-serif; text-align:left;}
.g-tooltip.age-served p{text-align:left;}
.g-tooltip.age-served .tooltip-date{font-size:10px;}
.g-tooltip.age-served .tooltip-clients:before{display:none;}

.g-tooltip.client-served p{text-align:left;}
.g-tooltip.client-served .tooltip-clients:before{min-width:6px; min-height:6px; }
.age_legend_txt{position:relative; text-align:center; font-weight:bold; }
.age_legend_txt:before{content:""; background-color:#3366cc; width:10px; height:10px;margin-top:4px; margin-right:4px; display:inline-block; }
.age-legend{text-align:center; }