﻿/* angular specific style for cloak directive */

[ng\:cloak], [ng-cloak], .ng-cloak { display: none; }

textarea {
   font-family: inherit;
   font-size: inherit;
    color: inherit;
}

/* label,select {
    color: #676767 !important;
} */
/*important is needed for the time being to override the old and ugly styles from webforms Telerik RadStyleSheet */
input[type="checkbox"] {
    width: 15px !important;
    height: 15px !important;
    vertical-align: middle !important;
    position: static !important;
}


a:link.styled-link, a:visited.styled-link{
    font-size: 10px;
    text-decoration: none;
    color: #2587C4;
}

a:hover.styled-link, a:focus.styled-link{
    color: #2CA0E8;
}

.borderlessbutton, .borderlessbutton:link, .borderlessbutton:active, .borderlessbutton:visited  {
    background: none;
    border: none;
    color: #45b1b7;
}

.borderlessbutton:hover, .borderlessbutton:focus {
    background: none;
    border: none;
    color: #35898e;
    outline: 0;
}

.coi-button, .coi-button:link, .coi-button:visited,
.coi-buttonNew, .coi-buttonNew:link, .coi-buttonNew:visited{ 
    background-color: #596164;
    border-color: #596164;
    color: #fff;
}

.coi-button:hover, .coi-button:focus,
.coi-buttonNew:hover, .coi-buttonNew:focus{
    background-color: #004456;
    border-color: #004456;
    color: #fff;
    outline: 0;
}

.coi-button:active,
.coi-buttonNew:active{
    background-color: #002c37;
    border-color: #002c37;
    text-decoration: none;
     color: #fff;
    border: 0 none;
}


.primarybutton, .primarybutton:link,
.primarybuttonNew, .primarybuttonNew:link{
    background-color: #004456;
    border-color: #004456;
    color: #fff;
}

.primarybutton:active,
.primarybuttonNew:active{
    background-color: #004456;
    border-color: #004456;
    color: #fff;
    outline: 0;
}

.primarybutton:hover, .primarybutton:focus,
.primarybuttonNew:hover, .primarybuttonNew:focus{
    background-color: #004456;
    border-color: #004456;
    color: #fff;
    outline: 0;
}

.secondarybutton:hover, .secondarybutton:focus {
    background-color: #596164;
    border-color: #596164;
}

.secondarybutton,.secondarybutton:active {
    background-color: #2e3233;
    border-color: #2e3233;
}

.primarybutton, .coi-button, .primarybutton:link, .coi-button:link, .disabledbutton,.disabledbutton:link{
    width: 150px;
}
.borderlessbutton, .borderlessbutton:link {
    width: 75px;
}

.primarybutton, .coi-button, .borderlessbutton,.primarybutton:link, .coi-button:link, .borderlessbutton:link,.disabledbutton,.disabledbutton:link,
.coi-buttonNew, .coi-buttonNew:link, .primarybuttonNew, .primarybuttonNew:link{
    border-radius: .25rem;
    cursor: pointer;
    display: inline-block;

    padding: 5px;
    margin-top: 10px;
    margin-bottom: 0px;
    line-height: 20px;
    text-transform: none;
    text-align: center;
    text-decoration: none;
    -moz-min-width: 70px;
    -ms-min-width: 70px;
    -o-min-width: 70px;
    -webkit-min-width: 70px;
    min-width: 70px;

    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    -o-user-select:none;
    user-select:none;

    white-space: nowrap;
    
    border: 1px solid transparent;
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
}

.primarybutton:visited, .coi-button:visited, .coi-buttonNew:visited, .primarybuttonNew:visited{
    color: #fff;
}

.disabledbutton,.disabledbutton:link,.disabledbutton:visited,.disabledbutton:hover,.disabledbutton:focus,.disabledbutton:active {
    background-color: #d4dbdd;
    border-color:#d4dbdd;
    cursor: default;
    color: #ffffff;
}

.disabled, .disabled:visited, .disabled:hover,.disabled:link, .disabled:focus, .disabled:active {
    cursor: default;
   -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
    -moz-filter: alpha(opacity=40);
    -o-filter: alpha(opacity=40);
    filter: alpha(opacity=40);
    opacity: 0.4;
}

.button-bordered {
    border: 1px solid #cccccc !important;
}

/* Kendo Window*/
.k-window-title {
    font-weight: bold;
    text-align: center;
    color: #676767;
}


