﻿/*************************************************************************
    Print IQ V2 - StyleSheet

    Rules:

        1. Every selector should be prefixed with iq-.

*************************************************************************/

input, select{
    border: 1px solid #ddd;
    background-color: white;
    padding: 6px;
    border: 1px solid #dddddd;
    margin: 0px;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    transition: none;
    border-color: #ddd;
    border-radius: 0px;
}

input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
  -webkit-appearance: none; 
  margin: 0; 
}

body{background-color:transparent!important}   

.center {
    text-align:center;
}

.vertical-center {
    max-width: 100%;
    max-height: 100%;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}

h2.iq-info, h3.iq-info{
    color:#4A89DC;
}

h2.iq-warning{
    color:#faa732;
}


.iq-page-heading{
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    background-color: transparent;
    height: 52px;
    color: #333;
    z-index: 901;
    position: relative;
    margin-bottom: 10px;
    margin-top:5px;
}

.iq-page-header { float: left; }

.iq-page-heading h1{
    display: block;

    margin-left: auto;
    margin-right: auto;
    font-weight: normal;
    font-size: 36px;
    font-weight: bold;
    border-left: 8px solid #70ca63;
    padding-left: 8px;
    line-height: 28px;
    height: 26px;

}



.iq-page-heading h1.iq-success{
        height: 27px;
    border-right: 8px solid #70ca63;
    margin-right: 10px;
    display: block;
    margin-top: 26px;
    float: left;
}

.iq-page-heading .iq-btn .fa{    display: block;
    text-shadow: none;
    line-height: inherit;
    text-shadow: 0 1px 1px rgba(255, 255, 255, 0.7);
    color: #666666;
    font-size: 21px; float:none;}

.iq-page-head{
       font-size: 30px;
    color: #333;
    line-height: 30px;
    height:54px;
    margin-bottom:25px;
}

.iq-page-head-dropdown, .iq-page-head-input{
    background-color:white;
    position:relative;
    float:left;
        webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
    -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}

.iq-page-head-dropdown::after , .iq-page-head-input::after{
    visibility: hidden;
     display: block;
     font-size: 0;
     content: " ";
     clear: both;
     height: 0;
}

.iq-page-head-dropdown .dropdown a.dropdown-toggle{
    color:#13A4DE;
    font-size:17px; font-weight:bold; border:none;
        width: 210px;
    border: none;
    padding-bottom: 12px;
    padding-top: 24px;
    padding-left: 15px;
    padding-right: 15px;
}

.iq-page-head .iq-page-head-dropdown .dropdown ul li a{
    padding-top:3px; padding-bottom:3px;
}


.iq-page-head-dropdown > label, .iq-page-head-input >label{
    color: #aaa;
    font-size: 12px;
    position: absolute;
    top: 9px;
    left: 15px;
    z-index: 2;
}

.iq-page-head-dropdown span.select2.select2-container{
    float:left;
}

.iq-page-head-dropdown span.select2.select2-container .select2-selection{
    height: 54px;
    border: none;
}

.iq-page-head-dropdown span.select2.select2-container .select2-selection__arrow{
    top: 14px;
    right: 7px;
}

 .iq-page-head-dropdown span.select2.select2-container .select2-selection__rendered{
    color: #13A4DE;
    font-size: 17px;
    font-weight: bold;
    margin-top: 0;
    padding-top: 1px;
    line-height: 65px;
    padding-left: 14px;
    height:53px;
}

 .iq-page-head-dropdown .select2-container--default .select2-selection--single{
     background-color:transparent;
 }



.iq-page-head-menu{
        background-color: #1299ce;
    color: white;
    height: 54px;
    display: block;
    float: left;
    width: 54px;
    text-align: center;
    line-height: 50px;
}

.iq-page-head-menu .fa{
        background-color: transparent;
    text-align: center;
    border: none;
    box-shadow: none;
    border-radius: 0px!important;
    color: rgba(255, 255, 255, 0.52);
    text-shadow: none;
    font-size: 21px;
    display: inline;
}

.iq-page-head-menu:hover{
    text-decoration:none; opacity:1; cursor:pointer; color:white;
}


.iq-page-head-menu:hover .fa{color:white;}

a.iq-page-head-dropdown-add{
     border: none;
    height: 50px;
    width: 50px;
    line-height: 44px;
    text-align: center;
    border-radius: 0px;
    border: 2px solid #ddd;
    padding: 0px;
    background-color: #ddd;
    color: #aaa;
    cursor:pointer;
    display: inline-block;
}

a.iq-page-head-dropdown-add .fa{
        font-size: 20px;
    display: inline-block;
}

a.iq-page-head-dropdown-add:hover .fa{
    color:#13A4DE;
}

.iq-sub-head{    
    border-bottom: none;
    padding: 0px;

  font-size:22px; font-weight:normal; margin-bottom:20px;}
.iq-sub-head.iq-important{
      padding-left: 15px;
          padding-top: 2px;
       border-left: 5px solid #ddd;   padding-bottom: 2px;
}

/* ## IQ GROUP ## */
.iq-group{line-height:14px; margin-right:15px; position: relative;}

.iq-group-container .iq-group{
    margin-right:35px;
    margin-bottom:20px;
}

.iq-group-container .iq-group:last-child{margin-right:0px;}

.iq-group-container::after{
    visibility: hidden;
     display: block;
     font-size: 0;
     content: " ";
     clear: both;
     height: 0;
}

.iq-group .iq-group-btn{
    margin-top: 16px;
    margin-bottom: -5px;
}

.iq-group > label:not(.selected-text):not(.iq-input-icon) {
    font-size: 10px;
    color: #AAAAAA;
    margin-bottom: 0px !important;
    display: block;
    position: relative;
    z-index: 2;
}
.iq-group > label:first-child:not(.selected-text):not(.iq-file-upload) {
    text-transform: uppercase;
}

.iq-group label.iq-hint {
    margin-left: 4px;
}

.iq-group > span.iq-highlight-value {
    color: #4A89DC;
    font-size: 20px;
    line-height: 20px;
    height: 21px;
}

.iq-group.iq-highlight .fa {
    margin-top: 5px;
    color: #4A89DC;
}

.iq-page-head-info .iq-group label{width:120px;}

.borderless{border:none!important;}

.iq-required, .iq-group span.iq-required{
        color: #b94a48;
    font-size: 22px;
    font-weight: bold;
    margin-left: 0px;
    display: block;
    line-height: 26px;
    margin-bottom: -8px;
    float: right;
    margin-left: 4px;

}

.iq-group span.iq-required{
       position: absolute;
    right: 0;
    margin-left: 0px;
    margin-bottom: 0px;
    top: 0px;
}

.control-label span.iq-required{
    right: -13px;
    top: 5px;
}

.iq-group{float:left; width:250px; position:relative;} 
.iq-group .caret{width:auto;}
.iq-group .dropdown .btn{    border: none;
    padding: 0px;
    background-image: none;
    background-color: transparent;
    box-shadow: none;
    margin: 0px;
    line-height: 11px;
    font-size: 12px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: block;
    width: 140px;
    padding-top: 0px;
}

.iq-group > span:not(.select2){font-size:13px; overflow: hidden;white-space: nowrap;text-overflow: ellipsis; display:block; padding-top: 0px; line-height:14px; height:14px; }
.iq-group .caret{height:auto;}

.iq-group input, .iq-group textarea.iq-edit-input{ width:194px;}
.iq-group input[type='checkbox']{
    width:auto;
}


.iq-group input.borderless{ padding:0px; border:none; box-shadow:none; margin-top:-2px;}
.iq-group select.borderless{ padding:0px; border:none; box-shadow:none; margin-top:-2px;}
.iq-group .iq-prepend-icon{
      float: left;
    margin-right: 8px;
    font-size: 30px;
    color: #aaaaaa;
    margin-top: 17px;
    width: 30px;
    height: 30px;
    text-align: center;
    margin-right: 5px;
}

.iq-group input.iq-edit-input:disabled, input.aspNetDisabled, textarea.iq-edit-input:disabled {
    background-color: #f5f5f5!important;
    box-shadow: none!important;
}

.iq-group input.iq-edit-input:focus, 
.iq-group textarea:focus,
.iq-group textarea.iq-edit-input:focus{
    padding: 6px;
   /* margin:-1px!important;
    border-width:2px;
    border-color:rgba(82, 168, 236, 0.8);*/
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0)!important;
    -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0)!important;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0)!important;
    z-index:2;
}

.iq-group.iq-compact input.iq-edit-input:focus, 
.iq-group.iq-compact textarea:focus{
      margin-top:-15px!important;
    background-color: white;
    border: 2px solid rgba(82, 168, 236, 0.8);
}

.iq-group .iq-prepend-icon-full{
         float: left;
    margin-right: 8px;
    font-size: 30px;
    color: #aaaaaa;
    margin-top: 1px;
    margin-left: -10px;
    margin-top: -9px;
    margin-bottom: -10px;
    width: 54px;
    height: 56px;
    margin-bottom: -21px;
    background-color: #F0F0F0;
    text-align: center;
    line-height: 58px;
    font-size: 26px;
    border-top: 1px solid #ddd;
    margin-top: -10px;
}

.iq-tall-groups .iq-group .iq-prepend-icon-full{
        height: 74px;
    line-height: 77px;
}

.iq-group .iq-edit-input, .iq-group .aspNetDisabled {
    border: none;
    transition: 0.2s;
    border-bottom: 1px dashed #ddd;
    border-radius: 0px;
    box-shadow: none;
    padding: 0px;
    border-color: #dddddd;
    background-color: transparent;
    margin-top: -2px;
}

.iq-group .iq-edit-input:active {
    border-color: #dddddd;
}

.iq-group .iq-edit-input:focus {
    background-color: white;
    z-index: 99;
    padding: 5px;
    border: 1px solid #dddddd;
}

.iq-group .iq-readonly{margin-top:6px;}

.iq-group.iq-has-large-icon .iq-prepend-icon.fa{
 font-size: 35px;
    margin-right: -15px;
    position: relative;
    margin-top: 16px;
    /* line-height: 65px; */
    text-shadow: 3px 0px 1px white;
    background-color: white;
    border-radius: 500px;
    z-index:2;
        width: 45px;
    height: 45px;
    margin-right: -18px!important;
}

.iq-group.iq-has-large-icon .iq-prepend-icon.fa{

    font-size: 45px;
    margin-top: 11px;
    margin-right: -2px;
    margin-left: 0px;
}


.iq-group.iq-has-large-icon input:not(.listSearch), 
.iq-group.iq-has-large-icon a.btn.dropdown-toggle, 
.iq-has-large-icon .jqCustomSelector .ui-multiselect, 
.iq-group.iq-has-large-icon textarea {
    padding-left:22px!important;
}

/* This is used to fix older .control-group. E.g the contact modal on simplified. */
.iq-group.iq-has-large-icon .control-group .controls input,
.iq-group.iq-has-large-icon .control-group .controls textarea{
    padding-left: 6px!important;
}

.iq-group.iq-has-large-icon label:not(.selected-text):not(.control-label){
        margin-left: 50px;  
}

.iq-group.iq-has-large-icon label:not(.selected-text){
    text-transform:uppercase;
}

.iq-group.iq-has-large-icon .ui-multiselect-menu  label:not(.selected-text):not(.control-label){
        margin-left: 0px; color:#333; font-size:14px;
}

.iq-group.iq-has-large-icon .ui-multiselect-menu input{
    padding-left:4px!important;  margin:0px;
}


.iq-group .dropdown{float:left;}
/*.iq-group .CustomDropdownContainer{margin-right:-10px;}*/

