﻿.select2-container--default .select2-selection--multiple .select2-selection__choice {
	max-width: 100%;
	overflow-wrap: break-word;
	white-space: normal !important;
}
.nicEdit-main {
	background-color: white;
	padding: 5px;
}
a {
    color: #2980B9;
    text-decoration: none;
}

    a:hover {
        text-decoration: underline;
        cursor: pointer;
        color: blue;
    }

p + h1, p + h2, p + h3, p + h4, p + h5 {
    margin-top: 20px;
}

p.small {
    font-size:14px;
    margin-top:5px;
}

h2 {
    font-weight: normal;
}

h3 {
    font-weight:normal;
    font-size: 18pt;
}

.modal h3 {
    margin-bottom: 5px;
}

h4 {
    font-weight: normal;
}


.toolTip {
    cursor:help;
}

label.for {
	display: block;
	font-weight: bold;
	margin-top: 10px;
	max-width: 200px;
	white-space: nowrap;
}

    label.for.toolTip {
        cursor: help;
    }

    label.for.inline {
        display: inline-block;
    }

	label.for:after {
		/*automagically line break without being block*/
		content: "\A";
		white-space: pre;
	}

input + label.for {
    margin-top: 15px;
}

input, select, textarea {
    padding: 4px 0;
    border: 1px solid #ccc;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
	font-size: 16px;
}

    input[type=file] {
        padding: 4px;
    }

select {
    /*min-width: 200px;*/
}

    select.small {
        width: 100px;
        min-width: 0;
    }

    select.natural {
        min-width: 0;
    }

textarea {
    min-width: 300px;
    min-height: 100px;
}

input[type=text], textarea, input[type=password], input[type=search] {
    padding: 4px;
    width: 200px;
	font-size: 16px;
}

    input[type=text].small, input[type=password].small, input[type=search].small {
        width: 75px;
        text-align: center;
        margin-bottom: 0;
    }
    /* Remove the IE search clear layer X*/
    input[type=text]::-ms-clear, input[type=password]::-ms-clear, input[type=search]::-ms-clear {
        display: none;
    }
	input[type=text].longer, input[type=password].longer, input[type=search].longer {
        width: 250px;
    }

ul {
    list-style: none;
    margin: 10px 0;
}

    ul li ul {
        margin: 0;
    }

li + ul {
    margin-top: 10px;
}

ul li:not(.ms-optgroup-container, .ms-elem-selection) {
    margin-left: 10px;
    margin-bottom: 5px;
}

hr {
    margin-bottom: 10px;
}

input[type='checkbox'], input[type='radio'] {
    width: 25px;
    height: 25px;
    -moz-transform: scale(1.8); /* FF */
    border: none;
    vertical-align: middle;
}

    input[type='checkbox'] + label {
        margin-left: 10px;
    }

    input[type='checkbox'] + label, input[type='radio'] + label {
        cursor: pointer;
    }

    input[type='radio'] + label {
        margin: 0px 10px;
        display: inline-block;
        position: relative;
        top: 2px;
    }

html.ie9 input[type='checkbox'], html.ie9 input[type='radio'] {
    -ms-transform: scale(1.5); /* IE */
    margin: 5px;
}

/*********************************************
    touch radio & checkboxes
    *******************************************/
input[type='checkbox'].touch, span.touch input[type='checkbox'] {
    z-index: 2;
    position: relative;
    top: -1px;
}

    input[type='checkbox'].touch + label, span.touch input[type='checkbox'] + label {
        display: inline-block;
        background-color: lightgrey;
        border: 1px solid #ccc;
        text-align: right;
        padding: 10px 20px 10px 40px;
        margin-left: -35px;
        margin-right: 10px;
        position: relative;
        z-index: 1;
        cursor: pointer;
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        border-radius: 3px;
    }

    input[type='checkbox']:checked.touch + label, span.touch input[type='checkbox']:checked + label {
        background-color: #40D47D;
        color: #fff;
    }