/* used to prevent body from scrolling when modal is open*/
.noscroll {
    /* overflow: hidden; */
}
 /*Form styles*/
 /* asp.net telerik radstylesheet is loading after kendo styles sometimes when used in the old pages overriding the uniform style used in kendo treeview*/
 label.node {
     color: #676767 !important;
 }

 .field label {
 }

 .field {
    font-size: 12px; 
 }
.field label,.field input {
    
    display: block;
    color: #676767 !important;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 3px;
}

/*.field input:focus {
    border: 1px solid blue !important;
}*/

.cell {
    display: table-cell;
}

 .required label:after {
    font-size:12px;
    content: ' *';
    color: #f00;
    display: inline;
 }

 span.required:after {
    font-size:12px;
    content: ' *';
    color: #f00;
    display: inline;
 }
 select.coi-select {
     font-family: 'Open Sans', sans-serif;
     font-size: 12px;
     /*line-height: 1;
     -webkit-appearance: none;
     outline: none;*/

     /*background-image: url();*/
     background-repeat: no-repeat;
     /*background-position: 100px;*/
     width: 125px;
     /*padding: 2px;*/

 }
 
 /* angular validation styles*/

 form.submitted .ng-invalid
{
    border-color: #f00 !important;
}


input.valid {
     border: 1px solid green;
 }

.error {
    color: #f00 !important;
}

.small {
    font-size: 10px;
}

/* iframe shim*/

.iframeshim-wrapper {
    z-index: 10003;
    /*position: relative;*/
}

.iframeshim-wrapper .shimcontent-wrapper {
    margin: 0;
    padding: 0;
    overflow: hidden;
    width: 100%;
    height: 100%;
    
}
.iframeshim-wrapper .iframe-shim {
    /*position: absolute;*/
     /*position: absolute;
    left: 0px;
    top: 0px;*/
    width: 100%;
    height: 100%;
    z-index: 1000;
}

/*single file upload*/

.file-field-wrapper {
    cursor: pointer;
    margin-bottom: .4em;
    position: relative;
}

.file-field-wrapper .file-field {
    cursor: inherit;
    margin: 0;
    position: relative;
    padding: 0;

    border: 2px solid #b3b3b3;
    -ms-border-radius: 2px;
    border-radius: 2px;
    
}

.file-field-wrapper:hover .file-field {
    border-color: #676767;
}

.file-field-wrapper .button {
    position: absolute;
    right: 0px;
    top: 0px;
    color: #fff;
    cursor: inherit;
    text-align: center;
    margin: 0;
    width: 65px;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0px;
    border-radius: 0px;
    height: 25px;
    line-height: 25px;
    background: #b3b3b3;
    text-decoration: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none;
    overflow: hidden;
    vertical-align: middle;
}

.file-field-wrapper button:hover {
    text-decoration: none;
}

.file-field-wrapper .file-field input[type="file"] {
    margin: 0;
    -ms-opacity: 0;
    opacity: 0;
    z-index: 2;
    cursor: inherit;
    width: 100%;
    background-color: #fff;
    border: 2px solid #c9c9c9;
    -webkit-appearance: none;
}
.file-field-wrapper .file-field input {
    cursor: pointer;
}

.file-field-wrapper .selected {
    font-size: 14px;
    font-weight: 600;
    width: 475px;
    overflow: hidden;
    position: absolute;
    top: 5px;
    left: 5px;

    white-space: nowrap;
    -moz-text-overflow: ellipsis;
    text-overflow: ellipsis;
    pointer-events: none;
}

.invalid-file {
    color: #f00;
}


/* on off toggle directive*/
.on-off-wrapper {
   cursor: pointer;
  padding: 2px;
  text-align: center;
  height: 25px;
  vertical-align: middle;
  /* position: relative; */
  line-height: 25px;
  /* top: 100%; */
  /* transform: translateY(-50%); */
  border: 1px solid #cccccc;
  background: #eeeeee;
  border-radius: 5px;
   display: table;
  text-align: center;
    font-size: 10pt;
}

.on-off-wrapper div {
  display: inline-block;
  text-align: center;
    padding: 0px 5px 0px 5px;
  width: auto;
}

.on-off-wrapper div.active {
    display: inline-block;
    font-weight: 600;
    
    color: #ffffff;
    border-radius: 5px;

}

.on-off-wrapper div.on.active {
    background-color: #cccccc;
    border: 1px solid #cccccc;
}

.on-off-wrapper div.off.active {
    background-color: #DEA12F;
    border: 1px solid #DEA12F;
}