/* Newish styles*/
.iq-group input.iq-edit-input, .iq-group textarea, .iq-group .aspNetDisabled, .iq-group a.dropdown-toggle.btn, .iq-group textarea.iq-edit-input{
    background-color: white;
    padding: 6px;
    border: 1px solid #ddd;
    margin: 0;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    transition: none;
    border-radius: 0;

      /*background-color: #EFEFEF;*/
    
}



 .iq-group a.dropdown-toggle.btn .CustomDropdownText{
     line-height: 18px;
    height: 18px;
 }

.iq-group .dropdown a .caret{
    margin-top:8px;
    border-top: 4px solid #000000;
    border-right: 4px solid transparent;
    border-left: 4px solid transparent;
}

/* ## COMPACT IQ GROUP ## */
.iq-group.iq-compact .dropdown .btn {
    border: none;
    padding: 0;
    background-image: none;
    background-color: transparent;
    box-shadow: none;
    margin: 0;
    line-height: 11px;
    font-size: 12px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: block;
    width: 140px;
    padding-top: 0;
    margin-top:-2px;
}

.iq-group.iq-compact .iq-edit-input, .iq-group.iq-compact .aspNetDisabled{
    border: none;
    transition: .2s;
    position: absolute;
    border-bottom: 1px dashed #ddd;
    border-radius: 0;
    box-shadow: none;
    padding: 0;
    border-color: #ddd;
    background-color: transparent;
    margin-top: -2px;
}

.iq-group.iq-compact input{
    width:130px;
}

.iq-group.iq-compact .fa:not(.iq-prepend-icon-full), .iq-group.iq-compact .fad:not(.iq-prepend-icon-full) {
    margin-top: 0px;
}


.iq-group .iq-edit-icons,
.iq-edit-icons.contact-selector-icons,
.iq-editing-row .iq-edit-icons {
    margin-left:5px;
    float:left;
}
.iq-group .iq-edit-icons .fa,
.iq-edit-icons.contact-selector-icons .fa,
.iq-editing-row .iq-edit-icons .fa {
    font-size:32px; color:#aaa; cursor:pointer;
    opacity:0.5;
}

.iq-group .iq-edit-icons a:hover,
.iq-edit-icons.contact-selector-icons a:hover, 
.iq-editing-row .iq-edit-icons a:hover {text-decoration:none;}

.iq-group .iq-edit-icons .fa:hover,
.iq-edit-icons.contact-selector-icons .fa:hover, 
.iq-editing-row .iq-edit-icons .fa:hover {
    color:#13A4DE; opacity:1;
}

.iq-editing-row td .select2.select2-container--default .select2-selection{
    height:42px;
}

.iq-editing-row td .select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 42px;
}

.iq-editing-row td  .select2-container--default .select2-selection--single .select2-selection__arrow{
    height:40px;
}

.iq-group.saving:after {
    content: "\f021" !important;
    animation: fa-spin 2s infinite linear;
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: 18px;
    color: #4A89DC;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    float: right;
    position: relative;
    left: 19px;
    top: 6px;
}

.iq-group.saved:after {
    content: "\f00c"!important;
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: 18px;
    color: #51BE41;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    float: right;
    position: relative;
    left: 19px;
    top: 6px;
}

.iq-group[class*="iq-span"], .iq-group[class*="span"]{margin-right:0px;}
.iq-group[class*="iq-span"] input, .iq-group[class*="span"] input, .iq-group[class*="iq-span"] textarea, .iq-group[class*="span"] textarea{width:100%; box-sizing: border-box;}
.iq-group[class*="iq-span"] > .select2, .iq-group[class*="iq-span"] > div > .select2{width:100%!important;}
.iq-row::after {
    clear: both;
    content: "";
    display: table;
}

.iq-row + .iq-row{
    margin-top:15px;
}

ul.iq-nav {
    margin: 0px;
    line-height: normal;
}
.iq-nav:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
}

.iq-nav li{
    float:left; margin-right:25px;
}

.iq-nav li a{
    color: #333;
    font-size:12px;
    font-weight:bold;
    text-decoration:none;
    display:block;
    padding-bottom:10px;
    opacity:0.3;
}