input[type='checkbox'].touch, span.touch input[type='checkbox'] {
    z-index: 2;
    position: relative;
    top: -1px;
}


input[type='radio'].touch, span.touch input[type='radio'] {
    display: none;
}

    input[type='radio'].touch + label, span.touch input[type='radio'] + label {
        display: inline-block;
        background-color: lightgrey;
        border: 1px solid #ccc;
        text-align: center;
        padding: 10px;
        margin: 0px 10px 10px 0;
        position: relative;
        z-index: 2;
        cursor: pointer;
        min-width: 100px;
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        border-radius: 3px;
    }

    input[type='radio']:checked.touch + label, span.touch input[type='radio']:checked + label {
        background-color: #40D47D;
        color: #fff;
    }

input[type=text].touch, select.touch {
    height: 40px;
    margin-top: 2px;
    padding-left: 10px;
}

/*********************************************
    datepicker 
    *******************************************/
input[type=text].datepicker {
    width: 130px;
    text-align: left;
    background-image: url('../images/informational/calendarLightGrey.svg');
    background-size: contain;
    background-repeat: no-repeat;
    background-size: 15%;
    background-repeat: no-repeat;
    background-position: 97% 50%;
    padding-left:20px;
}

/*********************************************
    calendar 
    *******************************************/
input[type=text].calendar {
    width: 150px;
    text-align: left;
    background-image: url('../images/informational/calendarLightGrey.svg');
    background-size: contain;
    background-repeat: no-repeat;
    background-size: 15%;
    background-repeat: no-repeat;
    background-position: 97% 50%;
    cursor: default;
}

/*********************************************
        Buttons
        *******************************************/
