html { -webkit-font-smoothing: antialiased; }
body * { box-sizing: border-box; }
body { margin: 0; padding: 0; font-size: 14px; font-family: Tahoma, Verdana; color: black;  }
html, body { margin: 0; padding: 0; height: 100%; }
.container { min-height: 100%; position: relative; padding-top: 50px; box-sizing: border-box; width: 100%; }
header { background-color: white; }
.red { color: #D3343F; }
.main_wrapper { padding: 20px; min-width: 1210px; }
.main_content { position: relative; }
.content_container { width: 100%; box-sizing: border-box; padding-left: 50px; position: relative; }
/*footer { bottom: 0; width: 100%; position: absolute; bottom: 0; left: 0; background-color: #009C54; height: 45px; line-height: 45px; vertical-align: middle; color: white; text-align: center; z-index: 9999; }*/
textarea, input, button { outline: none; }
.noselect, img { -webkit-touch-callout: none; /* iOS Safari */ -webkit-user-select: none; /* Chrome/Safari/Opera */ -khtml-user-select: none; /* Konqueror */ -moz-user-select: none; /* Firefox */ -ms-user-select: none; /* IE/Edge */ user-select: none; /* non-prefixed version, currently not supported by any browser */ }
.keyIcon:before { content: ''; background-image: url('../img/keyIcon.png'); background-size: cover; left: 5px; top: 5px; width: 20px; height: 20px; position: absolute; z-index: 999; }
a img { border: 0; }
h1 { font-size: 28px; margin-bottom: 10px; }
h1, h2, h3, h4, h5 { font-weight: normal; margin-top: 0; }
    h1 > * { vertical-align: middle; display: inline-block; vertical-align: top; }
    h1 > img { margin-right: 10px; }
    h1 > span { vertical-align: middle; }
    h1 > .icon { width: 50px; height: 50px; padding: 0; margin: 0; display: inline-block; background-position: 0 -50px !important;}
   .rel { position: relative; }
.loading_img { vertical-align: middle; }
a { color: black; text-decoration: none; }
b { font-weight: bold; }
table a { color: #009C54; cursor: pointer; }
input[type="text"]:disabled, select:disabled, .ui-state-disabled, input[type="text"]:disabled { color: black; background-color: #E2E0E0; cursor: default !important; }
select:disabled { color: black; }
.ui-state-disabled { background-color: #B6B6B6 !important; }
    .ui-state-disabled > span:first-child { background-color: #646464 !important; background-image: url('/img/SelectArrow_disabled.png') !important; }

input, select, textarea { background-color: white; border: 1px solid black; padding: 3px 3px; margin: 0; box-sizing: border-box; height: 26px; vertical-align: middle; border-radius: 3px; font-size: 14px !important; font-family: Tahoma; }
    input:disabled { background-color: #E5E5E5; }
    input[type=file] { background: none; }
/*.table_observation tr:nth-child(2n+0) { background-color: #F5F5F5; }*/

.btn, button { font-size: 13.333px; height: 30px; padding: 0 10px; background: linear-gradient(#009c54, #00743d); color: white; box-sizing: border-box; display: inline-block; line-height: 30px; vertical-align: middle; text-align: center; cursor: pointer; border: 0; }
.name_format_btns .btn, .name_format_btns button { padding: 0 5px; }
    .btn.red, button.red { background: linear-gradient(#D3343F, #761e23); color: white; }
    .btn:hover, button:hover {     background: linear-gradient(#d9d9d9, #ffffff); color: black; }
    .btn.full, button.full { width: 100%; padding: 0; }
        .btn.full[disabled=disabled], button.full[disabled=disabled] { background-color: gray; }
        .button-disabled,.button-disabled:hover{background:none;background-color:#bbb;color:white;cursor:default;}
        .button-enabled{background: linear-gradient(#009c54, #00743d); color: white; cursor:pointer;cursor:hand;}
        .button-enabled:hover{background: linear-gradient(#d9d9d9, #ffffff); color: black; cursor:pointer;cursor:hand;}
        .btn[disabled=disabled], button[disabled=disabled], .btn[disabled=disabled]:hover, button[disabled=disabled]:hover { opacity: 0.5; background: linear-gradient(#009c54, #00743d); color: white; }
.margin_0 { margin: 0 !important; }
button.icon { width: 32px; height: 31px; padding: 0; }
    button.icon:hover { opacity: 0.7; }
button.back { background-image: url('/img/Back.png'); }
button.complete { background-image: url('/img/Save.png'); }
.btn-save { background: linear-gradient(#009C54, #00743d); color: white; cursor: pointer; border: 0; border-radius: 0; height: 25px;  }
    .btn-save:hover { background: linear-gradient(#d9d9d9, #ffffff); color: black; }

.red { color: #D3343F; }
.green { color: #009C54; }
.amber { color: #fea300; }
.center { text-align: center; }
.font_size_sm { font-size: 10px; }
.pt { position: absolute; top: 0; }
.pb { position: absolute; bottom: 0; }
.pr { position: absolute; right: 0; }
.pl { position: absolute; left: 0; }
.form_container .pt { position: absolute; top: 30px; }
.form_container .pb { position: absolute; bottom: 30px; }
.form_container .pr { position: absolute; right: 30px; }
.form_container .pl { position: absolute; left: 30px; }

input.ng-invalid-required.ng-touched, form.ng-submitted input.ng-invalid-required, select.ng-invalid-required.ng-touched, form.ng-submitted select.ng-invalid-required { border: 1px solid #D3343F; }

form .error.required, form .error.invalid { display: none; }
form.ng-invalid.ng-invalid-required.ng-submitted .error.required, form.ng-invalid.ng-submitted .error.invalid { display: block; }

.certificate-fail { background:red !important; color:white !important;}
.ng-invalid { background:red !important; color:white !important;}
.ng-invalid .row{ color:black !important;}
.cert-select-warning.ng-invalid { background:orange !important; color:black !important;}
form.ng-invalid {background:white !important;}
.certificate-warning{background:orange !important; color:black !important;}

/*SIDE NAV*/
nav#side_main_nav::-webkit-scrollbar, .key_info_box .scrollbox::-webkit-scrollbar, .designation_scroll::-webkit-scrollbar, .circuit_results_scroll::-webkit-scrollbar, .dashboard_line::-webkit-scrollbar { 
    display: none; 
}
nav#side_main_nav, .designation_scroll, .circuit_results_scroll, .dashboard_line {
    -ms-overflow-style: none;
}
nav#side_main_nav + .content_container { transition: padding-left 0.5s; }
nav#side_main_nav.open + .content_container { padding-left: 200px; }
nav#side_main_nav { position: fixed; top: 0; left: 0; height: 100%; background-color: #6f6f6f; z-index: 999; padding-top: 50px; transition: width 0.5s; overflow-x: hidden; overflow-y: auto; }
nav#side_main_nav .version-holder{position:absolute;left:0px;bottom:0px;display:inline-block;}
nav#side_main_nav .version-holder span{display:block;background-color:#eee;color:black;padding:5px;}
nav#side_main_nav.closed { width: 50px;}
nav#side_main_nav.open { width: 200px; }
nav#side_main_nav .has_sub { cursor:pointer; user-select: none; position:relative;}
nav#side_main_nav .sub_nav { display: none; width: 200px; padding-left: 60px; box-sizing: border-box; margin:0; color: white; list-style: none; line-height: 40px; }

nav#side_main_nav .has_sub .toggle_sub_menu{position:absolute;top:15px;left:170px;height:20px;width:20px;overflow:hidden;transition:transform 0.4s; transform: rotate(90deg);}
nav#side_main_nav .has_sub .toggle_sub_menu img{width:20px;}
nav#side_main_nav .has_sub:hover .toggle_sub_menu img{margin-top:-20px;}

#side_main_nav.open .nav_item.has_sub.open .toggle_sub_menu{ transform: rotate(-90deg);}
#side_main_nav.open .nav_item.has_sub.close .toggle_sub_menu{ transform: rotate(90deg);}

nav#side_main_nav .sub_nav a { color: white;}


#side_main_nav .nav_item { height: 50px; line-height: 46px; color: white; display:block; position:relative; }
#side_main_nav .nav_item:hover, #side_main_nav .nav_item.active { background-color: white; color: black; }
#side_main_nav .nav_item  > * { position:absolute; top:0; left:0; display: block; vertical-align: middle; }
#side_main_nav .nav_item .text { height: 50px; line-height: 50px; left: 50px; width: 150px; padding-left: 5px; }
#side_main_nav.open .nav_item .text {  }
nav#side_main_nav .toggle_menu { width: 30px; height: 30px; margin: 10px; background-image: url('/imgs/open-arrow.png'); background-position: 0px 0px; transition: margin-left 0.5s, transform 0.5s; cursor: pointer; }
nav#side_main_nav .nav_item:hover .toggle_menu { background-position: 0 -30px; }
nav#side_main_nav.open .toggle_menu { margin-left: 160px; transform: rotate(180deg); }


.icon { width: 50px; height: 50px; padding: 10px; }
nav#side_main_nav .cat_icon { width: 30px; height: 30px; background-position: 0px 0px; }
nav#side_main_nav .nav_item.active .cat_icon, nav#side_main_nav .nav_item:hover .cat_icon, h1 .icon:hover { background-position: 0px -30px; }
.cat_icon.admin { background-image:url('/imgs/admin.png');}
.cat_icon.admin.large { background-image:url('/imgs/admin-50.png');}
.cat_icon.audit { background-image:url('/imgs/audit.png');}
.cat_icon.audit.large { background-image:url('/imgs/audit-50.png');}
.cat_icon.certs { background-image:url('/imgs/certs.png');}
.cat_icon.certs.large { background-image:url('/imgs/certs-50.png');}
.cat_icon.clients { background-image:url('/imgs/clients.png');}
.cat_icon.clients.large { background-image:url('/imgs/clients-50.png');}
.cat_icon.companies { background-image:url('/imgs/companies.png');}
.cat_icon.companies.large { background-image:url('/imgs/companies-50.png');}
.cat_icon.appointments { background-image:url('/imgs/appointments.png');}
.cat_icon.appointments.large { background-image:url('/imgs/appointments-50.png');}
.cat_icon.certification { background-image:url('/imgs/certs.png');}
.cat_icon.certification.large { background-image:url('/imgs/certs-50.png');}
.cat_icon.dashboard { background-image:url('/imgs/dashboard.png');}
.cat_icon.dashboard.large { background-image:url('/imgs/dashboard-50.png');}
.cat_icon.financials { background-image:url('/imgs/financials.png');}
.cat_icon.financials.large { background-image:url('/imgs/financials-50.png');}
.cat_icon.invoicing {
    background-image: url('/imgs/financials.png');
}
.cat_icon.jobs { background-image:url('/imgs/job-mngmt.png');}
.cat_icon.jobs.large { background-image:url('/imgs/job-mngmt-50.png');}
.cat_icon.programmes { background-image:url('/imgs/programmes.png');}
.cat_icon.programmes.large { background-image:url('/imgs/programmes-50.png');}
.cat_icon.repairs { background-image:url('/imgs/repairs.png');}
.cat_icon.repairs.large { background-image:url('/imgs/repairs-50.png');}
.cat_icon.reports { background-image:url('/imgs/reports.png');}
.cat_icon.reports.large { background-image:url('/imgs/reports-50.png');}
.cat_icon.survey { background-image:url('/imgs/survey-mngmt.png');}
.cat_icon.survey.large { background-image:url('/imgs/survey-mngmt-50.png');}
.cat_icon.installations { background-image:url('/imgs/installations.png');}
.cat_icon.installations.large { background-image:url('/imgs/installations-50.png');}
.cat_icon.returned { background-image: url('/imgs/returned.png'); }
.cat_icon.returned.large { background-image: url('/imgs/returned-50.png'); }
.cat_icon.log { background-image: url('/imgs/log.png'); }
.cat_icon.log.large { background-image: url('/imgs/log-50.png'); }

.cat_icon.tiny { width: 20px; height: 20px; background-size: 20px 60px; background-position: 0 -20px; }
    .cat_icon.tiny:hover { background-position: 0 -40px; }
/* HEADER */
header { height: 50px; width: 100%; background-color: black; position:fixed; top:0; left: 0; z-index: 1000; }
header #header_login_box { float: right; }
header > * { display: block; vertical-align: top; height: 50px; }
header .right, header .left { float: right; height: 50px; color: white; padding: 10px; line-height: 30px; border-left: 1px solid white; position: relative; }
header .left { float: left; border-left: 0; }
header .left.logo { padding-top: 5px; border-right: 1px solid white;}
header .sub_nav { display: none; position: absolute; top: 50px; right: 0px; padding: 10px; color: white; background-color: black; margin: 0; list-style: none; line-height: 20px; }
header .sub_nav a { cursor:pointer; color: white;  }
header .profile_pic {  border-left: 1px solid white; padding: 5px;  }
header .profile_pic img { max-height: 40px; max-width: 40px; vertical-align: middle; }
header .profile_pic:hover .sub_nav { display: block; border-top: 1px solid white; }
header #search { text-align: left; border: 0; color: white; background-color: black; outline: none; vertical-align: middle; width: 220px; }
header .icon { width: 30px; height: 30px; padding: 0; background-position: 0px 0px; }
header .icon:hover { background-position: 0px -60px; }
header .icon.settings { background-image: url('/imgs/settings.png'); }
header .icon.help { background-image: url('/imgs/help.png'); }
header .help_has_sub .sub_nav { width: 300px; text-align: right; border-top: 1px solid white; }
header .help_has_sub:hover .sub_nav { display: block; }
header .icon.search { background-image: url('/imgs/search.png'); display: inline-block; vertical-align: middle; }
.header_container { width: 984px; margin: 0 auto; height: 135px; position: relative; }
.line-height-30 { line-height: 15px; }
.contact_info { position: absolute; right: 0; top: 65px; font-size: 18px; text-align: right; line-height: 30px; }
#header_login_box { height: 50px; box-sizing: border-box; line-height: 50px; vertical-align: middle; }
    #header_login_box > * { vertical-align: middle; }
    #header_login_box button { margin-left: 10px; }
header .left.corner_block { background: linear-gradient(#009C54, #00743d); height: 50px; width: 50px; border: 0; }
/* LOGIN */
#login_container { position: fixed; z-index:1100; width: 100%; height: 100%; top: 0; left: 0; background-color: black; background: url('/imgs/ecms-logon-page.jpg') no-repeat center; background-size: cover; background-position: -300px bottom;  }
#login_panel { width: 372px; position: fixed; height: 100%; background-color: white; right: 0px; top: 0px; box-sizing:border-box; padding: 50px; text-align: center; }
#login_panel img { margin: 100px 0; }
#login_box { text-align: left; width: 222px; margin: 0 auto; }
#login_box input[type=email], #login_box input[type=password] { margin-top: 5px; width: 100%; }
#login_panel footer { position: absolute; bottom: 0; left: 0; background-color: black; color: white; text-align: center; width: 100%; padding: 5px; }
#login_title { position: absolute; bottom: 50px; left: 50px; font-size: 60px; color: white; text-shadow: 0 0 15px black; }
/* WRAPPER TEXT */
.text_align_right { text-align: right !important; }
.text_align_center { text-align: center !important; }
.breadcrumbs { font-size: 12px; color: #555555; margin-bottom: 10px; }
.breadcrumbs a { color: #555555;}
.breadcrumbs a:hover { text-decoration: underline; }


/* DASHBOARD */
.dashboard_left, .dashboard_right { text-align: center; display: inline-block; background-color: white; padding: 20px; color: #009C54; width: 49%; margin-right: 1%; box-sizing: border-box; vertical-align: top; text-align: center; margin-top: 10px; }
    .dashboard_left h2, .dashboard_right h2 {  }
    .dashboard_left.piechart_swing { width: 35%; }
.dashboard_right { margin-right: 0; }
.dashboard_icons { background-color: white; padding: 30px; margin-top: 30px; margin-bottom: 10px; text-align: center; }
    .dashboard_icons .item { display: inline-block; color: #009C54; font-size: 16px; vertical-align: top; width: 120px; height: 135px; margin: 0px 10px; margin-bottom: 20px; }
    .dashboard_icons .item_image { width: 75px; height: 73px; background-position: 0px 0px; margin: 0 auto 20px auto; /*#animation-icons-css -webkit-transition: width 0.15s ease-in-out; -moz-transition: width 0.15s ease-in-out; -o-transition: top 0.15s ease-in-out; transition: all 0.15s ease-in-out; border-radius: 35px; -moz-border-radius: 35px; -webkit-border-radius: 35px; background-color: #E8E9EA; /**/ }
    .dashboard_icons .item:hover .item_image { background-position: 0px -73px; }
    .dashboard_icons .item:hover { color: #808285; }
    .dashboard_icons .item_image.programme { background-image: url('/img/Programme-Management.jpg'); }
    .dashboard_icons .item_image.certification { background-image: url('/img/Certification-Management.png'); }
    .dashboard_icons .item_image.surveys { background-image: url('/img/CustomerSurvey.png'); }
    .dashboard_icons .item_image.job { background-image: url('/img/JobManagement.png'); }
    .dashboard_icons .item_image.reports { background-image: url('/img/MiReports.png'); }
    .dashboard_icons .item_image.users { background-image: url('/img/UserManagement.jpg'); }
    .dashboard_icons .item_image.clients { background-image: url('/img/ClientManagement.jpg'); }
    .dashboard_icons .item_image.engineers { background-image: url('/img/EngineerManagement.jpg'); }
.dashboard_left table { text-align: left; width: 100%; font-size: 18px; }
.dashboard_left td:first-child { color: #808285; }
.dashboard_left td:last-child { text-align: right; }

/* ACTION BAR */
#action_bar { position: absolute; top: 0px; right: 20px; height: 43px; text-align: right; }
.action_btn { width: 43px; height: 43px; background-position: 0px 0px; display: inline-block; margin-left: 10px; cursor: pointer; }
    .action_btn:hover { background-position: 0 -43px; }
    .action_btn[disabled=disabled] { background-position: 0 -86px; }
    .action_btn.plus { background-image: url('/img/AddNew.png'); }
    .action_btn.menu { background-image: url('/img/Menu.png'); }
    .action_btn.search { background-image: url('/img/Search.png'); }
    .action_btn.stats { background-image: url('/img/Stats.png'); }
    .action_btn.edit { background-image: url('/img/Edit.png'); }
    .action_btn.certificate { background-image: url('/img/Certificate.png'); }
    .action_btn.clipboard { background-image: url('/img/Clipboard.png'); }
    .action_btn.save { background-image: url('/img/'); }
#fixed_action_bar { position: fixed; width: 43px; height: 200px; top: 232px; right: 0; z-index: 100; }
.fixed_action_bar.cover { background-repeat: no-repeat; background-size: cover; width: 43px; height: 43px; float: left; margin-bottom: 10px; cursor: pointer; }
.fixed_action_bar.back { background-image: url('/img/Back_2.png'); }
.fixed_action_bar.master { background-image: url('/img/Master.png'); }
.fixed_action_bar.survey { background-image: url('/img/Clipboard.png'); }
.fixed_action_bar.history { background-image: url('/img/history_certificate.png'); }
.fixed_action_bar.certificate { background-image: url('/img/Certificate.png'); }
.fixed_action_bar.save { background-image: url('/img/Save.png'); }
.fixed_action_bar.savedisk { background-image: url('/img/savedisc.png')}
.fixed_action_bar.publish { background-image: url('/img/publish.png')}
/**/
/* LIST BOXES*/
.list_box { width: 100%; clear:both;}
.list_box table tr:last-child{border-bottom:solid 1px black;}
.list_filters { font-size: 14px; }
    .list_filters > * { vertical-align: middle; }
    .list_filters span { display: inline-block; margin-left: 10px; float:right;}
.filter_btn { padding: 4px 15px; border-top-left-radius: 5px; border-top-right-radius: 5px; display: inline-block; cursor: pointer; background-color: #E8E9EA; border: 1px solid black; border-bottom: 0; /**/ }
.filter_btn.active { background-color: #555555; color: white; }
    /*.filter_btn.all { background-image: url('/img/All.png'); background-position: 0px -72px; }
    .filter_btn.archived { background-image: url('/img/archived.png'); background-position: 0px -72px; }
    .filter_btn.mastered { background-image: url('/img/mastered.png'); background-position: 0px -72px; }
    .filter_btn.noAccess { background-image: url('/img/noAccess.png'); background-position: 0px -72px; }
    .filter_btn.certificate { background-image: url('/img/Certifcate.png'); background-position: 0px -37px; }
    .filter_btn.active, .filter_btn:hover { background-position: 0px 0px; }
    .filter_btn.completed { background-image: url('/img/Completed.png'); }
    .filter_btn.add {background-image: url('/img/AddNew.png'); background-position: 0 0; background-size: 23px 69px; margin-right: 0px; }
    .filter_btn.add:hover { background-position: 0px -23px; }
    .filter_btn.current { background-image: url('/img/InProgress.png'); }

    .filter_btn.details { background-image: url('/img/Details.png'); }
    .filter_btn.audit { background-image: url('/img/Audit.png'); }
    .filter_btn.history { background-image: url('/img/History.png'); }
    .filter_btn.permissions { background-image: url('/img/Locked.png'); }
    .filter_btn.engineers { background-image: url('/img/EngineerTab.png'); }
    .filter_btn.supervisors { background-image: url('/img/SupervisorTab.png'); background-position: 0px -37px; }
        .filter_btn.supervisors:hover, .filter_btn.supervisors.active { background-position: 0px 0px; }
    .filter_btn.clients { background-image: url('/img/Client.png'); }
    .filter_btn.subclients { background-image: url('/img/Subclient.png'); }
    .filter_btn.on_hold { background-image: url('/img/Pause.png'); background-position: 0px -72px; }
        .filter_btn.on_hold:hover, .filter_btn.on_hold.active { background-position: 0px 0px; }
    .filter_btn.mastered { background-image: url('/img/mastered.png'); background-position: 0px -72px; }
        .filter_btn.mastered:hover, .filter_btn.mastered.active { background-position: 0px 0px; }

    .filter_btn.noAccess { background-image: url('/img/noAccess.png'); background-position: 0px -72px; }
        .filter_btn.noAccess:hover, .filter_btn.noAccess.active { background-position: 0px 0px; }

    .filter_btn.inactive_engineers { background-image: url('/img/filter_inactive.png'); background-position: 0px -72px; }
        .filter_btn.inactive_engineers:hover, .filter_btn.inactive_engineers.active { background-position: 0px 0px; }*/
    .key_info_box { position: fixed; right: 0; top: 0; height: 100%; width: 250px; z-index: 999; background-color: white; padding-top: 50px; padding-bottom: 30px; border-left: 1px solid black; transition: right 0.5s; }
    .key_info_box.closed { right: -226px; border-left: 0px; }
    .key_info_box .vertical_bar { background: linear-gradient(90deg ,#009c54, #00743d); display: none; width: 25px; height: 100%; position: absolute; top: 0; left: 0; z-index: 30; }
    .key_info_box.closed .vertical_bar { display: block; }
    .key_info_box .header { background: linear-gradient(#009c54, #00743d); color: white; padding: 3px; z-index: 40; position: relative; height: 25px; line-height: 18px; }
    .key_info_box .header .toggle_menu { position: absolute; top: 0; left: 0; height: 25px; width: 25px; cursor: pointer; background-image: url('/imgs/open-arrow.png'); background-size: 25px 75px; transform: rotate(180deg); transition: transform 0.5s; z-index: 40; }
    .key_info_box.open .header .toggle_menu { transform: rotate(0deg);  }
        .key_info_box.closed .header .toggle_menu { background: url('/imgs/open-arrow.png') 0px 0px, linear-gradient(270deg,#009c54, #00743d); background-size: 25px 75px; }
    .key_info_box .form_container { border: 0; }
    .key_info_box .form_container label { margin-bottom: 0; }
    .key_info_box .form_container .row { margin-bottom: 0px; padding: 2px; }
    .key_info_box .form_container .row:nth-child(even) { background-color: rgba(0, 156, 84, 0.10); }
    .key_info_box .scrollbox { height: 100%; max-height: 100%; padding: 5px; background-color: white; box-sizing: border-box; padding-bottom: 25px; -ms-overflow-style: none; }
    .has_key_info.open { padding-right: 250px; transition: padding-right 0.5s;}
    .has_key_info.closed { padding-right: 20px; transition: padding-right 0.5s; }
.invoicing_table {
    border-spacing: 0 0px;
    border-collapse: separate !important;
    margin-bottom: 5px;
    border-bottom: 1px solid black;
}
    /*.invoicing_table > table td:first-child, .invoicing_table > .scrollbox > table td:first-child {
        border-left: 1px solid black;
    }
    .invoicing_table > table td:last-child, .invoicing_table > .scrollbox > table tr:last-child {
        border-right: 1px solid black;
    }*/
.list_box > table { box-sizing: border-box; width: 100%; border-collapse: collapse; }
    .list_box > table tr:nth-child(even), .list_box > .scrollbox > table tr:nth-child(even) { background-color: #d9d9d9; }
    .list_box > table th, .list_box > .scrollbox > table th { background: linear-gradient(#ffffff, #d9d9d9); color: black; border: 1px solid black; text-align: left; font-weight: normal; cursor: pointer; }
    .list_box > table td, .list_box > table th, .list_box > .scrollbox > table td, .list_box > .scrollbox > table th { padding: 5px 5px; }
    .list_box > table tr a:hover, .list_box > .scrollbox > table tr a:hover { text-decoration: underline; }
    .list_box > table tr:hover, .list_box > .scrollbox > table tr:hover {background-color: rgba(0, 156, 84, 0.27);}
    .list_box > table td, .list_box > .scrollbox > table td { border-right: 1px solid black; border-top: 1px solid #B3B3B3; position: relative; }
        .list_box > table td:first-child, .list_box > .scrollbox > table td:first-child { border-left: 1px solid black; }
        .list_box > table td:last-child, .list_box .scrollbox > table td:last-child { border-right: 1px solid black; }
.list_box .warning { position: absolute; right: 10px; top: 7px; }
.white_bg { background-color: white; }
.status_block { display: inline-block; width: 12px; height: 12px; vertical-align: middle; margin-right: 5px; }
    .status_block.red { background-color: #D3343F; }
    .status_block.orange { background-color: orange; }
    .status_block.green { background-color: #009C54; }
    .status_block.redor { background-color: #E24B22; }
    .status_block.orgreen { background-color: yellow; }
    .status_block.blue { background-color: blue; }
.status_block { vertical-align: middle; }

/*filter panel styles at top of page*/
.main_content h1{display:inline-block;}
.add-new-button{display:inline-block;float:right;margin-top:5px;}
.list_options {padding:10px 0px 0px 0px;clear:both;}
.list_options a.btn { margin-left: 100px; }
.list_options .filter-panel{}
.list_options .filter-panel.panel-left{width:75%;float:left;}
.list_options .filter-panel.panel-right{width:25%;float:left;}
.list_options .filter-panel .filter-group{display:inline-block}
.list_options .filter-panel .filter-group .filter-element{display:inline-block;float:left;width:220px;padding-bottom:10px;}
.list_options.reporting .filter-panel .filter-group .filter-element{display:block;float:left;width:195px;padding-bottom:10px;}
.list_options .filter-panel .filter-group .filter-element label{display:block;}
.list_options .filter-panel .filter-group .filter-element select,
.list_options .filter-panel .filter-group .filter-element input[type="text"]{width:90% !important;}
.list_options.reporting .filter-panel .filter-group .filter-element select[multiple]{width:90% !important; height: 80px; }

.show-number-selector{clear:both;float:right;text-align:right;width:150px;} 
.client-list-options .show-number-selector,.programmes-list-options .show-number-selector,.user-list-options .show-number-selector,.company-list-options .show-number-selector{width:105px;} 
.show-number-selector .show-number-container{text-align:left;width:105px;} 
.show-number-selector select{width:100px !important;} 

th.sort_up, th.sort_down { position: relative; }
th.sort_up:after { position: absolute;  right: 0px; top: 0px; display:inline-block; width: 0; height: 0; border-top: 4px dashed; border-right: 4px solid transparent; border-left: 4px solid transparent; }

.valignmid > * { vertical-align: middle; }

/* ACCORDION */
.accordion_container { margin-top: 10px; }
    .accordion_container .header { z-index: 25; position: relative; color: black; background: linear-gradient(#ffffff, #d9d9d9);padding: 5px 10px; height: 30px; overflow: hidden; cursor: pointer; border-radius: 5px; border: 1px solid black; }
        .accordion_container .header:after { /*content: ''; position: absolute; right: 9px; top: 6px; background-image: url('../img/Hyphen-white.png'); background-size: contain; width: 17px; height: 17px; behavior: url(-ms-transform.htc); -moz-transform: rotate(90deg); -webkit-transform: rotate(90deg); -o-transform: rotate(90deg); -ms-transform: rotate(90deg); -webkit-transition: 0.5s ease-in-out; -moz-transition: 0.5s ease-in-out; -o-transition: 0.5s ease-in-out; transition: 0.5s ease-in-out;*/ }
        .accordion_container .header.close:after { /*-moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); -webkit-transition: 0.5s ease-in-out; -moz-transition: 0.5s ease-in-out; -o-transition: 0.5s ease-in-out; transition: 0.5s ease-in-out; */}
    .accordion_container .block > .body { padding: 10px; border: 1px solid black; border-radius: 3px; margin-top: -3px; }
    .accordion_container .form_container { margin-top: -5px; padding: 20px 10px 10px 10px;  /*display: none; /**/ }
    .accordion_container .action_bar { position: absolute; right: 7px; top: 5px; margin: 0px; cursor:pointer; background-image: url('/imgs/open-arrow.png'); background-size: 20px 60px; width: 20px; height: 20px; background-position: -20px; transform: rotate(90deg);transition: transform 0.5s;  }
    .accordion_container .header.close .action_bar { transform: rotate(270deg); transition: transform 0.5s; }
    .accordion_container.fixed { overflow: hidden; position: fixed; left: 20px; width: 295px; top: 279px; margin-top: 0; border: 2px solid #009C54; background-color: white; -webkit-transition: width 0.2s ease-in-out; -moz-transition: width 0.2s ease-in-out; -o-transition: width 0.2s ease-in-out; transition: width 0.2s ease-in-out; z-index: 99999; border: 1px solid #F2F2F2; -webkit-box-shadow: 10px 10px 50px -16px rgba(138, 136, 138, 0.33); -moz-box-shadow: 10px 10px 50px -16px rgba(138, 136, 138, 0.33); box-shadow: 10px 10px 50px -16px rgba(138, 136, 138, 0.33); }
        .accordion_container.fixed.restrict { }
        .accordion_container.fixed .form_container { height: 460px !important; overflow: auto; }
        .accordion_container.fixed .header { text-align: center; }
            .accordion_container.fixed .header:after { background-image: none; }
        .accordion_container.fixed .form_container { /*border: 2px solid #009C54;*/ }
        .accordion_container.fixed .form_container { padding: 8px; }
            .accordion_container.fixed .form_container .col_1_1 { width: 100%; }
            .accordion_container.fixed .form_container .col_1_2 { width: 50%; }
            .accordion_container.fixed .form_container .col_3_4 { width: 75%; float: left; }
            .accordion_container.fixed .form_container .col_1_4 { width: 25%; float: left; }
            .accordion_container.fixed .form_container .col_4_5, .key_info_box .form_container .col_4_5 { width: 80%; float: left; }
            .accordion_container.fixed .form_container .col_1_5, .key_info_box .form_container .col_1_5 { width: 20%; float: left; text-align: center; }
            .accordion_container.fixed .form_container .row { margin-bottom: 0px; }
.accordion_container-small-w { width: 63px !important; }
imagecontroller > div {border: 1px solid black; border-radius: 3px; padding: 5px; }
/* FORMS */
.form_container { background-color: white; padding: 10px; position: relative;  border: 1px solid black; border-radius: 5px; z-index: 20;}
    /*.form_container .left, .form_container .right { display: inline-block; width: 45%; min-width:530px; vertical-align: top; position: relative; }*/
    .form_container .left, .form_container .right { display: inline-block; width: 50%; min-width:300px; vertical-align: top; position: relative; }
    /*.form_container .left .left, .form_container .left .right, .form_container .right .left, .form_container .right .right  { min-width: 250px; }*/
    .form_container .left .left, .form_container .left .right, .form_container .right .left, .form_container .right .right  { min-width: 130px; }
    .form_container .grid { display: inline-block; width: 100%; vertical-align: top; position: relative; }
    .form_container .col_1_1 { /*float: left; width: 432px; width: 968px;*/ }
    .form_container .row { display: inline-block; height: auto; margin-bottom: 5px; width: 100%; }
    .form_container .col_1_2 { /*display: inline-block;*/ width: 50%; vertical-align: top; float: left; box-sizing:border-box; }
    .form_container .block .body .col_1_2 {  }
        .form_container .block .body .col_1_2 .col_1_2 { }
    .form_container .block .body .col_1_3 {  }
        .form_container .block .body .col_1_3 .col_1_2 { }
    .form_container .block > .body .box { background-color: white; padding: 5px; width: 17px; text-align: center; }
    .form_container .grid .col_1_2 .col_1_2 { width: 50%; }
    .form_container .grid .col_1_2 .col_1_1 { width: 455px; }
    .form_container .grid .col_1_3, .form_container .col_1_3 { /*display: inline-block;*/ width: 33.333%; vertical-align: top; /*position: relative;*/ float: left; }
    .form_container .grid .col_2_3, .form_container .col_2_3 { width: 66.666%; vertical-align: top; float: left; }
        .form_container .grid .col_1_3 .col_1_2 { width: 50%; }
        .form_container .grid .col_1_3 .col_1_1 { width: 250px; }
    .form_container .grid .col_1_4 { /*display: inline-block;*/ width: 25%; /*vertical-align: top;*/ /*position: relative;*/ float: left; }
        .form_container .grid .col_1_4 .col_1_2 { width: 50%; }
.block { margin-bottom: 20px; }
.form_container .block:last-child { margin-bottom: 0px; }
.form_container .left { padding-right: 5px; }
.form_container .right { padding-left: 5px; }
.form_container .left .left, .form_container .right .left {      }
/*.form_container .left { margin-right: 4%; }*/
.form_container .bottom { margin-right: 60px; }
.form_container span { display: block; }
.form_container .list_filters span { display: inline; }
.form_container .item_row1 { margin-bottom: 5px; }
.form_container .item_row2 { height: 125px; margin-bottom: 25px; }
.form_container label { margin-bottom: 12px; font-weight: bold; }
.form_container #action_bar { bottom: 30px; top: inherit; }
.table { position: relative; }
    .table.action_bar:after { /*content: '+'; position: absolute; width: 17px; height: 17px; right: 0; top: 0;*/ }
    .table.action_bar.close:after { /*content: '-';*/ }
    .table.action_bar.close { transform: rotate(270deg); transition: transform 0.5s; }
.padding_left_20 { padding-left: 20px !important; }
.padding_left_40 { padding-left: 40px; }
.margin_left_20 { margin-left: 20px; }
.height_auto { height: auto !important; }
.padding_top_10 { padding-top: 10px; }
.accordion_container .form_container .ui-selectmenu-button { width: 100% !important; }
.circuit_detail_table { background-color: #c6c6c6; display: table; }
    .circuit_detail_table, .circuit_detail_table input { color: #4F4F4F !important; }
        .circuit_detail_table .body { text-align: center; padding: 0 0px; font-size: 12px; }
            .circuit_detail_table .body .row { float: left; padding: 10px 0; border-bottom: 2px solid #B5DDA9; margin: 0; background-color: #D3F4E1; color: black; text-transform: uppercase; height: 12px; }
                .circuit_detail_table .body .row.selected { background-color: #c6c6c6; }
            .circuit_detail_table .body .box { float: left; width: 65px; text-align: center; padding: 0 0px; font-size: 12px; height: auto; font-size: 11px; }
            .circuit_detail_table .body ._box { float: left; }
        .circuit_detail_table.test_result .head { height: 120px; }
        .circuit_detail_table.test_result .box { height: auto; }
        .circuit_detail_table .body .row { /*padding: 0;*/ height: 30px; }
        .circuit_detail_table.test_result .body .row .box > span { padding-top: 10px; }
        /*.circuit_detail_table.test_result .ui-selectmenu-button.ui-widget.ui-state-default.ui-corner-all { height: 20px; }*/
        .circuit_detail_table .head .box { display: table-cell; vertical-align: middle; border-right: 1px solid grey; width: 65px; text-align: center; padding: 0 0px; font-size: 12px; }
        .circuit_detail_table .head ._box { display: table-cell; vertical-align: middle; height: 50px; border: 1px solid grey; border: 1px solid grey; border-bottom: 0; border-left: 0; }
            .circuit_detail_table .head ._box:last-child { border-right: 0; }
       }
        .circuit_detail_table .head .box:last-child { border: 0; }
/*.form_container thead, tbody { display:block;}*/
.form_container tbody { overflow: auto; }
.form_container table { width: 100%; border-spacing: 0; text-align: center; }
    .form_container table tr td:first-child { /*color: #009C54; color: #04C775;*/ }
    .form_container table tr td { padding: 5px; border-bottom: 1px solid #B3B3B3; }
    .form_container table.table_observation tr th { border-bottom: 1px solid #B3B3B3; }
    .form_container table.less_padding tr td { padding: 7px 5px; }
.form_container th { padding: 6px; }
.form_container table th { /*background-color: #009C54; color: white;*/ }
.form_container label { color: black; margin-bottom: 0px; display: block; max-width: 100%; font-size: 14px; text-align: left; padding: 0; }
.form_container label.btn { color: white; padding: 0 10px; }
.form_container .uploader label.btn:hover { color: black; padding: 0 10px; }
.form_container label.inline { display: inline-block; margin: 0 10px; cursor: pointer; }
.form_container .uploader label.inline { margin: 0; }
.form_container label.inline input[type=radio] { width: auto; }
    /*.form_container .grid label { text-align:right; padding: 0 20px;}*/
    .form_container label.info { color: grey; }
    .form_container label.header { color: black; background-color: #009C54; text-align: center; margin: 0; }
        .form_container label.header:after { background-image: none; }
    .form_container label.center { text-align: center !important; margin-bottom: 20px; }
    .form_container label.sm { color: grey; text-align: right !important; padding: 0 !important; padding-right: 15px !important; display: inline-block; min-width: 45px; }
.form_container input[type=text], .form_container input[type=tel],.form_container input[type=email].form_container input[type=file], .form_container input[type=number], .form_container input[type=password], .form_container select, .form_container textarea { width: 100%; }
.form_section .label-field-inline .item_row1{height:30px;}
.form_section .label-field-inline .item_row1 label{width:170px;}
.form_section .vertical-column-buttons button{width:100px;margin-bottom:10px;}

.form_container input[type=submit] { width: 50px; }
.remove_icon { line-height: 17px; background-color: red; border-radius: 50%; display: block; height: 20px; width: 20px; color: white; cursor: pointer; text-align: center; vertical-align: middle; box-sizing: border-box; padding-top: 0px; position: absolute; top: 5px; right: 5px; display: none;  }
.ass_file_row > .remove_icon { top: 0; right: 0; }
.item_row1:hover > .remove_icon, .ass_file_row:hover > .remove_icon { display: block; }
.ass_file_row { text-align: left; display: block; line-height: 20px; }
.ass_file_row > a { vertical-align: middle; }
.form_container.inline input, .form_container.inline select, .form_container.inline textarea, .form_container.inline label { width: auto; display: inline-block; vertical-align: middle; margin-bottom: 0; margin-right: 10px; }
/*.uploader { background-color: #F2F2F2; border: 3px dashed #808285; height: 75px; width: 100%; padding: 20px; box-sizing: border-box; margin-top: 5px; color: #808285; font-size: 12px;  }
    .uploader input[type=file] { display: none; }*/
.uploader { display: inline-block; width: 100%; margin-top: 1px; }
.uploader .filename{ display: inline-block;width:50%;vertical-align:middle;color:#999;font-size:90%;padding-top:2px;text-overflow:ellipsis;}
table input[type=checkbox] { width: auto; height: auto; float: none; }
.date_field { background-image: url('/imgs/Calendar-Icon.png'); background-repeat: no-repeat; background-position: right 5px center; cursor: pointer; background-size: 16px 15px; }
.col_1_1, .col_1_2, .col_1_3, .col_1_4 { min-height: 1px; }
.form_container .grid .col_1_1 label,
.form_container .grid .col_1_2:first-child label,
.form_container .grid .col_1_3:first-child label,
.form_container .grid .col_1_3:first-child .col_1_2 label,
.form_container .grid .col_1_4:first-child .col_1_2 label,
.form_container .grid .col_1_2:first-child .col_1_2 label,
.form_container .grid .col_1_1:first-child label { text-align: left; padding: 0; margin: 0; vertical-align: middle; }
.select_sm + span > span:first-child { display: none !important; /**/ background-color: #ff0000; }
/* webkit solution */
::-webkit-input-placeholder { font-style:italic; }
/* mozilla solution */
input:-moz-placeholder { font-style:italic; }
::-webkit-input-placeholder, input:-moz-placeholder,
.form_container .grid .col_1_2:last-child label,
.form_container .grid .col_1_3:last-child label,
.form_container .grid .col_1_3:last-child .col_1_2 label,
.form_container .grid .col_1_4:last-child .col_1_2 label,
.form_container .grid .col_1_2:last-child .col_1_2 label,
.form_container .grid .col_1_1:last-child label { text-align: right; padding: 0; }
.form_container .grid .col_1_4 .col_1_2 label,
.form_container .grid .col_1_3 .col_1_2 label,
.form_container .grid .col_1_2 .col_1_2 label,
.form_container .grid .col_1_1 label { padding: 0 20px; }
.ui-corner-all, .ui-corner-top { border-radius: 0; border: 0; height: 30px; background: #F2F2F2; }
.ui-datepicker-header.ui-corner-all { height: 28px; }
.ui-selectmenu-button .ui-icon { width: 30px; height: 30px; }
.ui-selectmenu-button .ui-icon-triangle-1-s { background-position: 0px 0px; }
.ui-selectmenu-button span.ui-icon { top: 0; right: 0; margin-top: 0; }
.ui-selectmenu-button.ui-state-hover .ui-icon, .ui-selectmenu-button.ui-state-focus .ui-icon, .ui-selectmenu-button.ui-state-default .ui-icon { background-image: url('/img/SelectArrow.png'); }
.ui-menu-item.ui-state-focus { background: none; }
.ui-widget { font-size: 14px; }
.ui-datepicker-calendar { background-color: #F2F2F2; border: 1px solid #808285; }
.ui-datepicker-header { background-color: #009C54 !important; color: white; }
.ui-datepicker { padding: 0; }
.ui-widget-content .ui-state-default, .ui-widget-content .ui-state-hover { background: none; }
.ui-datepicker td { padding: 0px; width: 32px; }
    .ui-datepicker td a { height: 24px; }
.ui-datepicker th { padding: 0.4em 0.3em; }
.ui-datepicker-next.ui-corner-all, .ui-datepicker-prev.ui-corner-all { background-color: #009C54; cursor: pointer; }
.ui-datepicker-next.ui-state-hover, .ui-datepicker-prev.ui-state-hover { border: 0; }
.ui-spinner { width: 100%; }
.ui-selectmenu-button span.ui-selectmenu-text { padding: 0.4em 2.1em 0.4em 0.4em; }
.ui-selectmenu-menu .ui-menu { max-height: 140px; }
.ui-state-default, .ui-corner-right { border: 0; border-bottom-right-radius: 0px; border-top-right-radius: 0px; }
.custom-combobox { position: relative; display: inline-block; }
.custom-combobox-toggle { position: absolute; top: 0; bottom: 0; margin-left: -30px; padding: 0; }
.custom-combobox-input { margin: 0; padding: 5px 10px; }
.custom-combobox a { background-image: url('/img/SelectArrow.png') !important; }
.custom-combobox input { border-radius: 0; border: 0; height: 30px; background: #F2F2F2; }
.custom-combobox a span, .ui-state-default .ui-icon { background-image: none; }
.accordion_container { -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
.block img { height: 90px; display: block; margin-left: auto; margin-right: auto; }
.float_left { float: left !important; }
.float_right { float: right !important; }
.box_signature { height: 90px; }
    .box_signature img { height: 90px; display: block; margin-left: auto; margin-right: auto; }
.box input[type="text"] { padding: 0 5px; height: 20px; width: 30px; text-align: center; }
.space { float: left; height: 18px; width: 100%; }
.space_v-10 { float: left; height: 10px; width: 100%; }
.space_v-20 { float: left; height: 20px; width: 100%; }
.space_h-20 { float: left; height: 30px; width: 20px; }
.display_none { display: none !important; }
.margin_bottom-10 { margin-bottom: 10px !important; }
#search_bar { background-color: #009C54; padding: 3px; position: absolute; right: 20px; top: 75px; }
    #search_bar input[type=text] { width: 250px; background-color: white; }
nav#menu { position: absolute; top: 75px; right: 20px; background-color: #008E50; color: white; z-index: 1000; text-align: right; width: 200px; }
    nav#menu > a, nav#menu > div > a { padding: 10px; display: block; }
    nav#menu a { color: white; cursor: pointer; }
    nav#menu ul { background-color: #009C54; list-style: none; margin: 0; padding: 0; }
    nav#menu li { padding: 5px; border-bottom: 1px solid #008E50; }
        nav#menu li a { font-weight: normal; }
        nav#menu li:last-child { border-bottom: 0; }
.scrollbox { max-height: 400px; overflow-y: scroll; }
.scrollbox.small { max-height: 110px;}
.scrollbox.border { border: 1px solid black; padding: 5px; margin-bottom: 10px; }
    .scrollbox input[type=checkbox] { float: none; }
.inline input, .inline select, .inline textarea, .inline label { display: inline; width: 250px; vertical-align: middle; }
.inline input[type=checkbox] { width: auto; }
td > input[type=checkbox] { margin-top: 0; width: auto; }
.ui-selectmenu-button { vertical-align: middle; display: inline-block !important; }
.schedule_header_row { background-color: #646464; color: white; text-transform:uppercase;}
select, input[type=text], textarea { font-size: 14px; color: black; font-family: Tahoma, Verdana; }
/*.select_wrapper { overflow: hidden; background: url('/img/SelectArrow.png') no-repeat right #F2F2F2; }
    .select_wrapper select { background: transparent; border: 0;  line-height: 1; border-radius: 0; height: 28px; -webkit-appearance: none; font-weight: normal; color: #212121; cursor:pointer}
     .select_wrapper select:disabled { background-color: #C6C6C6;     background: url('/img/SelectArrow_disabled.png') no-repeat right #F2F2F2;   cursor: auto;}
        .select_wrapper select:focus { outline: none; }*/
#saving_status { position: fixed; bottom: 45px; width: 200px; left: 50%; margin-left: -100px; display: none; font-weight: bold; font-size: 20px; color: white; z-index: 100; }
#saving_status > span { padding: 5px; background-color: gray; color: white; }
#saving_status > span.red { background-color: #D3343F; color: white; }
#saving_status > span.green { background-color: #009C54; color: white; }
option { padding: 0px; }
.logout_btn { color: white; cursor: pointer; }
.logout_btn:hover { text-decoration: underline; }

/*imagecontroller*/
/*.horizontal_scroll { width: 100%; height: 133px; overflow-x: scroll; background-color: transparent; margin: 20px 0px; }*/
.horizontal_scroll { width: 100%; height: 133px; overflow-x: scroll; background-color: #F2F2F2; /* margin: 20px 0px; */ padding: 20px 0; }
.image_item { width: 100px; text-align: center; display: inline-block; height: 100px; margin: 0 10px; }
    .image_item > div { width: 100px; height: 75px; text-align: center; background-image: url('/img/159-2.GIF'); background-position: center; background-size: 30px 30px; background-repeat: no-repeat; background-color: white; -webkit-box-shadow: inset 1px 1px 20px -4px rgba(0,0,0,0.30); -moz-box-shadow: inset 1px 1px 20px -4px rgba(0,0,0,0.30); box-shadow: inset 1px 1px 20px -4px rgba(0,0,0,0.30); }
        .image_item > div > img { max-width: 100px; max-height: 75px; display: block; margin-bottom: 10px; }

    .image_item > label { text-align: center; display: inline; }
    .image_item > input { float: none; display: inline; }
        .image_item > input[type=checkbox] { width: 20px; }
.schedule_section { display: none; }

/*pagination*/
.pagination_box { width: 100%; text-align: right; margin-top: 10px; color: #008E50; }
.prev, .pages, .next { display: inline-block; width: 50px; text-align: center; }
.pages { width: 140px; }
    .pages > a { display: inline-block; margin: 0 5px; }
    .pages .selected {  }
    .prev a, .pages a, .next a { cursor: pointer; color: #008E50; }

/*sortination*/
.sort_down { background: url('/img/DownArrow.png') center left no-repeat; }
.sort_up { background: url('/img/UpArrow.png') center left no-repeat; }
label.check_item { display: block !important; height: 30px; vertical-align: top; line-height: 30px; margin-bottom: 20px; }
.check_item:nth-child(2n + 1) { margin-right: 0px; }
.check_item > span, .check_item > input[type=checkbox] { vertical-align: middle; display: inline; }
.check_item[type=checkbox] { width: 30px; height: 30px; }
.auditlog.list_box table { text-align: left; }
    .auditlog.list_box table td { border-bottom: 1px solid gray; }
.draggable { z-index: 9999; }
.draggableIcon { display: block; height: 30px; width: 30px; position: absolute; right: 0px; top: 0px; line-height: 25px; background-color: #038C53; cursor: pointer; z-index: 999; }
    .draggableIcon:before { position: absolute; content: '»'; height: 30px; width: 30px; right: 0; top: 1px; }
    .draggableIcon.close:before { content: '«'; }

span.label-counter { line-height: 10px !important; background-color: #009C54; color: white; padding: 5px; display: inline-block; border-radius: 4px; font-size: 10px; position: absolute; left: 0; top: 0; display: none; }
.bg-red { background-color: rgb(211, 52, 63) !important; }

.cursor_move { cursor: move; }
.cursor-grabbing { cursor: -webkit-grabbing !important; }
.border_table_grid { border-right: 1px dotted #E0E0E0; }

    .form_section { padding: 5px; border: 1px solid black; border-radius: 3px; }

/* Header-Menu-Style
–––––––––––––––––––––––––––––––––––––––––––––––––– */
#nav_sub { width: 100%; -moz-box-shadow: inset 0 0 10px #000000; -webkit-box-shadow: inset 0 0 10px #000000; box-shadow: inset 0px 4px 10px rgba(0, 0, 0, 0.1); height: 44px; }
    #nav_sub ul { text-align: left; display: inline-block; margin: 0; -webkit-margin-end: 0px; -webkit-padding-start: 0px; list-style: none; z-index: 99; }
        #nav_sub ul:first-child > li { /*display: inline-block;*/ float: left; position: relative; height: 44px; line-height: 44px; /*background: #fc9230;*/ cursor: pointer; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; -ms-transition: all 0.2s; -o-transition: all 0.2s; transition: all 0.2s; }
        #nav_sub ul li a { text-decoration: none; color: black; display: block; padding: 0 15px; /*height: 36px;*/ text-decoration: none !important; }
        #nav_sub ul:first-child > li:hover, #nav_sub ul:first-child > li.active_menu { background-color: darkgray; }
            #nav_sub ul:first-child > li:hover a, #nav_sub ul:first-child > li.active_menu a { color: black; text-decoration: none; }
        #nav_sub ul li ul { padding: 0; max-height: 600px; overflow:auto; position: absolute; padding: 5px 10px; background-color: #d9d9d9;  top: 44px; right: 0; min-width: 350px; opacity: 0; visibility: hidden; -webkit-transiton: opacity 0.2s; -moz-transition: opacity 0.2s; -ms-transition: opacity 0.2s; -o-transition: opacity 0.2s; -transition: opacity 0.2s; }
    #nav_sub > ul > li > ul > li, #nav_sub > ul > li > ul > li > a { display: block; height: 30px; line-height: 30px; border-bottom: 1px solid white; }
        #nav_sub > ul > li > ul > li > a { padding: 0 10px; }
        #nav_sub > ul > li > ul > li:last-child, #nav_sub > ul > li > ul > li:last-child > a { border-bottom: 0px; }
    #nav_sub > ul > li:hover > ul { display: block; opacity: 1; visibility: visible; }
    #nav_sub > ul > li > ul > li > a:hover:after { content: ' '; background-position: center center; width: 8px; height: 8px; position: absolute; right: 19px; top: 15px; }
    #nav_sub > ul > li > ul > li:hover > a { position: relative; background-color: darkgray; }
    #nav_sub > ul > .active { /**/ background-color: #6C6A6A !important; border-bottom: 36px solid #6C6A6A !important; }
.nav_sub_wrapper { background-color: #d9d9d9; padding: 0; text-align: left; display: none; position: fixed; top: 50px; left: 150px; z-index: 99; width: 100%; padding-left: 50px; }
.ui-corner-all, .ui-corner-top { border-radius: 0; border: 0; height: auto; background: #F2F2F2; }
.status-square { display: inline-block !important; width: 12px; height: 12px; vertical-align: middle; margin-right: 5px; }
.status-label { display: inline-block !important; vertical-align: middle; }
/*Status colors*/
/*Default*/
.status-0 { background-color: Grey; }
/*Pend. Assignment*/
.status-1 { background-color: #D3343F; }
/*Assigned*/
.status-2 { background-color: #E24B22; }
/*With Engineer*/
.status-3 { background-color: orange; }
/*Certification*/
.status-4 { background-color: #009C54; }
/*I Don't Know*/
.status-5 { background-color: grey; }
/*No Access*/
.status-6 { background-color: #D3343F; }

.locking_box { position: fixed; left: 0; bottom: 0px; width: 100%; font-size: 14px; padding: 5px; z-index: 30; padding-left: 60px; box-sizing: border-box; text-align: center; }
    .locking_box.red { background-color: #D3343F; color: white; }
    .locking_box.green { background-color: #009C54; color: white; }

input.ng-dirty.ng-invalid, select.ng-dirty.ng-invalid { border: 1px solid #D3343F; }

.error {
    line-height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 10px;
}

    .error.green {
        background-color: #009C54;
        color: white
    }

    .error.red {
        background-color: #D3343F;
        color: white;
    }

.header_home { position: absolute; top: 84px; left: 244px; }

select.ui-datepicker-month, select.ui-datepicker-year { background-color: #009C54; color: white; height: 20px; vertical-align: top; padding: 0; }
div.ui-datepicker-buttonpane > button.ui-datepicker-close, div.ui-datepicker-buttonpane > button.ui-datepicker-current { padding: 0; border: 0; font-size: 12px; text-transform: uppercase; font-weight: bold; color: #009C54; margin: 0; margin-right: 5px; }
div.ui-datepicker-buttonpane > button.ui-datepicker-current { margin-left: 5px; }
#version { position: absolute; bottom: 0px; right: 10px; color: white; }


#loader { width: 100%; height: 100%; position: fixed; top: 0; left: 0; text-align: center; background-color: white; opacity: 0.5; z-index: 1000000; }
    #loader img { margin-top: 300px; }

#jobs_table td { height: 40px; }
.thick_rows td { height: 40px; }

/*@font-face { font-family: 'exobold'; src: url('font/exo2.0-bold-webfont.eot'); src: url('font/exo2.0-bold-webfont.eot?#iefix') format('embedded-opentype'), url('font/exo2.0-bold-webfont.woff2') format('woff2'), url('font/exo2.0-bold-webfont.woff') format('woff'), url('font/exo2.0-bold-webfont.ttf') format('truetype'), url('font/exo2.0-bold-webfont.svg#exo_2.0bold') format('svg'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'exoregular'; src: url('font/exo2.0-regular-webfont.eot'); src: url('font/exo2.0-regular-webfont.eot?#iefix') format('embedded-opentype'), url('font/exo2.0-regular-webfont.woff2') format('woff2'), url('font/exo2.0-regular-webfont.woff') format('woff'), url('font/exo2.0-regular-webfont.ttf') format('truetype'), url('font/exo2.0-regular-webfont.svg#exo_2.0regular') format('svg'); font-weight: normal; font-style: normal; -webkit-font-smoothing: antialiased; }
@font-face { font-family: 'exolight'; src: url('font/exo2.0-light-webfont.eot'); src: url('font/exo2.0-light-webfont.eot?#iefix') format('embedded-opentype'), url('font/exo2.0-light-webfont.woff2') format('woff2'), url('font/exo2.0-light-webfont.woff') format('woff'), url('font/exo2.0-light-webfont.ttf') format('truetype'), url('font/exo2.0-light-webfont.svg#exo_2.0light') format('svg'); font-weight: normal; font-style: normal; -webkit-font-smoothing: antialiased; }
@font-face { font-family: 'exoitalic'; src: url('font/exo2.0-italic-webfont.eot'); src: url('font/exo2.0-italic-webfont.eot?#iefix') format('embedded-opentype'), url('font/exo2.0-italic-webfont.woff2') format('woff2'), url('font/exo2.0-italic-webfont.woff') format('woff'), url('font/exo2.0-italic-webfont.ttf') format('truetype'), url('font/exo2.0-italic-webfont.svg#exo_2.0italic') format('svg'); font-weight: normal; font-style: normal; }*/




.black_overlay { /*display: none;*/ position: fixed; top: 0%; left: 0%; width: 100%; height: 100%; background-color: black; z-index: 1001; -moz-opacity: 0.8; opacity: .80; filter: alpha(opacity=80); }

.cert_options_popup { /*display: none;*/ position: fixed; top: 35%; left: 35%; width: 250px%; height: 250px%; padding: 16px; border: 5px solid #009C54; background-color: white; z-index: 1002; overflow: auto; }

.pop_up_close_button { margin-top: 20px; margin-left: auto; margin-right: auto; }

.section_1 h2 { font-size: 17px !important; color: black; margin-bottom: 0px; }
.section_2 { background: linear-gradient(#ffffff, #d9d9d9); border: 1px solid black; border-radius: 5px; padding: 3px; font-size: 14px; color: black; margin-top: 15px; height: 32px; line-height: 24px; }
.section_2 h2 { margin: 0; font-size: 16px; }
.section_1 { border-top: 2px solid black; padding: 3px; margin-top: 10px; }
.fright { float: right; }
.mt10 { margin-top: 10px; }
img.control { width: 23px; }
img.control.pencil { width: 18px; }
img.control.question_mover { width: 20px; }
.section_2 select, .section_1 select, .section_2 input, .section_1 input { height: 23px;}
.editor .filter_btn { width: 23px; height: 23px; }
.editor .filter_btn.add { margin-right: 3px; }
.editor btn { background-color: #009C54; color: white; height: 23px; display: inline-block; line-height: 23px; margin-left: 3px; cursor: pointer; padding: 0 5px; }
.editor btn.red { background-color: #D3343F; }
.editor select { display: inline-block; padding: 2px; }
#section_sortable > .placeholder { border: 2px dashed black; }
.question_table .placeholder { border: 1px dashed black; min-height: 50px; }
.section_2 .fright > *, .section_1 .fright > * { vertical-align: middle; }
.section_1 input[type=text], .section_2 input[type=text] { width: 500px; border: 1px solid #009C54; background-color: white; }
.section_1 select {border: 1px solid #009C54; }
.question_table { table-layout: fixed; width: 100%; background-color: white; border-collapse: collapse; border-spacing: 0; }
.question_table tr { border-bottom: 1px solid black; }
    .question_table tr:last-child, .question_table tr:first-child { border-bottom: 0px; }
.question_table td { width: 395px; padding: 3px; box-sizing: border-box; }
.question_table .hidden_cell { display: none; }
.question_table textarea { width: 100%; height: 40px; background-color: white; border: 1px solid #009C54; box-sizing:border-box; }
.question_table tr td:last-child { width: 200px; }
.editor a { cursor: pointer; }
.hidden { display: none; }
input[type=checkbox]+span.checkbox { width: 18px; display: inline-block; height: 18px; box-sizing: border-box; border: 1px solid #009C54; cursor: pointer; }
input[type=checkbox]:checked+span.checkbox { line-height: 18px; text-align: center; color: white; background-color: green; }
input[type=checkbox]:checked+span.checkbox:before { content: '\2713'; }
#section_sortable input[type=checkbox] { float: none; }
.question_table .options_box { height: 23px; width: 88px; }
.question_table btn { vertical-align: middle; }
.small_tb { width: 60px; height: 23px; }
.large_tb { width: 360px; height: 23px; }
.med_tb { width: 200px; height: 23px;}
textarea.large_tb { height: 75px; }
p.q_para { word-break: break-word; }
#new_survey .question_table { width: 950px; }
#new_survey .question_table td { width: 50%; }
#new_survey .question_table td p { text-align: left; color: black; font-weight: normal; }
#new_survey .survey_radio { display: inline-block; }
#new_survey input[type=radio] { width: auto; }
#new_survey .survey_radio span { display: inline; }
#new_survey .radio_list { text-align: left; }
#new_survey .question_table tr:first-child td { border-bottom: 0; }
#new_survey .question_table tr:last-child td { border-bottom: 0; }
#new_survey .section_container > div { border-top: 0; }
.camera_btn > img { height: 23px; width: 23px; vertical-align: middle; margin-left: auto; }
.camera_btn { float: right; }

#ui-datepicker-div { z-index: 1000000 !important; }

.circuit_container { width: 100%; height: 515px; position: relative; margin-top: 4px; overflow: hidden; }
.designation_list { position: absolute; left: 0; top: 0; width: 250px; z-index: 20; height: 500px; border-right: 2px solid #009C54; box-shadow: black -1px 0px 10px; }
.details_list { position: absolute; left: 0; top: 0; width: 100%; box-sizing: border-box; padding-left: 250px; z-index: 10; height: 516px; }
.details_list .horizontal_scroll { width: 100%; height: 100%; padding: 0; }
.details_list .horizontal_scroll .head, .designation_list .head { width: 1887px; height: 93px; background-color: #c6c6c6; color: black; }
    .details_list .horizontal_scroll .head.eighteenth, .designation_list .head.eighteenth { width: 1967px; }
    .details_list .horizontal_scroll .head.subhead, .designation_list .head.subhead { height: 40px; }
    .designation_list .head { width: 100%; }
.details_list .horizontal_scroll .head .box, .designation_list .head .box { display: table-cell;  vertical-align: middle; border-right: 1px solid black; text-align: center; font-size: 12px; }
.details_list .horizontal_scroll .head ._box { display: table-cell; vertical-align: middle; border: 1px solid black; border-bottom: 0; border-left: 0; }
.details_list .horizontal_scroll .head ._box:last-child, .details_list .horizontal_scroll .head .box:last-child, .designation_list .head .box:last-child { border-right: 0; }
.flood_fill { width: 85% !important; height: 26px !important; margin-top:5px; }
.designation_scroll { width: 100%; height: 384px; overflow-y: scroll; border-bottom: 17px solid #c6c6c6; }
.circuit_results_scroll { width: 1887px; height: 366px; overflow-y: scroll;}
    .circuit_results_scroll.eighteenth { width: 1967px; }
.circuit_container .table_observation tr { height: 41px; }
.insulation_resistance { width: 240px; }
.insulation_resistance.eighteenth { width: 301px; }
.circuit_rcd { width: 119px; }
.circuit_rcd.eighteenth { width: 60px; }

.circuit-menu { display: inline-block; position: relative; }
.circuit-menu .circuit-menu-button{padding:4px;cursor:pointer;cursor:hand;}
.circuit-menu .circuit-menu-button img{display:block;}
.circuit-menu-content{display:none;position:absolute;background-color:white;box-shadow:0px 0px 4px #999;width:150px;top:0px;left:20px;margin-bottom:10px;}
.circuit-menu-content .close-circuit-menu-button{position:absolute;top:0px;right:0px;display:inline-block;padding:0px 5px;cursor:pointer;cursor:hand;}
.circuit-menu-content .close-circuit-menu-button:hover{background-color:red;color:white;}
.circuit-menu-content div{padding:10px;border-bottom:solid 1px #ddd;text-align:left;cursor:pointer;cursor:hand;}
.circuit-menu-content div:last-child{border-bottom:none;}
.circuit-menu-content-show{display:block;}

select[disabled=disabled] { opacity: 0.5; }

.popover_box { border-radius: 3px; display: none; position: absolute; z-index: 100000; margin: 0 auto; top: 0px; box-shadow: black 0px 0px 10px; width: 400px; background-color: white; padding: 20px; }
    .popover_box .exit { position: absolute; top: 2px; right: 6px; cursor: pointer; padding: 2px; font-weight: bold; }
    #permissions_popover label { -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; cursor: pointer; margin-bottom: 5px; }
    .link_link { font-weight: normal; float: right; font-size: 12px; cursor: pointer; }
    .link_link:hover { text-decoration: underline; }
    #report_settings_popover { width: 600px; top: 200px; }
    #report_settings_popover a { cursor: pointer; }
    .title_btn { margin-right: 21px; margin-top: 8px; }
    

    .nobold { font-weight: normal !important; }

.download-template-link{padding-top:10px;}

.download-template-link a{font-size:90%;color:#999;margin-top:10px;}



    .nobold { font-weight: normal !important; }

    .generating_report { margin: 20px auto; padding: 50px; border: 1px solid black; font-size: 40px; text-align: center; border-radius: 10px; width: 600px; }
    .key_info_title { font-weight: bold; font-size: 14px; margin-bottom: 5px; }

    /*.stat_box { font-size: 14px; color: white; font-weight: bold; width: 10%; padding: 10px 5px; float: left; margin: 0.5%; text-align: center; height: 100px; position: relative; }
    .stat_box.green { background-color: #009C54; }
    .stat_box.red { background-color: #D3343F; }
    .stat_box.blue { background-color: #3999b4; }
    .stat_box.yellow { background-color: #d3c200; }
    .stat_box.gray { background-color: #808285; }
    .stat_box.dark_blue { background-color: #0c0ba0; }
    .stat_box.light_green { background-color: #16a783;}
    .stat_box.purple { background-color: #936; }
    .stat_box.black { background-color: black; }
    .stat_box.green .total { color: #009C54; }
    .stat_box.red .total { color:  #D3343F; }
    .stat_box.blue .total { color:  #3999b4; }
    .stat_box.yellow .total { color:  #d3c200; }
    .stat_box.gray .total { color:  #808285; }
    .stat_box.dark_blue .total { color:  #0c0ba0; }
    .stat_box.light_green .total { color:  #16a783;}
    .stat_box.purple .total { color:  #936; }
    .stat_box.black .total { color:  black; }
    .stat_box .total {  width: 100%; text-align: center; font-size: 40px; font-weight: normal; display: block; }
    .clear { clear: both; }
    .stat_box .sub { font-size: 12px; }*/

    .stat_box { font-size: 14px; color: white; width: 10%; padding: 10px 5px; float: left; margin: 0.5%; text-align: center; height: 100px; position: relative; cursor: pointer; }
    .stat_box.green { background-color: #009C54; }
    .stat_box.red { background-color: #D3343F; }
    .stat_box.blue { background-color: #3999b4; }
    .stat_box.yellow { background-color: #d3c200; }
    .stat_box.gray { background-color: #808285; }
    .stat_box.dark_blue { background-color: #0c0ba0; }
    .stat_box.light_green { background-color: #16a783;}
    .stat_box.purple { background-color: #936; }
    .stat_box.pink { background-color: #c69; }
    .stat_box.black { background-color: black; }
    .stat_box .total { position: absolute;  width: 100%; bottom: 5px; left: 0; text-align: center; font-size: 40px; }
    .clear { clear: both; }
    .stat_box .sub { font-size: 12px; }

    /*select > option:checked, select > option:hover {
                box-shadow: 0 0 10px 100px #009C54 inset;
                transition: all .2s ease-in-out;
            }*/

    .report_summary { border: 1px solid black; border-radius: 5px; padding: 10px; margin-top: 10px; margin-bottom: 10px; }
  
    .section_2+table { display: none; }
    .section_2 { cursor: pointer; user-select: none; position: relative; }
    
    .section_1 div.arrow_down, .section_1 div.arrow_up { display:none; }
    div.arrow_up { width: 0; height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-bottom: 5px solid black; font-size: 0; line-height: 0; position: absolute; right: 100px; top: 12px; }
    div.arrow_down { width: 0; height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 5px solid black; font-size: 0; line-height: 0; position: absolute; right: 100px; top: 12px; }

    .dashboard_line { text-align: center; margin-left: -30px; height: 400px; overflow: hidden; }
    .swingometer { display: inline-block; width: 250px; height: 200px; margin-bottom: 20px; vertical-align: top; }
    .singometer_graph.k-gauge > div { margin: auto; }
    .swingometer_title { text-align: center; }
    .swingometer_main_title { text-align: center; margin-top: 0px; margin-bottom: 10px; font-size: 16px; color: rgb(142, 142, 142); }

    #img_logo {     position: absolute; right: 0; top: -30px; height: 90px; display: none; }
.download_template { margin-top: 10px; font-size: 11px; text-decoration: underline; }
.k-overlay { z-index: 100005 !important; }
.k-widget.k-window { z-index: 100006 !important; }
.calendar_filters { border: 1px solid black; border-radius: 5px; padding: 5px; text-align: right; margin-bottom: 10px; }
.calendar_filters > * { vertical-align: middle; }
.calendar_filters .address { text-align: left; float: left; font-size: 18px; }
.link_alike { color: #009C54; cursor: pointer; }
.link_alike:hover { text-decoration: underline; }
.link_alike.red { color: #D3343F; }

.k-scheduler .k-scheduler-toolbar .k-state-selected { background-color: #009C54 !important; border-color: #009C54 !important; }
.k-state-default { border-color: black !important; }
.k-scheduler .k-header li { }

.sor_table { table-layout: fixed; }
#saving_float { position: fixed; z-index: 1000; right: 100px; width: 200px; font-size: 20px; height: 40px; line-height: 20px; bottom: 50px; background-color: white; padding: 5px; }
#saving_float.gray { border: 5px solid gray; color: gray; }
#saving_float.green { border: 5px solid #009C54; color: #009C54; }
#saving_float.red { border: 5px solid #D3343F; color: #D3343F; }

/*shading for highlighted rows*/
.alert-red { background-color:red !important;color:white;}
.alert-red a {color:white;}
.alert-red:hover{ background-color:red !important;color:white;}
.alert-orange { background-color:orange !important;color:black;}
.alert-orange a{ color:black;}
.alert-orange:hover{ background-color:orange !important;color:black;}

.schedule_header_row { color: white; }
.schedule_section, .schedule_section_2  { color: black !important; }

@media print {
   .k-scheduler,
   .k-scheduler-content,
   .k-scheduler-times
   {
      height: auto !important;
   }

   .k-scheduler-content
   {
      overflow-y: scroll !important;
   }

   .k-ff .k-scheduler-content
    {
        margin-right: 17px !important;
    }
   @page { size: landscape; }
    #viewappointment_popover { -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1); left: 100px; width: 100%; }   
    
}