.iq-nav li.active{ border-bottom:2px solid #4DAE4D;}
.iq-nav li.active a{opacity:1;}

.iq-page-head .iq-nav{margin-top:27px;}

/*.iq-group .fa:first-child{
    position: absolute;
    left: -17px;
    top: 18px;
    font-size: 15px;
    opacity: 0.4;
    cursor: pointer;
}

.iq-group .fa:first-child:hover{opacity:1;}*/
.iq-group .dropdown .btn span{padding-top:0px;}

.iq-group .dropdown .btn .caret{    width: auto;
    margin-top: 7px;
    margin-right: 3px;
    display: inline-block;
    border-top: 4px solid #000000;
    border-right: 4px solid transparent;
    border-left: 4px solid transparent;}
.iq-group.loading .fa.iq-prepend-icon:before,.iq-group.iq-loading .fa.iq-prepend-icon:before{content: "\f021"!important;}
.iq-group.loading .fa.iq-prepend-icon, .iq-group.iq-loading .fa.iq-prepend-icon{-webkit-animation: fa-spin 2s infinite linear;
    animation: fa-spin 2s infinite linear;}

.btn.loading:before,.iq-btn.loading:before{content: "\f021"!important; -webkit-animation: fa-spin 2s infinite linear; animation: fa-spin 2s infinite linear;     display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale; margin-right:5px;
}
.loading, .loading-big {
    pointer-events: none;
}

.iq-icon-btn.loading .fa:before {
    content: "\f021" !important;
    -webkit-animation: fa-spin 2s infinite linear;
    animation: fa-spin 2s infinite linear;
    display: inline-block;
}


.btn.loading-big, .iq-btn.loading-big{
    position:relative;
}
.btn.loading-big:before,.iq-btn.loading-big:before{  content: "\f021"!important;
    -webkit-animation: fa-spin 2s infinite linear;
    animation: fa-spin 2s infinite linear;
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    margin-right: 5px;
    position: absolute;
    right: -38px;
    color: #57BD48;
    font-size: 30px;
    top: 6px;}
  

.iq-page-head-info {margin-top:7px;}
.iq-page-head-info.right{padding-left:25px; margin-right:25px; border-left:1px solid #dddddd;}
.iq-page-head-info .iq-group label{display:block; float:left;}
.iq-page-head-info .iq-group:after{visibility: hidden;
     display: block;
     font-size: 0;
     content: " ";
     clear: both;
     height: 0;
     }
.iq-page-head-info .iq-group span{display:block; float:left; line-height:16px; width:auto; max-width:110px; padding: 0px;}
.iq-page-head-info .iq-group span.iq-long-text{ max-width:none;}

.iq-page-head-info .iq-group{float:none; width:auto; padding-right:0px}
.iq-page-head .dropdown ul{border-radius: 0px;}
.iq-page-head .dropdown ul li{}
.iq-page-head .dropdown ul li a{
    padding-top:4px; padding-bottom:5px;
    font-size:15px;
    cursor:pointer;
}

.iq-page-head .dropdown ul li span.dropdown-header{
       font-size:15px;
}

.iq-info-container{margin-right:-20px;}
.iq-info-container:after{visibility: hidden;
     display: block;
     font-size: 0;
     content: " ";
     clear: both;
     height: 0;
     }

.invalid-input{color:red; font-weight:bold; border-color:red!important;}
.iq-underline{text-decoration:underline}

.iq-group.iq-group-left-label > label:not(.selected-text):not(.iq-input-icon) {
    display: block;
    background: #DDDDDD;
    color: #949494;
    width: 140px;
    text-align: center;
    font-size: 12px;
    font-weight: bold;
    float: left;
    height: 32px;
    line-height: 32px;
}

.iq-group.iq-group-left-label > input {
    display: block;
}

/****************** IQ INFO GROUPS, FLEX SIZING ******************/
.iq-group.flex {
    display: flex;
}

.iq-group .iq-info > label:first-child {
    color: #000;
    font-size: 14px;
}

.iq-group .iq-info {
    flex-grow: 1;
}

/* Radio button - Use for Yes/No text based radio buttons. The label directly next to the radio button will be style. Make sure the label has for="idOfRadioButton" to make radio button change when clicking text */
.iq-radio-text{display:none;}
.iq-radio-text + label{opacity:0.3; cursor:pointer; color:#333;     width: auto;
    display: inline-block; font-size:13px; margin-right:5px;}
.iq-radio-text + label:hover{opacity:1; cursor:pointer;}
.iq-radio-text:checked + label{opacity:1; font-weight:bold; text-decoration:underline}

/****************** PANEL ******************/
.iq-panel {
    border:none;
    border-top:5px solid #ddd;
    margin-bottom:25px;
    -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, .25), inset 0 -1px 0 rgba(0, 0, 0, .1);
    -moz-box-shadow: 0 3px 6px rgba(0, 0, 0, .25), inset 0 -1px 0 rgba(0, 0, 0, .1);
    box-shadow: 0 2px 3px rgba(0,0,0,.09),inset 0 -1px 0 rgba(0,0,0,.01);
}

.iq-panel .iq-panel-header {
    font-size: 24px;
    color: #333;
    padding:20px;
    padding-top:25px;
    padding-bottom:25px;
    background-color:#FAFAFA;
    margin-top:-1px;
    border-bottom: 1px solid #dddddd;
    position:relative;
}

.iq-panel-header.iq-toggle{cursor:pointer;}
.iq-panel-header .iq-toggle-caret{
        margin-top: 9px;
    margin-left: 16px;
    color: #aaa;
    font-size: 18px;
}


/*.iq-success.iq-panel, .iq-warning.iq-panel, .iq-info.iq-panel{border-top:none;}*/
.iq-panel .iq-panel-content {
    background-color: white;
    padding: 20px;
    padding-top: 20px;
    padding-bottom: 25px;
}
.iq-panel .iq-panel-content.no-padding {
    padding: 0px;
}

.iq-panel.Left, .iq-panel.left{float:left!important;}
.iq-panel.Right, .iq-panel.right{float:right!important;}

.iq-header-toolbar{float:right; margin-top:-9px;}
.iq-header-toolbar .iq-btn{line-height:23px;}

[class*="iq-span"]{float:left; margin-left:2.5%!important}
[class*="iq-span"]:first-child{ margin-left:0px!important}

.iq-panel hr{
    border-top: 1px solid #dddddd;
    border-bottom:none;
    margin-left:0px; margin-right:-20px;
    margin-top:15px; margin-bottom:15px;
}

.iq-panel hr.iq-full-width{
    margin-left:-20px;
}

.iq-table.iq-full-width{
    width:100%;
}

.iq-panel.iq-no-border {
    border: none;
}

.iq-table tr .iq-edit-input {
    width: 100%;
    box-sizing: border-box;
}

.iq-panel.iq-success .iq-sub-head, .iq-panel .iq-panel-content.iq-success .iq-sub-head {
    color: #57BD48;
}
.iq-panel.iq-info .iq-sub-head, .iq-panel .iq-panel-content.iq-info .iq-sub-head{color:#4A89DC;}
.iq-panel.iq-danger .iq-sub-head, .iq-panel .iq-panel-content.iq-danger .iq-sub-head{color:#df5640;}
.iq-panel.iq-warning .iq-sub-head, .iq-panel .iq-panel-content.iq-warning .iq-sub-head{color:#faa732;}

.iq-content-panel {
    margin-bottom:35px;
    background-color:white;
    padding:30px;
    -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, .25), inset 0 -1px 0 rgba(0, 0, 0, .1);
    -moz-box-shadow: 0 3px 6px rgba(0, 0, 0, .25), inset 0 -1px 0 rgba(0, 0, 0, .1);
    box-shadow: 0 2px 3px rgba(0,0,0,.09),inset 0 -1px 0 rgba(0,0,0,.01);
}
.iq-content-panel .iq-sub-head {
    margin-bottom: 35px;
}


 .iq-span12 {
    width: 100%!important;
    *width: 99.94680851063829%!important;
  }
  .iq-span11 {
    width: 91.45299145300001%!important;
    *width: 91.3997999636383%!important;
  }
  .iq-span10 {
    width: 82.905982906%!important;
    *width: 82.8527914166383%!important;
  }
  .iq-span9 {
    width: 74.358974359%!important;
    *width: 74.30578286963829%!important;
  }
  .iq-span8 {
    width: 65.81196581200001%!important;
    *width: 65.7587743226383%!important;
  }
  .iq-span7 {
    width: 57.264957265%!important;
    *width: 57.2117657756383%!important;
  }
  .iq-span6 {
    width: 48.717948718%!important;
    *width: 48.6647572286383%!important;
  }
  .iq-span5 {
    width: 40.170940171000005%!important;
    *width: 40.117748681638304%!important;
  }
  .iq-span4 {
    width: 31.623931624%!important;
    *width: 31.5707401346383%!important;
  }
  .iq-span3 {
    width: 23.076923077%!important;
    *width: 23.0237315876383%!important;
  }
  .iq-span2 {
    width: 14.529914530000001%!important;
    *width: 14.4767230406383%!important;
  }
  .iq-span1 {
    width: 5.982905983%!important;
    *width: 5.929714493638298%!important;
  }

  .iq-info-container.iq-shaded{
      background-color: #F5F5F5
  }

  .iq-panel-header .iq-loading-bar-container{    position: absolute;
    left: 0px;
    right: 0px;
    bottom: -26px;}

  .iq-loading-bar-container .progress{    border-radius: 0px;
    height: 8px;}

  .iq-page-head .iq-page-head-back-btn{
    border: none;
    height: 50px;
    width: 50px;
    line-height: 44px;
    text-align: center;
    border-radius: 0px;
    border: 2px solid #ddd;
    padding: 0px;
    background-color: #ddd;
    color: #aaa;
    cursor: pointer;
    display: inline-block;
    position:absolute;
    left:-58px;
  }

  .iq-page-head-back-btn .fa{    font-size: 20px; margin-left:-1px; cursor:pointer;
    display: inline-block;}

   .iq-page-head-back-btn:hover .fa{color:#13A4DE;}

/****************** BADGES ******************/
.iq-badge{
    background-color: #13A4DE;
    color: white;
    border-radius: 4px;
    padding: 6px;
    font-weight: normal;
}

.iq-badge.iq-info{background-color: #13A4DE; color:white;}
.iq-badge.iq-success{background-color: #57BD48; color:white;}
.iq-badge.iq-danger{background-color: #df5640; color:white;}


/****************** BUTTON ******************/
.iq-btn {
    display: inline-block;
    margin-bottom: 0;
    font-weight: normal;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    background-image: none;
    border: 1px solid transparent;
    border-color: rgba(0,0,0,.07) rgba(0,0,0,.1) rgba(0,0,0,.18);
    font-size: 13px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    color: #666;
    background-color: #f0f0f0;
    border-color: rgba(0,0,0,.1) rgba(0,0,0,.12) rgba(0,0,0,.15);
    border-radius: 2px 2px 2px 2px;
    padding: 13px;
    padding-top: 7px;
    padding-bottom: 7px;
    border-radius:3px;

}

.iq-btn:hover:not(.disabled):not([disabled]) {
    background-color: rgb(222, 222, 222);
}
.iq-btn:hover {
    text-decoration:none;
}

.iq-btn.disabled:active {
	pointer-events: none;
}

.iq-btn-mini {
    padding: 2px 6px;
    font-size: 11px;
    line-height: 14px;
}

.iq-btn-small {
    padding: 4px;
    padding-left: 9px;
    padding-right: 9px;
}

.iq-btn-medium{
        padding: 10px;
    padding-left: 15px;
    padding-right: 15px;
}

.iq-btn-large{
        font-size: 16px;
    padding: 13px;
    padding-left: 20px;
    padding-right: 20px;
}

.iq-icon-btn{cursor:pointer;}
.iq-icon-btn:hover{text-decoration:none;}
.iq-icon-btn .caret{margin-top:25%;}

.iq-btn.active{-webkit-box-shadow: inset 0 2px 4px rgba(0,0,0,.15), 0 1px 2px rgba(0,0,0,.05);
    -moz-box-shadow: inset 0 2px 4px rgba(0,0,0,.15), 0 1px 2px rgba(0,0,0,.05);
    box-shadow: inset 0 2px 4px rgba(0,0,0,.15), 0 1px 2px rgba(0,0,0,.05); background-color:rgb(222, 222, 222);}

.iq-btn .fa{ display: block; font-size: 18px; text-shadow:none; float:left }
.iq-btn .fa.right { float: right; }
.iq-btn .caret{
    margin-top:7px;
}

.iq-btn-circle{    border-radius: 500px;
    border-radius: 500px;
    width: 20px;
    height: 20px;
    display: block;
    padding: 2px;
    margin-top: -4px;
    margin-left: 7px;
    margin: 0px;
    float: initial;
    line-height: 18px;
        text-align:center!important;
}

.iq-btn-circle .fa{display:block; margin-top:5px; font-size:11px}
.iq-btn .iq-caret{    display: inline-block;
    width: 0;
    height: 0;
    vertical-align: top;
    border-top: 4px solid #000000;
    border-right: 4px solid transparent;
    border-left: 4px solid transparent;
    content: "";
    opacity: 0.3;
    margin-top: 8px;}

.iq-btn .fake-check{    float: left;
    margin-left: 5px;
    margin-right: 0px;
    margin-top: -6px;}

hr.iq-seperator {    
	border-bottom: none;
    border-left: none;
    border-right: none;
    border-top: 2px solid #4A89DC;
    margin-left: -20px;
    margin-top: 25px;
}

.iq-btn:hover .iq-caret{opacity:0.6;}

.iq-page-title { float: left; background-color: #13A4DE; font-weight:bold;
    color: white;
    padding: 12px;
    padding-left: 17px;
    padding-right: 17px;
    FONT-SIZE: 32PX; text-shadow: 0 0 5px #33333369; }


.iq-btn-header{
    width: 56px;
    height: 56px;
    line-height: 56px;
    text-align: center;
    background-color: #0698d2;
    margin-top:-13px;
    display:block;
    line-height:53px;
    cursor:pointer;
}

.iq-btn.iq-outline.iq-btn-medium{
    padding:9px; padding-left:14px; padding-right:14px;
}

.iq-btn-header .glyphicon, .iq-btn-header i.fa{
    color:rgba(255, 255, 255, 0.52);
    font-size:21px;
}

.iq-btn-header:hover .glyphicon, .iq-btn-header:hover .fa{
    color:white;
}

.iq-btn-header.active .glyphicon, .iq-btn-header.active .fa{
    color:white;
}
.iq-btn-fillheight{
    margin-top: -10px;
    display: block;
    height: 42px;
    margin-bottom: -20px;
    padding-left: 18px;
    padding-right: 18px;
    border-radius: 0px!important;
    font-size: 30px!important;
    line-height: 38px;
    box-sizing: initial;
    border-radius:0px!important;
}

.iq-btn-fillheight .fa{
    font-size: 24px;
    display: inline-block;
    float: none;
}

.iq-btn[disabled],
.iq-btn.disabled {
    opacity: .4;
    cursor: default;
}

.iq-panel-header .iq-btns{
        margin-top: -8px;
    margin-bottom: -9px;
}

.iq-btns .iq-btn{
    margin-left:8px;
}

.iq-btn-key{
        background: #cb4e4e;
    color: #fff;
    box-shadow: 0 6px #ab3c3c;
    -webkit-transition: none;
    -moz-transition: none;
    transition: none;
    border-radius: 6px;
    display: inline-block;
    height: 50px;
    line-height: 50px;
    padding-left: 20px;
    padding-right: 20px;
    font-size: 20px;
}

.iq-btn-fillheight .caret{display:block; margin-top:0px;}

.btn-group .iq-btn-fillheight{float:left;}

.iq-page-head > .iq-btn{font-weight: bold;
    font-size: 17px;
    padding-left: 17px;}

.iq-dropdown-toggle{
    border-radius: 4px 0px 0px 4px;
    margin-right: -9px;
}

.iq-dropdown-toggle i.caret{    margin-top: 13px;
    margin-left: -3px;}

.dropdown .iq-dropdown-toggle + .iq-btn{border-radius:0px 4px 4px 0px;}
.dropdown .caret{margin-right:3px;}

.iq-icon-btn{
    font-size: 12px;
    display: inline-block;
    padding: 10px;
    line-height: 29px;
    height: 24px;
    overflow:hidden;
    color:#4A89DC;
}

 a.iq-icon-btn:visited, a.iq-icon-btn{color:#4A89DC}

.iq-icon-btn .fa,
.iq-icon-btn .fad,
.iq-icon-btn .fas{
    font-size: 28px;
    margin-right: 5px;
    display: block;
    float: left;
    margin-top: -2px;
}

a.iq-icon-btn:hover{
    text-decoration:none;
    cursor:pointer;
    background-color:#4A89DC;
    color:white;
    border-radius:6px;
}

.iq-btn-group > .iq-btn{
    border-radius:4px 0px 0px 4px;
}

.iq-btn-group > .iq-btn + .dropdown-toggle{
    border-radius:0px 4px 4px 0px;
    margin-left: -5px;
    padding: 9px;
}


.iq-panel-actions .iq-icon-btn:hover{
    border-radius:0px;
}

.iq-panel-actions .iq-icon-btn label.iq-switch {
    float: left;
    margin-right: 4px;
    margin-top: -2px;
}
.iq-panel-actions .iq-icon-btn label.iq-switch > input:not(:checked) + label {
    background-color: #aaa;
    border-color: #aaa;
}

.iq-panel-actions{
    background-color: #ddd;
    margin-bottom: 17px;
    padding-top: 5px;
    padding-left: 6px;
    min-height: 49px;
}

.iq-panel-actions .dropdown .caret{
    margin-top:13px;
}

.iq-panel-actions .iq-icon-btn.disabled{
    opacity:0.5;
}

.iq-actions-dropdown{
    float:left;
}

.iq-icon-divider{    display: inline-block;
    height: 54px;
    border-left: 2px solid whitesmoke;
    width: 1px;
    margin-top: -5px;
    margin-bottom: -5px;}

.iq-btn.iq-blank{border:none; background-color:transparent; color:#aaa; font-weight:bold; padding:0px;}
.iq-btn.iq-blank .fa{color:#aaa; margin-right:5px;}
.iq-btn.iq-blank:hover{cursor:pointer; color:#333;}
.iq-btn.iq-blank:hover .fa{cursor:pointer; color:#333;}

.iq-btn.iq-medium{
        padding: 12PX;
    padding-left: 14px;
    padding-right: 14px;
}

.iq-btn.iq-medium input[type=checkbox]{
        float: left;
    margin-top: 2px;
    margin-bottom: -3px;
    margin-left: -1PX;
    MARGIN-RIGHT: 17PX;
}

.iq-btn.iq-outline{
    border:2px solid #A0A0A0;
    text-shadow:none!important;
    background-color:transparent;
}

/****************** CHECKBOXES ******************/
input[type="checkbox"].iq-checkbox {
 display:none;
}

input[type="checkbox"].iq-checkbox + label {
     cursor: pointer;
    position: relative;
    margin-right: 5px;
    background: #fff;
    display: inline-block;
    border: 3px solid #DDD;
    height: 15px;
    width: 15px;
    top: 4px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
}

input[type="checkbox"].iq-checkbox:checked + label::after{
    position: absolute;
    top: 4px;
    left: 3px;
    width: 6px;
    height: 3px;
    border: solid #888;
    border-width: 0 0 3px 3px;
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

/****************** MODALS ******************/
.modal3.iq-modal .modal-header{    border-top: 5px solid #4A89DC;
    margin-top: -1px;
    margin-left: 0px;
    margin-right: 0px;
    font-size: 20px;
    color: #333;
    font-family: 'Helvetica Neue', Helvetica;
    padding: 20px;
    padding-top: 25px;
    padding-bottom: 25px;
    background-color: #FAFAFA;
    margin-top: -1px;
    border-bottom: 1px solid #dddddd;
    position: relative;
}

.modal3.iq-modal .modal-content {
    padding-top:1px; border-radius:1px;
}

.modal3.iq-modal .modal-footer{border-radius:0px;}

.modal3.iq-modal.iq-info .modal-header{
    border-top-color: #4A89DC;
}


.modal3.iq-modal.iq-success .modal-header{
    border-top-color: #57BD48;
}

.modal3.loading .modal-footer{ display:none;}

.modal3.loading .modal-body{
    position:relative;
    height:180px;
}

.modal3.loading .modal-body:before{
    content:"";
    position:absolute;
    left:0px;
    right:0px;
    top:0px;
    bottom:0px;
    background-color:white;    
    z-index:99999;
}

.modal3.loading .modal-body:after{
    content:"\f021";
    z-index:99999;
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color:#4a89dc;
    position:absolute;
    -webkit-animation: fa-spin 2s infinite linear;
    animation: fa-spin 2s infinite linear;
    font-size:65px;
    position:absolute;
    top:65px;
    left:50%;
    margin-left:-44px;
}

/****************** BASIC ALERTS ******************/
.iq-alert{
    border-left: 6px solid #aaa;
    background-color: whitesmoke;
    color:#aaa;
    margin-bottom: 10px;
    border-top: none;
    padding: 14px;
    padding-left: 18px;
}
.iq-alert.iq-danger, .iq-alert.iq-danger-full{border-left-color:#df5640; color:#df5640; background-color:#f2dede;}
.iq-alert.iq-danger-full{color:white; background-color:#df5640;}
.iq-alert.iq-info, .iq-alert.iq-info-full{border-left-color:#4A89DC; color:#4A89DC; background-color:#d9edf7;}
.iq-alert.iq-alert.iq-info-full{color:white; background-color:#4A89DC;}
.iq-alert.iq-success, .iq-alert.iq-success-full{border-left-color:#57BD48; color:#57BD48; background-color:#dff0d8;}
.iq-alert.iq-warning, .iq-alert.iq-warning-full{border-left-color:#faa732; color:#faa732; background-color:#fcf8e3;}
.iq-alert-plain{background-color:whitesmoke; text-align:center; padding:15px; margin-bottom:15px;}
.iq-alert.iq-attention{background-color:#ddd; color:#8e8e8e; font-weight:bold; text-align:center; padding:20px; margin-bottom:15px; border-left:none;}
/****************** COLOURS ******************/
/*------------------ DEFAULT -------------------*/
a.iq-btn.iq-outline {
    border: 2px solid #DDD;
    color: #aaa ;
    text-shadow: none ;
    background-color: transparent;
}

/*------------------ INFO -------------------*/
.iq-info.iq-btn,
.iq-info.iq-btn-circle, .iq-info.iq-icon-btn{ color:#4A89DC;}
.iq-info.iq-btn-circle{  background-color: #4A89DC; color:white;}
.iq-info .iq-btn{color:#4A89DC; text-shadow:0 0px 1px rgba(255, 255, 255, 0.35); }
.iq-info .iq-panel-header{ margin-top:-1px; margin-left:0px; margin-right:0px; }
.iq-info.iq-panel{    border-top-color:#4A89DC;}

.iq-info.iq-sub-head, div.iq-info.iq-sub-head{color:#4A89DC; border-left-color:#4A89DC}

.iq-info-full.iq-btn:hover{background-color:#4A89DC;}
.iq-btn.iq-info-full{background-color: #4A89DC; color:white; text-shadow:0 0px 1px rgba(0, 0, 0, 0.35);}
.iq-btn.iq-info-full .fa{text-shadow:0 0px 1px rgba(0, 0, 0, 0.35);}
.iq-btn.iq-info-full:hover:not(.disabled):not([disabled]){background-color:#659be1;}
.iq-info-full.iq-panel .iq-btn{color:white}
.iq-btn.iq-outline.iq-info{
    border:2px solid #4A89DC;
    color:#4A89DC!important;
    text-shadow:none!important;
    background-color:white;
}

.iq-badge.iq-info{background-color: #13A4DE; color:white;}
.fa.iq-info{color:#4A89DC}


.help-item-container.iq-info-full{
    color:white;
    background-color:#13A4DE;
}

.help-item-container.iq-info{
    color:#13A4DE;
    background-color:white;
    border:2px solid #13A4DE;
}

.iq-btn.iq-info-full.iq-btn-file{
    padding-top: 2px;
    padding-bottom: 2px;
    padding-left: 2px;
    padding-right: 2px;
    background-image: none;
    background-color:#4A89DC;
    margin-left: -1px;
    margin-right: -1px;
    border-radius: 0 3px 3px 0;
}
.iq-btn-file > input {
    position: absolute;
    top: 0;
    right: 0;
    margin: 0;
    cursor: pointer;
    border: solid transparent;
    border-width: 0 0 100px 200px;
    opacity: 0;
    filter: alpha(opacity=0);
    -moz-transform: translate(-300px, 0) scale(4);
    direction: ltr;
}
.iq-btn.iq-info-full .fileupload-new,
.iq-btn.iq-info-full .fileupload-preview
{
    background-color: white;
    color: #5C5C5C;
    padding: 0px;
    border-radius: 0px 3px 3px 0px;
    margin-left: 2px;
    padding-left: 10px;
    text-shadow: none;
    padding-top: 2px;
    padding-bottom: 2px;
    margin-right:3px;
    text-align: left;
}

/*------------------ SUCCESS----------------*/
.iq-success.iq-btn, .iq-success.iq-icon-btn{color:#57BD48;}
.iq-success.iq-btn-circle{ color:#1EB109; background-color: #4dae4d; color:white;}
.iq-success.iq-btn .fa{color:#57BD48}
.iq-success.iq-panel{    border-top-color:#51BE41;}
.iq-success.iq-sub-head, div.iq-success.iq-sub-head{color:#57BD48; border-left-color:#57BD48}
.iq-success .iq-seperator{border-top:2px solid #57BD48}
.iq-success-full.iq-btn  input[type=checkbox].iq-custom:checked::before, 
 input[type=checkbox].iq-success.iq-custom:checked::before{
    display: block;
    border-color: #57BD48!important;
    background-color: #57BD48;
}
.iq-btn.iq-outline.iq-success{
    border:2px solid #57BD48;
    color:#57BD48!important;
    text-shadow:none!important;
    background-color:white;
}

.iq-badge.iq-success{background-color: #57BD48; color:white;}
.iq-success-full.iq-panel .iq-btn{color:white}
.iq-btn.iq-success-full{background-color: #57BD48; color:white; text-shadow:0 0px 1px rgba(0, 0, 0, 0.35);}
.iq-btn.iq-success-full .fa{text-shadow:0 0px 1px rgba(0, 0, 0, 0.35); color:white;}
.iq-btn.iq-success-full:hover:not(.disabled):not([disabled]){background-color:#6DC161}
.iq-success-full.iq-panel .iq-btn{color:white; text-shadow:0 0px 1px rgba(0, 0, 0, 0.35);}
.iq-panel .iq-success-full.iq-btn i.fa{color:white}


.help-item-container.iq-success-full{
    color:white;
    background-color:#57BD48;
}

.help-item-container.iq-success{
    color:#69C75B;
    background-color:white;
    border:2px solid #57BD48;
}

.iq-success .iq-panel-header .iq-tab.active:after{
  content:"";
  display:block;
  position:absolute;
  top:-4px;
  left:-1px;
  right:-1px;
  background-color:#57BD48;
  height:4px;
}

.iq-danger .iq-panel-header .iq-tab.active:after{
      background-color:#df5640;
}


/*--------------- WARNING ------------------*/
.iq-warning-full.iq-btn, .iq-warning-full.iq-btn-circle, .iq-warning.iq-btn-circle{background-color:#faa732; color:white; text-shadow:0 0px 1px rgba(0, 0, 0, 0.35);}

.iq-warning .iq-btn{color:#FAA732}
/*.iq-warning .iq-panel-header{border-top:10px solid #FAA732;}*/
.iq-warning.iq-panel{   border-top-color:#FAA732;}
.iq-warning .iq-sub-head{color:#FAA732;}
.iq-warning.iq-panel .iq-seperator{border-top:2px solid #FAA732}

.iq-btn.iq-warning-full{background-color: #faa732; color:white; text-shadow:0 0px 1px rgba(0, 0, 0, 0.35);}
.iq-btn.iq-warning-full .fa{text-shadow:0 0px 1px rgba(0, 0, 0, 0.35); color:white;}
.iq-btn.iq-warning-full:hover:not(.disabled):not([disabled]){background-color:#FBB14A; }
 input[type=checkbox].iq-warning.iq-custom:checked::before{
    display: block;
    border-color: #FAA732!important;
    background-color: #FAA732;
}
.iq-btn.iq-outline.iq-warning{
    border:2px solid #FAA732;
    color:#FAA732!important;
    text-shadow:none!important;
    background-color:transparent;
}


/*--------------- DANGER ------------------*/
.iq-danger.iq-btn{ color:#da4f49; }
.iq-danger-full.iq-btn, .iq-danger-full.iq-btn-circle, .iq-danger.iq-btn-circle{background-color:#da4f49; color:white; text-shadow:0 0px 1px rgba(0, 0, 0, 0.35);}

.iq-no-focus-shadow { box-shadow: none!important }

.hide{display:none;}
.iq-btn .fa.hide{display:none;}

.help-item-container.iq-danger-full{
    background-color:#df5640;
}
.iq-btn.iq-danger-full:hover:not(.disabled):not([disabled]){background-color:#FF6862; }
.help-item-container.iq-danger{
    color:#df5640;
    background-color:white;
    border:2px solid #df5640;
}
 input[type=checkbox].iq-danger.iq-custom:checked::before{
    display: block;
    border-color: #df5640!important;
    background-color: #df5640;
}
.iq-btn.iq-outline.iq-danger{
    border:2px solid #df5640;
    color:#df5640!important;
    text-shadow:none!important;
    background-color:transparent;
}




/*--------------- CUSTOM BOOTSTRAP OVERRIDES ------------------*/
.iq-group  .dropdown-header {
    font-weight: bold;
    margin-left: 15px;
    font-size: 110%;
    color: black;
    padding-bottom: 6px;
    display: block;
    padding-top: 3px;
    border-bottom: 1px solid #dddddd;
    margin-bottom: 2px;
    padding-left: 18px;
    margin-left: 0px;
    line-height:22px;
}


/*--------------- KEYS AT TOP OF PAGE ------------------*/
/*.help-item{          line-height: 48px;
    float: left;
    margin-left: 15px;
    margin-top: -3px;
    margin-bottom: 7px;}
.help-icon-round .fa {    font-size: 25px;
    color: #70CA63;}
.help-icon-round{    width: 45px;
    height: 45px;
    text-align: center;
    vertical-align: middle;
    line-height: 53px;
    color: #dff0d8;
    border: 0px solid #BFE8AD; background-color:#dff0d8; border-radius:500px;
    float:left;     box-shadow: 0 2px 3px rgba(0,0,0,.11),inset 0 -1px 0 rgba(0,0,0,.1);
}
           
.help-text{float:left;     font-size: 16px; 
    color: #70CA63; margin-bottom:10px; margin-right:15px; margin-left:7px;}

.help-info{color:#4A89DC; }
.help-info  .help-icon-round{background-color:#D9EDF7; border-color:#4A89DC;}
.help-info .fa{color:#4A89DC;}
.help-info .help-text{color:#4A89DC;}*/


.help-container{
    display:block;
}

.help-item-container .help-main-icon{
        float: left;
    font-size: 36px;
    margin-right: 20px;
}


.help-item{   
    float: left;
}

.help-text {
    float: left;
    font-size: 12px;
    margin-bottom: -2px;
    margin-right: 15px;
    margin-left: 0px;
    color:#333333;
}

.help-icon-round{color: white;
    background-color: #4A89DC;
    border-radius: 500px;
    height: 25px;
    width: 25px;
    text-align: center;
    line-height: 25px;
    margin-top: -4px;
    margin-bottom: -5px; float:left; margin-right:5px; }

.help-item-container {
    background-color: #dddddd;
    padding: 16px;
    margin-top: -4px;
    margin-bottom: 16px;
    border: none;
}

.iq-panel .help-item-container {
    border-radius: 6px;
}

.help-item-container.iq-single-line{
    display:block; line-height:38px;
    padding-top: 10px;
    padding-bottom: 10px;
}


.help-item.iq-info .help-icon-round
{background-color:#4A89DC;}

.help-item.iq-success .help-icon-round
{ background-color: #70CA63;}



/****************** CHECKBOX AND RADIO ******************/
/* DEPRECATED AS DOESNT WORK IN NEWER BROWSERS */
 input[type=checkbox].iq-custom{position:relative; margin-right:13px; margin-bottom: 8px;
    margin-top: 8px; }

input[type=checkbox].iq-custom::before{      cursor: pointer;
    position: relative;
    margin-right: 5px;
    background: #fff;
    display: inline-block;
    border: 3px solid #DDD;
    height: 15px;
    width: 15px;
    top: -4px;
    left: 0px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    content: "";

}

input[type=checkbox].iq-custom:hover::before{  border-color:#4A89DC!important }

input[type=checkbox].iq-custom:checked::before {
    display: block;
    border-color: #4A89DC!important;
    background-color: #4A89DC;
     /*animation-name: spin;
    animation-duration: 500ms;
    animation-iteration-count: 1;*/

}

input[type=checkbox][disabled].iq-custom {
opacity:0.4;}

input[type=checkbox].iq-custom:checked::after{
    position: absolute;
    top: 3px;
    left: 6px;
    width: 6px;
    height: 3px;
    border: solid white;
    border-width: 0 0 3px 3px;
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
    content: "";
}


/* ## USE THE CHECKBOXES BELOW ## */
label.iq-checkbox, label.iq-radio, label.iq-switch {
    cursor: pointer;
    position: relative;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: inline-block; /* This is to override bootstrap's display:block, which made the widths fill 100% */
}

label.iq-checkbox input[type=checkbox], label.iq-radio input[type=radio], label.iq-switch input[type=checkbox]{    
    position: absolute;
    height: inherit;
    width: inherit;
    opacity: 0;
    left: 0;
}

label.iq-checkbox .checkbox, label.iq-radio .radio {
    cursor: pointer;
    position: relative;
    margin-right: 5px;
    background: #fff;
    display: inline-block;
    border: 3px solid #DDD;
    height: 21px;
    width: 21px;
    top: 4px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    padding:0px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

label.iq-radio .radio{border-radius:500px;}

label.iq-checkbox input[type=checkbox]:checked + .checkbox, label.iq-radio input[type=radio]:checked + .radio{
border-color:#4A89DC;
}

label.iq-checkbox input[type=checkbox]:disabled + .checkbox, label.iq-radio input[type=radio]:disabled + .radio {
    opacity:0.5;
    cursor:default;
}

label.iq-checkbox input[type=checkbox]:checked + .checkbox::before{
    position: absolute;
    top: 4px;
    left: 3px;
    width: 6px;
    height: 3px;
    border: solid #888;
    border-width: 0 0 3px 3px;
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
    content: '';
    display:none;
}

label.iq-radio input[type=radio]:checked + .radio::before{
      position: absolute;
    top: 4px;
    left: 4px;
    width: 7px;
    height: 7px;
    background-color: #4A89DC;
    border-radius: 500px;
    content: '';
    display: none;
    padding: 0px;
}

label.iq-checkbox input[type=checkbox]:checked + .checkbox::before, label.iq-radio input[type=radio]:checked + .radio::before {
    border-color: #4a89dc;
    display:block;
}

/* ## SWITCHES ## */
label.iq-switch > label:before {
    content: attr(data-off);
    position: absolute;
    top: 1px;
    right: 3px;
    width: 33px;
}

label.iq-switch > label:after {
    content: "";
    margin: 1px;
    width: 19px;
    height: 19px;
    display: block;
    background: #fff;
    -webkit-border-radius: 2px;
    border-radius: 2px;
}

label.iq-switch > label{
        cursor: pointer;
    display: inline-block;
    position: relative;
    height: 25px;
    width: 58px;
    color: #fff;
    font-size: 10px;
    font-weight: bold;
    line-height: 20px;
    text-align: center;
    background: #D7D7D7;
    border: 2px solid #D7D7D7;
    text-transform: uppercase;
    font-family: Helvetica, Arial, sans-serif;
    -webkit-transition: 0.3s ease-out;
    -moz-transition: 0.3s ease-out;
    -o-transition: 0.3s ease-out;
    transition: 0.3s ease-out;
    -webkit-border-radius: 3px;
    border-radius: 3px;
        -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    margin-top:3px;
    margin-bottom:0px;
}

label.iq-switch input:checked + label{
    background: #4a89dc;
    border-color: #4a89dc;
}

label.iq-switch > input:checked + label{
    padding-left: 33px;
    color: white!important; 
    background: #4a89dc;
    border-color: #4a89dc;
}

label.iq-switch > input:checked + label:before {
    content: attr(data-on);
    left: 1px;
    top: 1px;
}

label.iq-switch > input:checked + label:after {
    margin: 1px;
    width: 19px;
    height: 19px;
    background: white;

}

label.iq-switch > input:checked + label:after {
    color: #4a89dc;
}

label.iq-switch > label + span{
    display: inline-block;
    padding-left: 5px;
    position: relative;
    top: -7px;
}

label.iq-switch > input:disabled + label {
    background: #848484;
    border-color: #848484;
    color: #d8d8d8;
    cursor: not-allowed;
}

label.iq-switch > input:disabled + label:after {
    background: #d8d8d8;
}

@-moz-keyframes spin {
    from { -moz-transform: rotate(0deg); }
    to { -moz-transform: rotate(360deg); }
}
@-webkit-keyframes spin {
    from { -webkit-transform: rotate(0deg); }
    to { -webkit-transform: rotate(360deg); }
}
@keyframes spin {
    from {transform:rotate(0deg);}
    to {transform:rotate(360deg);}
}

.iq-yes-no-container .iq-yes, .iq-yes-no-container .iq-no{
    color:#aaa; font-weight:bold; cursor:pointer; margin-right:10px;
}

.iq-yes-no-container .iq-yes.active, .iq-yes-no-container .iq-no.active{
    color:#333;
}

/*--------------- TABS ------------------*/
.iq-tab-container{position:relative;}
.iq-panel-header .iq-tab{
    color: #AAAAAA;
    cursor: pointer;
    position: relative;
    text-align: center;
    display: block;
    float: left;
    text-align: left;
    margin-top: -35px;
    margin-bottom: -25px;
    height: 72px;
    vertical-align: middle;
    line-height: 69px;
    border-top: 4px solid #ddd;

    padding-left: 20px;
    background-color: #FAFAFA;
    border-left: 1px solid #ddd;
    font-size: 22px;
    box-sizing: border-box;
}

.iq-tab-container .iq-tab:first-child{border-left:0px;}

.iq-tab:hover{
        color:#333;
}

.iq-panel-header .iq-tab:hover:after{
  content:"";
  display:block;
  position:absolute;
  top:-4px;
  left:-1px;
  right:-1px;
  background-color:#AAAAAA;
  height:4px;
}

.iq-panel-header .iq-tab.active{
    color: #333333;
    background-color: #FAFAFA;
}

.iq-tab.active{color:#333;}

.iq-panel.iq-info .help-item-container{
    color:#13A4DE;
}

.iq-panel-header .iq-tab:after{
      content:"";
  display:block;
  position:absolute;
  top:-4px;
  left:-1px;
  right:-1px;
  background-color:#ddd;
  height:4px;
}

.iq-panel-header .iq-tab.active:after{
  content:"";
  display:block;
  position:absolute;
  top:-4px;
  left:-1px;
  right:-1px;
  background-color:#4A89DC;
  height:4px;
}

.iq-panel-header .iq-tab-container{margin-left:-20px; margin-right:-20px; margin-top:6px;  }

.iq-panel-header .iq-tab.iq-success.active:after{
    background-color:#70CA63;
}

    /*--------------- SUB TABS ------------------*/
	.iq-sub-tabs {
		list-style: none;
		border-bottom: 1px solid #ddd;
		height: 34px;
		margin: 0px;
        margin-bottom:20px;

        margin-left: -20px;
        margin-right: -20px;
        margin-top: -20px;
        background-color: #fafafa;
        padding-top: 16px;
        padding-left: 20px;
        padding-right: 20px;
	}

    .iq-sub-tabs.iq-basic{
        margin-left:0px;
        margin-right:0px;
        margin-top:0px;
        background-color:transparent;
    }

    .iq-sub-tabs::after {
        clear:both;
    }

    .iq-sub-tabs li {
        list-style: none;
        color: #aaa;
        cursor: pointer;
        float:left;
		margin-right:35px;
    }

    .iq-sub-tabs li:hover a {
        text-decoration: none;
    }

    .iq-sub-tabs li a{
        padding-bottom: 7px;
        color: #aaa;
        font-size: 15px;
    }



    .iq-sub-tabs li.active a{
        color: #333;
        border-bottom: 3px solid #0088cc;
        padding-bottom:15px;
    }    

    /* ## STYLING CUSTOMER SELECTOR ##*/
    .iq-customer-container {
        float: right;
        margin-top: 0px;
        border: 2px solid white;
        background-color: white;
        webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
        -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
        box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
    }

    .iq-page-head .iq-customer-container{
        float:left;
    }

.iq-customer-container .CusSiteHeading, .iq-customer-container .CusSiteHeading{
    display: block;
    float: none;
    color: #aaa;
    font-size: 12px;
    margin-bottom: -2px;
    margin-top:0px;
    padding-left:13px;
    text-transform: uppercase;
    position:absolute;
}

.iq-customer-container .CusSelector_CustomerBtn {border-right:none!important; max-width:355px;}
.iq-customer-container .CusSelector_AccountManager a, .iq-customer-container .CusSelector_AccountManager .dropdown-toggle{height: 18px;}
.iq-customer-container .CusSelector_AccountManager{margin-right:0px!important;}
.iq-customer-container .CusSelector_CustomerBtn, .iq-customer-container .AutoComplete_Current input, .iq-customer-container .CusSelector_Site button, .iq-customer-container .CusSelector_AccountManager .btn{
     opacity: 1.0;
    background-image: none;
    background-color: Transparent!important;
    text-shadow: none;
    border: none;
    border-radius: 0px;
    padding: 10px!important;
    padding-left: 13px!important;
    padding-right: 13px!important;
    box-shadow: none;
    color: white;
    font-size: 17px;
    font-weight: bold;
    display: block;
    width: auto;
    margin-top: 0px!important;
    border-radius: 0px!important;
    color: #13A4DE;
    padding-top: 22px!important;
    border-right:1px solid #F5F5F5;
}
.iq-customer-container div.CusSelector_Site {margin-right:0px!important;}
.iq-customer-container .AutoComplete_Current input{
    background-color:transparent!important;
    color:#333;
    font-weight:normal;
    border:none;
    cursor:pointer;
    border-radius:none;
}

.iq-customer-container a:hover{color:#333!important; text-shadow:none;}
.iq-customer-container ul li a:hover{color:white!important; text-shadow:none;}

.iq-customer-container .btn .caret{
        border-top-color: #aaa;
    border-bottom-color: #aaa;
}

.iq-customer-container .CusSelector_CustomerBtn:hover{
    font-weight:bold;
    background-color:#69C75B;
    cursor:pointer;
}

.iq-customer-container .CusSelector_Customer .AutoComplete_Current{height:50px;}

.iq-customer-container ul li a, .iq-customer-container ul li{
    font-size:16px;
}

.iq-customer-container .AutoComplete_PulloutOpen{
        display: block;
    width: 240px;
    margin-top: -6px;
    border: 1px solid #ddd;
    padding: 5px;
}

.iq-customer-container .AutoComplete_List li{
    padding-top: 5px;
    padding-bottom: 5px;
}

.iq-centre-image {
    text-align: center;
}
.iq-centre-image > img {
    max-width: 100%;
    max-height: 100%;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}

.iq-no-border {
    border:none;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}

.iq-no-radius {
    -webkit-border-radius: 0!important;
    -moz-border-radius: 0!important;
    border-radius: 0!important;
}

.iq-big-blue-loading {
    text-align: center;
    font-size: 65px;
    color: #4A89DC;
}


   
/* ## TOOLBAR CONTROLS - USED ABOVE GRIDS ##*/
.iq-toolbar-controls{
    background-color: #ddd;
    height: 50px;
    position: relative;
    z-index: 998;
}
.iq-toolbar-controls a.dropdown-toggle:not(.iq-transparent) {
    background-color: white;
    padding: 16px;
    padding-right: 8px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
    margin-right: -1px;
}

.iq-toolbar-controls a.dropdown-toggle:hover{
box-shadow:0 2px 3px rgba(0,0,0,.09),inset 0 -1px 0 rgba(0,0,0,.01);
}

.iq-toolbar-controls .iq-toolbar-item{
    float:left; position:relative;
}


.iq-toolbar-controls .iq-toolbar-item .iq-prefix-icon{
    position: absolute;
    left: 10px;
    top: 12px;
    z-index: 2;
    font-size: 24px;
    color: #aaa;
        pointer-events: none;
}

.iq-toolbar-controls .iq-toolbar-item input:not([type='checkbox']){
 width: 90px;
border-radius: 0px;
margin-top: 0px;
height: 37px;
padding: 4px;
padding-left: 16px;
cursor: pointer;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
margin-right: -1px;
padding-top: 11px;
padding-bottom: 0px;
}

.iq-toolbar-controls .iq-toolbar-item input:not([type='checkbox']):hover{
        box-shadow: 0 2px 3px rgba(0,0,0,.09),inset 0 -1px 0 rgba(0,0,0,.01);
}

.iq-toolbar-controls .iq-toolbar-item .iq-prefix-text{
    position: absolute;
    top: 8px;
    z-index: 2;
    left: 17px;
    font-size: 10px;
    color: #aaa;
    pointer-events: none;
}

.iq-toolbar-controls .iq-toolbar-item.iq-has-prefix-icon .iq-prefix-text{
    left:40px;
}

.iq-toolbar-controls .iq-toolbar-item .dropdown-toggle .CustomDropdownText{
      margin: 0px;
    box-sizing: border-box;
    padding-left: 0px;
    padding-top: 3px;
    margin-bottom: -4px;
    height: 20px;
    line-height: 19px;
}

.iq-toolbar-controls .iq-toolbar-item  .dropdown-menu{border-radius:0px!important;     top: 46px!important;
    width: auto!important;
    right: -2px!important;}

.iq-toolbar-controls .dropdown-menu .btn-SearchBoxContainer input.btn-SearchBox{

    padding-left: 7px;
    padding-top: 2px;
    padding-bottom: 2px;
    height: 26px;
}

.iq-toolbar-controls .iq-toolbar-item .dropdown-toggle .caret{
    margin-top:7px; 
}

.iq-toolbar-controls .iq-actions-dropdown .caret {
    margin-top: 12px;
    border-top-color: #9A9999;
}
.iq-toolbar-controls .iq-actions-dropdown{
    float:none;
    display:inline-block;
}

.iq-actions-dropdown .iq-icon-btn:hover .caret {
    border-top-color:white;
}


.iq-toolbar-controls .iq-toolbar-item.iq-has-prefix-icon .CustomDropdownText{
    padding-left:22px;
}

.iq-toolbar-controls .iq-toolbar-item.iq-has-prefix-icon input{
    padding-left:40px;
}

.iq-toolbar-controls a.iq-icon-btn{
margin-top: 3px;
    margin-left: 5px;

}

.iq-toolbar-controls.iq-grid-toolbar{
    background-color:#fafafa;
    padding-right:15px;
}


/* ## USED TO STYLE OLD JQUERY CONTROLS ## */
button.ui-multiselect.ui-widget{
        border: 1px solid #ddd;
    background-color: #fff;
    padding: 6px;
    border: 1px solid #ddd;
    margin: 0;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    transition: none;
    border-color: #ddd;
    border-radius: 0;
    background-image:none;
}

/* ## COLOUR PICKER ##*/

.iq-group .input-group-addon{
    margin-left:5px;
}

.iq-colourpicker .input-group-addon{
    border: 1px solid #ddd;
    display: block;
    float: left;
    padding: 4px;
    cursor:pointer;
}

.iq-colourpicker .input-group-addon:hover{
    border-color:#aaa;
}

.iq-colourpicker.colorpicker-element .input-group-addon i, .iq-colourpicker.colorpicker-element .add-on i{
    height:20px; width:20px; display:block;
}

/* ## SECTION DIVIDER ##*/
.iq-section-divider{
    height: 0;
    border-top: 1px solid #DDD;
    text-align: center;
    margin-top: 60px ;
    margin-bottom: 40px ;
}

.iq-section-divider span{
    display: inline-block;
    position: relative;
    padding: 0 17px;
    background: white;
    color: #999;
    top: -11px;
    font-size: 12px;
}

/*.iq-section-divider.iq-info{
border-top-color: #4A89DC;
font-weight:bold;
border-top-width:2px;
}*/

.iq-info .iq-section-divider span{color:#4A89DC;}
.iq-success .iq-section-divider span{color:#4A89DC;}


.iq-file-upload{position:relative;}

.iq-file-upload .iq-btn{
    position: absolute;
    left: 4px;
    right: auto;
    top: 4px;
}

.iq-file-upload input[type=file]{
    width: 100%;
    height: 100%;
    cursor: pointer;
    padding: 8px 10px;
    position: absolute;
    -moz-opacity: 0;
    opacity: 0;
    z-index: 11;
    bottom: 0;
    right: 0;
}

.iq-file-upload input[type=text]{
    padding-top:11px; padding-bottom:11px;
    padding-right: 40px;
    padding-left: 125px;
    text-align: right;
    box-sizing: border-box;
    width:100%;
}

.iq-file-upload .fa-upload{
  position: absolute;
    color: #aaa;
    right: 11px;
    top: 12px;
    font-size: 15px;
}

.iq-file-upload-button {
    margin: 4px 0px 0px 4px;
    text-decoration: none;
}

.cui-file-upload-container .iq-file-upload {
    margin-bottom: 4px;
}

.iq-disable-events {
    pointer-events: none;
}
.rotate-90{
     -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}

.iq-file-upload[disabled] {
    pointer-events: none;
}
.iq-file-upload[disabled] .iq-btn {
    opacity: .4;
}
.iq-file-upload[disabled] input[type="text"] {
    background-color: #f5f5f5!important;
    box-shadow: none!important;
}

/*---------------- COLORPICKER -------------*/
.iq-colorpicker-container .iq-colorpicker{
    cursor: pointer;
    position: relative;
    margin-right: 5px;
    background: #fff;
    display: inline-block;
    border: 1px solid #DDD;
    height: 19px;
    width: 19px;
    top: 0px;
    left: 0px;
    display:inline-block;

}
.iq-colorpicker-container .iq-colorpicker > i {
    display: inline-block;
    width: 100%;
    height: 100%;

}

/*---------------- SLIDER ---------------*/
/*.iq-slider-container {
    width: 230px;
}*/
.iq-slider,
.iq-slider.ui-slider {
    height: 1px;
    border: none;
    background: #4A89DC;
    margin-top: 13px;
    width: 100%;
    float: left;
}
.iq-slider .ui-slider-handle,
.iq-slider.ui-slider .ui-slider-handle {
     top: -9.5px;
    border-color: #4A89DC;
    background: #4A89DC;
    border-radius: 200px;
    height: 12px;
    width: 12px;
    margin-left: -6px;
    cursor: pointer;
    padding: 2px;
}
.iq-slider-value {
    float: left;
    margin: 4px -200px -200px 16px;
    width: 0px;
}
.iq-slider-value-opposite {
    float: left;
    margin: 4px 0px 0px -16px;
    width: 0px;
    direction: rtl;
}
.iq-slider.iq-range-slider {
    background: #cccccc;
}
.iq-slider.iq-range-slider .ui-slider-range {
      background: #4A89DC;
    height: 3px;
    top: -1px;
}

/* BOARDS */
.iq-panel .iq-board-container{
    padding-left:15px; padding-right:15px; padding-top:10px;
}

/* HELP */
.help-icon-round {
    color: white;
    background-color: #4A89DC;
    border-radius: 500px;
    height: 25px;
    width: 25px;
    text-align: center;
    line-height: 25px;
    margin-top: -4px;
    margin-bottom: -5px;
    float: left;
    margin-right: 5px;
}

.help-item.iq-info .help-icon-round {
    background-color: #4A89DC;
}

.help-item.iq-success .help-icon-round {
    background-color: #70CA63;
}
.product-price.price-field.price-hidden{
    display:none;
}

.error + a.dropdown-toggle { outline: 2px solid #b94a48; }
input.error{
outline:1px solid #b94a48;
} 

::-webkit-input-placeholder {
    color: #cecece !important;
}

::-moz-placeholder { /* Firefox 19+ */
    color: #cecece !important;
}

:-ms-input-placeholder { /* IE 10+ */
    color: #cecece !important;
}

:-moz-placeholder { /* Firefox 18- */
    color: #cecece !important;
}

/* ## IQ NAV SCROLLSPY ##*/
.iq-nav-scroll-spy,
.nav-links.iq-nav-scroll-spy {
    position: absolute;
    width: 180px;
    margin-left: 20px;
    background-color: transparent;
    border-radius: 5px;
    box-shadow: none;
    float: right;
}

.iq-nav-scroll-spy.sticky,
.nav-links.iq-nav-scroll-spy.sticky {
    position: fixed;
    top: 20px;
}

.iq-nav-scroll-spy > li > a,
.nav-links.iq-nav-scroll-spy > li > a {
    padding: 6px;
    cursor: pointer;
    color: #767676;
    margin-right: 0px;
}

.iq-nav-scroll-spy > li.active > a,
.nav-links.iq-nav-scroll-spy > li.active > a {
    background-color: transparent;
    color: #13A4DE;
    text-shadow: none;
    border-left: 2px solid #13A4DE;
    margin-left: -6px;
    padding-left: 10px;
}

.iq-nav-scroll-spy > li.active > a:hover,
.nav-links.iq-nav-scroll-spy > li.active > a:hover {
    background-color: #eeeeee;
    color: #13A4DE;
    text-shadow: none;
}

/* ## IQ POPOUT ALERT (SPEECH BUBBLE) ##*/
.iq-popout-alert {
    position: absolute;
    width: 90px;
    height: 60px;
    right: -136px;
    padding: 20px;
    border: solid #da4f49;
    background: #da4f49;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.iq-popout-alert:before {
    content: "";
    position: absolute;
    right: 100%;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    border-top: 13px solid transparent;
    border-right: 16px solid #da4f49;
    border-bottom: 13px solid transparent;
    border-right-color: #da4f49;
}

.iq-popout-alert textarea {
    position: inherit;
    width: inherit;
    height: inherit;
    background: inherit;
    text-align: center;
    margin: 0;
    padding: 0;
    border: none;
    resize: none;
    color: white;
}

.iq-popout-alert .iq-danger {

}

/*---------------- HELP NUMBERS -------------*/
.iq-sub-head .iq-help-number{
        position: absolute;
    left: -41px;
    height: 40px;
    width: 40px;
    line-height: 40px;
    text-align: center;
    background-color: #4A89DC;
    border-radius: 500px;
    top: -11px;
    color: white;
    font-weight: bold;
    font-size: 19px;
}

/*---------------- TABLE -------------*/
table.iq-table{
    border-spacing: 0px;
    border:1px solid #ddd;     table-layout: fixed;
}
table.iq-table td, table.iq-table th{
          padding: 12px;
    padding-left: 15px;
    border: none;
    font-size:12px;
    color:#333;
        text-align: left;
}
table.iq-table th{
    background-color: #ddd;
}

    table.iq-table thead tr th {
        color: #949494;
        background-color: #DDDDDD;
    }

table.iq-table td {
    background-color: whitesmoke; border-bottom:1px solid #ddd;
}

    table.iq-table tbody tr td{
        background-color:white;
    }

    table.iq-table tr.iq-condensed td {
        padding-top: 5px;
        padding-bottom: 5px;
    }

table.iq-table tr.iq-error-row td{
    color: #df5640;
    background-color:#f2dede
}

tr.iq-editing-row td {
    padding: 5px;
    border-bottom: 1px solid #ddd;
}

.iq-editing-row td, .iq-editing-row th{
    position:relative;
}

.iq-editing-row td > input{
    padding:11px;
}

.iq-editing-row td a.dropdown-toggle{padding:10px;}
.iq-editing-row td .iq-switch{
    margin-top: 3px;
    margin-bottom: 0px; margin-left:10px;
}

.iq-editing-row .iq-btn-save-row{
    position:absolute;
    position: absolute;
    right: -72px;
    top: 2px;
}

.iq-editing-row.iq-no-padding td{
    padding:0px;
}

/*              ListPill stylings             */
.iq-list-pill {
    display: inline-block;
    background-color: #d7d7d7;
    border-radius: 6px;
    margin-right: 12px;
    margin-bottom: 12px;
    position: relative;
    color: #5d5d5d;
}

.iq-list-pill.dropdown {
    cursor: pointer;
}

.iq-list-pill a {
    cursor: pointer;
    color: #5C5C5C;
}

.iq-list-pill:not(.dropdown),
.iq-list-pill.dropdown > div.dropdown-toggle {
    padding: 8px 16px;
}

.iq-list-pill select {
    background-color: #d7d7d7;
    border: none;
    width: inherit;
    margin: -8px 0px -4px 0px;
}

.iq-list-pill select[value=""] {
    display: none;
}

.iq-list-pill select option {
        background-color: white;
}

/*---------------- PREPEND/APPEND INPUT ICONS -------------*/
.iq-prepend, .iq-append {
    position: relative;
}

.iq-group.iq-prepend > .iq-edit-input {
    padding-left: 28px !important;
}

.iq-group.iq-append > .iq-edit-input {
    padding-right: 28px !important;
}

.iq-prepend > .iq-input-icon,
.iq-append > .iq-input-icon {
    pointer-events: none;
    bottom: 0px;
    width: 32px;
    height: 32px;
    color: inherit;
    line-height: 32px;
    position: absolute;
    text-align: center;
    font-size: 15px;
    color: #aaa;
    margin-bottom: 0px;
}

.iq-append > .iq-input-icon {
    right: 0px;
}

.iq-group.iq-prepend > .iq-edit-input:focus + .iq-input-icon,
.iq-group.iq-append > .iq-edit-input:focus + .iq-input-icon {
    color: rgba(82, 168, 236, 0.8);
}

.iq-list-pill select[value=""] {
    display: none;
}

.iq-list-pill select option {
    background-color: white;
}

/*---------------- SELECT 2 DROPDOWNS -------------*/
html .select2.select2-container--default .select2-selection--single {
        border: 1px solid #ddd;
        border-radius: 0px;
        height: 32px;
}

html .select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 30px
}

html .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 28px;
}

/* Fix the z-index of the dropdown when it's in a modal */
.select2.select2-container.select2-container--default.select2-container--open {
    z-index: 9042;
}

.select2-container.select2-container--default.select2-container--open {
    z-index: 9043;
}

html .select2.select2-container--default .select2-selection {
    border: 1px solid #ddd;
    border-radius: 0px;
    height: 32px;
}

html .select2.select2-container--default .select2-selection--multiple {
    height: auto;
    min-height: 32px;
}

html .select2-container--default .select2-selection--multiple .select2-selection__choice {
    padding: 7px;
    padding-left: 8px;
    padding-right: 8px;
    background-color: #d7d7d7;
    border-radius: 6px;
    position: relative;
    color: #5d5d5d;
    border: none;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
    margin-right: 5px;
    padding-right: 3px;
}

.select2.select2-container .select2-selection--single .select2-selection__clear{
    position: absolute;
    right: -20px;
    font-size: 25px;
    color: #ddd;
    text-shadow: 1px 1px #aaa;
}

.select2.select2-container .select2-selection--single .select2-selection__clear:hover{
    position: absolute;
    right: -20px;
    font-size: 25px;
    color: #aaa;
    text-shadow: none;
}

select.error + span.select2{
outline:2px solid #b94a48;
}

.select2-container .select2-selection--single {
    transition: background-color 0.4s linear;
}


.locked, .locked *{
    pointer-events:none;
}



.iq-striped{
    background-image: linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);
    background-size: 3rem 3rem;
}

.iq-danger > .iq-striped{
    background-color:#da4f49;
}

.iq-warning > .iq-striped{
    background-color:#faa732;
}

.iq-success > .iq-striped{
    background-color:#57BD48;
}


/* #### PULSE ANIMATIONS #### */
/* Add iq-get-attention to make it pusle. (Can change colour by add iq-get-attention-info) */
[class^="iq-get-attention"] {
  cursor: pointer;
  box-shadow: 0 0 0 rgba(204,169,44, 0.4);
  animation: pulse-attention 2s infinite;
}

.iq-get-attention-info{
    animation: pulse-attention-info 2s infinite;
}

.iq-get-attention-danger{
    animation: pulse-attention-danger 2s infinite;
}


[class^="iq-get-attention"]:hover
{
  animation: none;
}

.iq-get-attention {
  cursor: pointer;
  box-shadow: 0 0 0 rgba(191, 191, 191, 0.4);
  animation: pulse-attention 2s infinite;
}

.iq-delay {
    animation-delay: 1s;
}

.iq-get-attention:hover {
  animation: none;
}

@-webkit-keyframes pulse-attention-info {
  0% {
    -webkit-box-shadow: 0 0 0 0 rgba(74, 137, 220, 0.4);
  }
  70% {
      -webkit-box-shadow: 0 0 0 10px rgba(74, 137, 220, 0);
  }
  100% {
      -webkit-box-shadow: 0 0 0 0 rgba(74, 137, 220, 0);
  }
}
@keyframes pulse-attention-info {
  0% {
    -moz-box-shadow: 0 0 0 0 rgb(74, 137, 220);
    box-shadow: 0 0 0 0 rgba(74, 137, 220, 0.6);
  }
  70% {
      -moz-box-shadow: 0 0 0 20px rgba(74, 137, 220, 0);
      box-shadow: 0 0 0 20px rgba(74, 137, 220, 0);
  }
  100% {
      -moz-box-shadow: 0 0 0 0 rgba(74, 137, 220, 0);
      box-shadow: 0 0 0 0 rgba(74, 137, 220, 0);
  }
}

@-webkit-keyframes pulse-attention-danger {
  0% {
    -webkit-box-shadow: 0 0 0 0 rgba(218, 79, 73, 0.4);
  }
  70% {
      -webkit-box-shadow: 0 0 0 10px rgba(218, 79, 73, 0);
  }
  100% {
      -webkit-box-shadow: 0 0 0 0 rgba(218, 79, 73, 0);
  }
}
@keyframes pulse-attention-danger {
  0% {
    -moz-box-shadow: 0 0 0 0 rgba(218, 79, 73, 0);
    box-shadow: 0 0 0 0 rgba(218, 79, 73, 0.6);
  }
  70% {
      -moz-box-shadow: 0 0 0 20px rgba(218, 79, 73, 0);
      box-shadow: 0 0 0 20px rgba(218, 79, 73, 0);
  }
  100% {
      -moz-box-shadow: 0 0 0 0 rgba(218, 79, 73, 0);
      box-shadow: 0 0 0 0 rgba(218, 79, 73, 0);
  }
}

@-webkit-keyframes pulse-attention {
  0% {
    -webkit-box-shadow: 0 0 0 0 rgba(191, 191, 191, 0.4);
  }
  70% {
      -webkit-box-shadow: 0 0 0 10px rgba(191, 191, 191, 0);
  }
  100% {
      -webkit-box-shadow: 0 0 0 0 rgba(191, 191, 191, 0);
  }
}
@keyframes pulse-attention {
  0% {
    -moz-box-shadow: 0 0 0 0 rgba(191, 191, 191, 0.4);
    box-shadow: 0 0 0 0 rgba(191, 191, 191, 0.6);
  }
  70% {
      -moz-box-shadow: 0 0 0 20px rgba(191, 191, 191, 0);
      box-shadow: 0 0 0 20px rgba(191, 191, 191, 0);
  }
  100% {
      -moz-box-shadow: 0 0 0 0 rgba(191, 191, 191, 0);
      box-shadow: 0 0 0 0 rgba(191, 191, 191, 0);
  }
}

/*---------------- IQ BOARD CONTROLS -------------*/
.iq-info-group{
    border: 2px solid #ddd;
    border-radius: 5px;
    padding:5px;
    display:flex;
}

.iq-info-group .iq-info{
    float:left;
    flex:1;
}

.iq-info-name{
    font-size: 10px;
    color: #AAAAAA;
    margin-bottom: 0px !important;
    display: block;
    position: relative;
    z-index: 2;
}


.iq-info-name, .iq-info-text{
        margin-left: 50px;
}

i.iq-info-icon{
    float: left;
    margin-right: 8px;
    font-size: 30px;
    color: #aaaaaa;
    margin-top: 5px;
    width: 30px;
    height: 30px;
    text-align: center;
    margin-left: 5px;
    margin-right: 0px;
}

.iq-info-action{
    flex:0;
    display: flex;
    justify-content: center;
    flex-direction: column;
    text-align: center;
    margin-right:7px;
}

.iq-info-action-btn i{
    font-size: 32px;
    color: #aaa;
    cursor: pointer;
    opacity: 0.5;
}

.iq-info-action-btn:hover i{
    color: #13A4DE;
    opacity: 1;
}

.iq-info-group + .iq-info-group{
    margin-left:25px;
}


/*---------------- IQ TOOLTIP -------------*/

/*Add this to the element that will pop the tooltip*/
.iq-tooltip {
    position: relative;
}

/* Add this to the element (inside the iq-tooltip) that has the tip contents */
.iq-tooltip-content {
    display: none;
    z-index: 10000;
    background-color: white;
    width: 100%;
    padding: 10px 10px;
    position: absolute;
    border-radius: 4px;
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.19);
    bottom: 100%;
    margin: 0 0 10px 0;
    left: 0%;
}


.iq-tooltip-content:after {
    content: " ";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 5px 5px 0 5px;
    border-color: #777 transparent transparent transparent;
    position: absolute;
    /* default setup is top */
    left: 40%;
    top: initial;
    bottom: -6px;
    right: initial;
}

.iq-tooltip:hover .iq-tooltip-content {
    display: inline-block;
    opacity: 1;
}

/*left*/
.iq-tooltip-left .iq-tooltip-content {
    top: 0%;
    right: 100%;
    left: initial;
    bottom: initial;
    margin: 0 10px 0 0;
}
.iq-tooltip-left .iq-tooltip-content:after {
    top: 15px;
    right: -9px;
    left: initial;
    transform: rotate(-90deg);
}

/*right*/
.iq-tooltip-right .iq-tooltip-content {
    top: 0%;
    right: initial;
    left: 100%;
    bottom: initial;
    margin: 0 0 0 10px;
}
.iq-tooltip-right .iq-tooltip-content:after {
    top: 15px;
    left: -9px;
    right: initial;
    transform: rotate(90deg);
}

/*bottom*/
.iq-tooltip-bottom .iq-tooltip-content {
    top: 100%;
    right: initial;
    left: 0%;
    bottom: initial;
    margin: 10px 0 0 0;
}
.iq-tooltip-bottom .iq-tooltip-content:after {
    left: 40%;
    top: -5px;
    right: initial;
    bottom: initial;
    transform: rotate(180deg);
}

.iq-tooltip-content table tr td {
    padding: 4px 5px;
    border-bottom: 1px solid #ece9e9;
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 12px;
    background-color:white;
}

.iq-tooltip-content table tr:last-child td{
    border-bottom:none;
}

/* IQ LOADING */
.iq-tab .iq-loader {
    height: 4px;
    width: 100%;
    position: relative;
    overflow: hidden;
    background-color: #ddd;
    margin-top: 12px;
}
.iq-loader:before{
  display: block;
  position: absolute;
  content: "";
  left: -200px;
  width: 200px;
  height: 4px;
  background-color: #2980b9;
  animation: iq-loading 2s linear infinite;
}

@keyframes iq-loading {
    from {left: -10px; width: 30%;}
    50% {width: 30%;}
    70% {width: 70%;}
    80% { left: 50%;}
    95% {left: 120%;}
    to {left: 100%;}
}

.iq-group textarea[disabled] {
    background-color: #f5f5f5;
}

/* ## Magic dropdown in header ## */
.iq-page-head-dropdown.iq-warning > label,
.iq-page-head-dropdown.iq-danger > label,
.iq-page-head-dropdown.iq-success > label,
.iq-page-head-dropdown.iq-info > label
{
    color: white;
}

.iq-page-head-dropdown.has-icon > label{
    left: 60px;
}

.iq-page-head-magic-drodpown + .select2.select2-container.select2-container--default.select2-container--open {
    z-index: 1;
}

.iq-page-head-dropdown.iq-warning .select2-container--default .select2-selection--single .select2-selection__arrow b,
.iq-page-head-dropdown.iq-danger .select2-container--default .select2-selection--single .select2-selection__arrow b,
.iq-page-head-dropdown.iq-info .select2-container--default .select2-selection--single .select2-selection__arrow b,
.iq-page-head-dropdown.iq-success .select2-container--default .select2-selection--single .select2-selection__arrow b {
    border-color: white transparent transparent transparent;
}

.iq-page-head-dropdown.iq-warning span.select2.select2-container .select2-selection__rendered {
    background-color: #faa732;
    color: white;
    text-shadow: 0 0px 1px rgba(0, 0, 0, 0.35);
}

.iq-page-head-dropdown.iq-success span.select2.select2-container .select2-selection__rendered {
    background-color: #57BD48;
    color: white;
    text-shadow: 0 0px 1px rgba(0, 0, 0, 0.35);
}

.iq-page-head-dropdown.iq-danger span.select2.select2-container .select2-selection__rendered {
    background-color: #da4f49;
    color: white;
    text-shadow: 0 0px 1px rgba(0, 0, 0, 0.35);
}

.iq-page-head-dropdown.iq-info span.select2.select2-container .select2-selection__rendered {
    background-color: #4A89DC;
    color: white;
    text-shadow: 0 0px 1px rgba(0, 0, 0, 0.35);
}

.iq-page-head-dropdown.has-icon .select2-selection__rendered .fa {
    font-size: 30px;
    width: 30px;
    height: 30px;
    margin-right: 10px;
}



/* TASK CONTROLS */

.iq-task-row {
    display: flex;
    margin-bottom: 25px;
}

.iq-task {
    border-radius: 8px;
    -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, .25), inset 0 -1px 0 rgba(0, 0, 0, .1);
    -moz-box-shadow: 0 3px 6px rgba(0, 0, 0, .25), inset 0 -1px 0 rgba(0, 0, 0, .1);
    box-shadow: 0 2px 3px rgba(0,0,0,.09), inset 0 -1px 0 rgba(0,0,0,.01);
    color: #aaa;
    border: 3px solid #aaa;
    padding: 25px;
    padding-top: 15px;
    padding-bottom: 15px;
    flex: 1;
    display: flex;
}

    .iq-task.completed {
        background-color: #FAFAFA;
        color: #aaa;
        border: 3px solid #FAFAFA
    }

    .iq-task.current {
        background-color: white;
        color: #13a4de;
        border-color: #13a4de;
    }

.iq-task-optional-icon {
    flex: 0 0 70px;
    background-color: #aaa;
    color: white;
    font-size: 27px;
    margin-left: 25px;
    margin-right: 25px;
    border-radius: 8px;
    justify-content: center;
    text-align: center;
    line-height: 84px;
    border-radius: 500px;
    height: 72px;
    line-height: 72px;
    margin-top: 10px;
}

.iq-task-icon {
    border-radius: 500px;
    background-color: #aaa;
    width: 50px;
    height: 50px;
    text-align: center;
    color: white;
    line-height: 50px;
    font-size: 25px;
    margin-right: 20px;
    flex: 0 0 50px;
}

.iq-task.current .iq-task-icon {
    background-color: #13a4de;
}

.iq-task-row .iq-small-hint {
    font-style: italic;
}

.iq-task-details {
    justify-content: center;
    align-self: center;
}

.iq-task-row .iq-task + .iq-task{
    margin-left:20px;
}


.iq-task.large {
    padding: 10px;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-right:20px;
}

.iq-task.large .iq-task-icon {
    height: 90px;
    line-height: 90px;
    width: 90px;
    font-size: 40px;
    border-radius: 5px;
    flex: 0 0 90px;
}

.iq-task.large .iq-task-details{
    text-align: center;
    font-weight: normal;
    font-size:24px;
}

.iq-task.clickable:hover {
    background-color: white;
    color: #13a4de;
    border-color: #13a4de;
    cursor: pointer;
    box-shadow: 0 3px 2px rgba(0,0,0,.09), inset 0 -2px 0 rgb(19, 164, 222);
}

.iq-task.clickable:hover .iq-task-icon {
    background-color: #13a4de;
    color:white;
}

.partial-invoice-alert {
    position: absolute;
    background-color: #ff3e3e;
    color: white;
    font-size: 18px;
    width: 32px;
    height: 32px;
    border-radius: 5px;
    text-align: center;
    line-height: 32px;
    position: absolute;
    top: -19px;
    left: -21px;
    box-shadow: 0 1px 1px rgba(0,0,0,.12),inset 0 -1px 0 rgba(0,0,0,.10);
}

.iq-sub-head .iq-new-button{
color: #4a89dc;
    cursor: pointer;
    margin-left: 7px;
    margin-top: -7px;
    display: inline-block;
    font-size: 23px;
    margin-bottom: -5px;
}

.iq-toolbar-controls .iq-sub-head-label{
        font-size: 10px;
    font-weight: bold;
    color: #AAAAAA;
    margin: 8px 8px 0px 0px;
    float: left;
    text-transform: uppercase;
}

/* Sub Panels */
.iq-sub-panel {
    box-shadow: 0px 2px 5px #ddd;
    padding: 25px;
    margin-bottom: 35px;
    border-top: 3px solid #ddd;
}

.iq-sub-panel.iq-info{border-top-color: #4A89DC;}

.iq-sub-panel.iq-warning{border-top-color:#FBB14A;}


.iq-sub-panel h3{
    font-size: 20px;
    line-height: 27px;
    text-align:center;
    margin-bottom: 15px;
    margin-top: -5px;
    color:#aaa;
    font-weight:normal;
}

.iq-sub-panel.iq-info h3{
    color:#4A89DC;
}

.iq-sub-panel.iq-warning h3{
    color:#FBB14A;
}

.iq-sub-panel .iq-table{
    width:100%;
}


/* Cards */
.iq-card {
    margin-bottom: 35px;
}
.iq-card-header{
    padding: 25px;
    margin-top: 5px;
    text-align: right;
    margin-bottom: 0px;
    border-radius: 0px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    font-size: 20px;
    line-height: 27px;
    text-align: center;
    background-color:whitesmoke;
    color:#aaa;
    box-shadow: 0px 2px 5px #ddd;
}

.iq-card.iq-info .iq-card-header{
    color:#4A89DC;
}

.iq-card.iq-warning .iq-card-header{
    color:#FBB14A;
}


.iq-card-content{
    padding: 20px;
    margin-bottom: 5px;
    border-top: 3px solid #ddd;
    box-shadow: 0px 2px 5px #ddd;
}

.iq-card.iq-info .iq-card-content{
    border-top-color:#4A89DC;
}

.iq-card.iq-warning .iq-card-content{
   border-top-color:#FBB14A;
}


.iq-card .iq-card-sub-head {
    font-weight:bold;
       margin-bottom: 3px;
}

.iq-card.iq-info .iq-card-sub-head{
    color:#4A89DC;
}

.iq-card.iq-warning .iq-card-sub-head{
    color:#FBB14A;
}

.iq-card-content table.iq-table{
    border:none;
    width:100%;
}

.iq-card-content table.iq-table td{
    border:none; padding:3px; padding-left:0px;
}

.iq-table .iq-price-col{
    text-align:right;
    font-weight:bold;
}

.iq-line-heading{
      border: 1px solid #ddd;
    display: block;
    position: absolute;
    left: 1px;
    top: 15px;
    right: 1px;
}

.iq-line-heading-box{
    position: relative;
    margin-top: 0px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    display: block;
    border-left: 2px solid #ddd;
    padding-left: 15px;
    border-right: 2px solid #ddd;
    padding-right: 15px;
    background-color: white;
    display:flex;
    height: 32px;
    line-height: 30px;
}

.iq-edit-btn.fa{
    color: #ddd;
    font-size: 30px;
    cursor:pointer;
    margin-left:3px;
}

.iq-edit-btn.fa:hover{
    color:#aaa;

}

.iq-line-heading-box .iq-edit-btn{
    margin-left: 6px;
}

.iq-remove-row{
    color:#aaa;
    font-size:16px;
    cursor:pointer;
}

/* Fixes IE11 bug where icon keeps a spinning */
.iq-group:not(.loading) .iq-prepend-icon.fa:not(.fa-spin){
        animation: none;
}