input[type=button], input[type=submit] {
    border: 1px solid #ccc;
    background-color: #298CB2;
    color: #dedede;
    padding: 10px 20px;
    font-size: 20px;
    cursor: pointer;
    margin-bottom: 10px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

    input[type=button]:hover, input[type=submit]:hover {
        background-color: #156c95;
        color: #fff;
    }

    input[type=button] + input[type=button],
    input[type=submit] + input[type=submit],
    input[type=button] + input[type=submit],
    input[type=submit] + input[type=button] {
        margin-left: 20px;
    }


    input[type=submit].cancel, input[type=button].cancel {
        color: #000;
        background-color: #E0E0E0 !important;
    }

        input[type=submit].cancel:hover, input[type=button].cancel:hover {
            color:#fff;
            background-color: #afc3ce !important;
        }

	input[type=submit].LIHEAP, input[type=button].LIHEAP {
        color: #000;
        background-color: #E0E0E0 !important;
    }
		
		input[type=submit].LIHEAP:hover, input[type=button].LIHEAP:hover {
            color:#fff;
            background-color: #afc3ce !important;
        }


    input[type=submit].save, input[type=button].save {
        min-width: 100px;
        background-color: #40D47D;
        color: #fefefe;
    }

        input[type=submit].save:hover, input[type=button].save:hover {
            background-color: #27AE60;
        }

    input[type=submit].small, input[type=button].small {
        font-size: 14px;
        padding: 5px 8px;
        height: 30px;
        margin-bottom: 0;
    }


.floatRight input[type=button], .floatRight input[type=submit] {
    margin: 0px 10px;
}

/*A container that is styled to look & act like a button*/
.divbutton {
    display: inline-block;
    min-width: 120px;
    padding: 8px 20px;
    background-color: #7F7F7F;
    cursor: pointer;
    color: white;
    text-align: left;
    border: 1px solid #ccc;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

    .divbutton:hover {
        background-color: #555555;
    }

    .divbutton img {
        float: left;
        margin-right: 20px;
        width: 50px;
        height: 50px;
        vertical-align: middle;
    }

    .divbutton input[type=text] {
        display: none;
    }

.squareButton {
    background-color: #7F7F7F;
    color: #fff;
    height: 100px;
    width: 100px;
    text-align: center;
    cursor: pointer;
    border: 1px solid #ccc;
    display: inline-block;
    vertical-align: top;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
}

    .squareButton:hover {
        background-color: #555555;
    }

    .squareButton img {
        height: 50px;
        width: 80px;
        padding: 5px 25px;
        border-bottom: 2px solid #fff;
    }

    .squareButton + .squareButton {
        margin-left: 10px;
    }

.squareButtonLHP {
    background-color: #156c95;
    color: #fff;
    height: 200px;
    width: 200px;
    text-align: center;
    cursor: pointer;
    border: 1px solid #ccc;
    display: inline-block;
    vertical-align: middle;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
	margin: 10px 25px;
}

.squareButtonLHP:hover {
    background-color: #298CB2;
}

.squareButtonLHP img {
    height: 50px;
    width: 80px;
    padding: 5px 25px;
    border-bottom: 2px solid #fff;
}

.squareButtonLHP hr {
	text-align: center;
	width: 150px;
	display: inline-block;
}

/*RMA scanner classes
    Consist of a textbox + a button*/


.mergeText {
    border: 1px solid #ccc;
    border-right: none;
    height: 30px;
    vertical-align: top;
    -webkit-border-top-left-radius: 5px;
    -webkit-border-bottom-left-radius: 5px;
    -moz-border-radius-topleft: 5px;
    -moz-border-radius-bottomleft: 5px;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}

    .mergeText + input[type=button], .mergeText + input[type=submit] {
        color: #fff;
        font-weight: bold;
        font-size: 13px;
        padding: 4px 5px;
        border: 1px solid #ccc;
        border-left: none;
        margin-left: -6px;
        height: 30px;
        vertical-align: top;
        /*reset*/
        -webkit-border-radius: 0px;
        -moz-border-radius: 0px;
        border-radius: 0px;
        -webkit-border-top-right-radius: 5px;
        -webkit-border-bottom-right-radius: 5px;
        -moz-border-radius-topright: 5px;
        -moz-border-radius-bottomright: 5px;
        border-top-right-radius: 5px;
        border-bottom-right-radius: 5px;
        margin-bottom: 0px;
    }

/**************************************
    Wrap multi select plugin list with this to center
************************************/
.multiSelectWrapper {
    width: 452px;
    margin: 0 auto;
}

.multiLabel span.fauxLink {
    cursor: pointer;
    font-weight: normal;
    display: inline-block;
    padding: 3px 5px;
    background-color: #2980B9;
    color: #fff;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    float:right;
    position:relative;
    top:-5px;
}
.multiSelectWrapper div {
    text-align:left;
}

    .multiLabel span.fauxLink:hover {
        background-color: #3990C9;
    }

.multiSelectWrapper span.multiLabel {
    padding-left:0;
}

/**************************************
    Datagrids / dataTables
    ************************************/
table td {
    padding: 2px 4px;
}

th:not(:empty) {
    font-weight: bold;
    border-bottom: 1px solid #333;
}

.modal td, .modal th {
    text-align: left;
}


table.datagridLarge tr:hover, table.dataTable tr:hover {
    background-color: lightgrey !important;
}

.datagridLarge td, .datagridalt td, .dataTable td {
    padding: 10px;
    text-align: center;
    vertical-align: middle;
}

.datagridLarge tr:nth-child(even), table.dataTable tr:nth-child(even), .dataTables_wrapper table.dataTable tr:nth-child(even) {
    background-color: #e9e9e9;
}

.datagridLarge tr:nth-child(odd), table.dataTable tr:nth-child(odd) {
    background-color: #fff;
}

.datagridheader td, .datagridfooter td {
    text-align: center;
    font-weight: normal;
    background-color: #5a5959;
    color: #fff;
    padding: 10px;
    border-collapse: collapse;
}

    .datagridheader td a {
        text-decoration: none;
        color: #fff;
    }

    .datagridfooter td a {
        text-decoration: none;
        color: #fff;
    }

.dataGridSmallButton {
    border: 1px solid white;
    height: 30px;
    width: 50px;
    margin: 0 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

    /*overwrite the .red class */
    .dataGridSmallButton.red {
        height: 30px !important;
        width: 50px !important;
        border: 1px solid white !important;
        position: relative;
        left: 0;
        top: 0;
    }

.dataGridButton {
    border: 1px solid white;
    height: 30px;
    margin: 0 5px;
    padding: 0px 20px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

.fixedHeader-floating {
    z-index: 100;
}

/* Datatables plugin overwriting styles */


/* Filters */
/*the search element */ 
.dataTables_filter input[type=search] {
    width: 270px;
    padding: 8px 5px;
    border: 1px solid #ccc;
    margin-bottom: 5px;
}

/*adjust the search box when there's a filters div */
.filters:not(:empty) + .dataTables_wrapper .dataTables_filter input[type=search] {
    position: relative;
    top: -5px;
}

.dataTables_length select {
    min-width: 0;
}

/*adjust the show X entries inside of a tableWrapper*/
.tableWrapper .dataTables_wrapper .dataTables_length {
    position: relative;
    top: 5px;
}


.dataTables_wrapper select {
    width: initial;
    display: inline-block;
    border: 1px solid #ccc;
}

.dataTables_wrapper label {
    width: initial;
}

.tableWrapper .dataTables_wrapper label:first-of-type {
    margin-left: 10px;
}

.tableWrapper .dataTables_filter input[type=search] {
    margin-right: 10px;
}

.dataTables_wrapper table.dataTable, .FixedHeader_Cloned table.dataTable, table.dataTable {
    width: 100%;
    border-collapse: collapse !important;
}

    .dataTables_wrapper table.dataTable td, .dataTables_wrapper table.dataTable th, .FixedHeader_Cloned table.dataTable th, dataTable th {
        border: 1px solid gray;
    }

html.ie9 .FixedHeader_Cloned table.dataTable thead th {
    border: none;
}

html.ie9 .FixedHeader_Cloned table.dataTable thead tr {
    border: 1px solid #5a5959;
}

table.dataTable thead th, table.dataTable thead td, .FixedHeader_Cloned table.dataTable th, .dataTable th  {
    border-bottom: none;
}


.dataTables_wrapper table.dataTable th, .dataTable th {
    border-top: none;
}

table.dataTable {
    border-collapse: collapse;
    width: 100%;
    border: 1px solid #8aabc8;
}

    table.dataTable thead tr th, .FixedHeader_Cloned table.dataTable tr th, .datagridheader td, .datagridheader th {
        text-align: center;
        font-weight: normal;
        color: #fff;
        background-color: #8aabc8;
        color: #fff;
        padding: 10px 15px;
    }

.dataTables_wrapper table.dataTable tr:nth-child(odd) {
    background-color: #fff;
}

table.dataTable tr td input[type=text]:not(.datepicker), table.datagridLarge tr td input[type=text]:not(.datepicker) {
    width: 120px;
    text-align: center;
}


.btnUnlock {
    background-image: url('../images/actions/unlocked.svg');
    background-size: 25px;
    background-repeat: no-repeat;
    background-position: 50% 50%;
}

.btnDelete {
    background-image: url('../images/actions/remove.svg');
    background-size: 25px;
    background-repeat: no-repeat;
    background-position: 50% 50%;
}

.gridCollapser {
    color: blue;
    text-decoration: underline;
    cursor: pointer;
}

.buttons-columnVisibility.active {
    position: relative;
}

    .buttons-columnVisibility.active:after {
        content: url("../images/informational/checkmark.png");
        position: absolute;
        right: 5px;
    }

div.dt-button-collection {
    min-width: 150px;
    width: auto !important;
}

body div.dt-button-collection a.buttons-columnVisibility {
    padding-right: 30px;
}