/*
-----------------------------------------------
Grey Box Method - Layout CSS
----------------------------------------------- */

@font-face {
    font-family: 'AileronRegular';
    src: url('/fonts/Aileron-Regular-webfont.eot');
    src: url('/fonts/Aileron-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('/fonts/Aileron-Regular-webfont.woff2') format('woff2'),
         url('/fonts/Aileron-Regular-webfont.woff') format('woff'),
         url('/fonts/Aileron-Regular-webfont.ttf') format('truetype'),
         url('/fonts/Aileron-Regular-webfont.svg#aileronregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'AileronSemiBold';
    src: url('/fonts/Aileron-SemiBold-webfont.eot');
    src: url('/fonts/Aileron-SemiBold-webfont.eot?#iefix') format('embedded-opentype'),
         url('/fonts/Aileron-SemiBold-webfont.woff2') format('woff2'),
         url('/fonts/Aileron-SemiBold-webfont.woff') format('woff'),
         url('/fonts/Aileron-SemiBold-webfont.ttf') format('truetype'),
         url('/fonts/Aileron-SemiBold-webfont.svg#aileronsemibold') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
  font-family: 'Droid Sans';
  font-style: normal;
  font-weight: 400;
    src: url('/fonts/droid-sans.eot');
    src: url('/fonts/droid-sans.eot?#iefix') format('embedded-opentype'),
         url('/fonts/Droid-Sans.woff2') format('woff2'),
         url('/fonts/droid-sans.woff') format('woff'),
         url('/fonts/Droid-Sans.ttf') format('truetype'),
         url('/fonts/droid-sans.svg#aileronsemibold') format('svg');
  /*src: local('Droid Sans'), local('DroidSans'), url(/fonts/Droid-Sans.woff2) format('woff2');*/
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}
@font-face {
  font-family: 'Droid Sans Bold';
  font-style: normal;
  font-weight: 400;
    src: url('/fonts/droidsans-bold.eot');
    src: url('/fonts/droidsans-bold.eot?#iefix') format('embedded-opentype'),
         url('/fonts/droidsans-bold.woff2') format('woff2'),
         url('/fonts/droidsans-bold.woff') format('woff'),
         url('/fonts/DroidSans-Bold.ttf') format('truetype'),
         url('/fonts/droidsans-bold.svg#aileronsemibold') format('svg');
  /*src: local('Droid Sans'), local('DroidSans'), url(/fonts/Droid-Sans.woff2) format('woff2');*/
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}

html, body {
	height: 100%;
}
body {
	background: #fff;
	color: #333;
	font-size: 11px;
	padding: 0 0 0px;
	overflow-y:scroll;
}

/*.wrap_all { background-image: url("/img/topfade.png"); background-repeat: repeat-x; background-position: 0 83px; }*/

.required{color: #ff0000; font-weight: bold; }
.red { color: #ff0000; }
.green { color: #33BB11; }
.block ul {
	padding-left: 20px;
}
table.form input, table.form input:focus {
    border: 1px solid blue;
}

table.form input, table.form select:focus {
	border: 1px solid blue;
}

/* Accordion Styling */
.ac_wrap .ac_title {
    cursor: pointer;
    font-size: 13px;
    font-weight: bold;
    line-height: 40px;
    padding-left: 15px;
    border-bottom: 1px solid #E8E6E6;
    background: #f5f5f5;
}
.ac_title:first-child {
	border-radius: 8px 8px 0px 0px;
}
.ac_title .arrow {
    background: #bdc3c7 url("/img/t_plus.png") no-repeat center center;
    display: block;
    width: 40px;
    height: 40px;
	padding: 0;
    float: right!important;
}
.ac_title.faded {
}
.ac_wrap .ac_content {
	
	background-color: #efefef;
    background-color: rgba(255,255,255,0.65);
    border-bottom: 1px solid #E8E6E6;
    margin: 0;
    padding: 15px 10px 15px 15px;
	overflow: hidden;
	/*max-height: 5000px;*/
}
.ac_content.hidden {
	max-height: 0px!important;
    padding: 0px 10px 0px 15px;
	border:none;
}
.ac_content:last-child {
	
	border-radius: 0px 0px 8px 8px;
	margin-bottom: 20px;
}

/* Account Search */
div.acctsearch {
	position: absolute;
	top: 0px;
	right: 0px;
	border-radius: 0px 8px 0px 0px;
	background-color: rgba(253,151,39,.90);
	border: 1px solid #FD9727;
	height: 26px;
	width: 602px;
	background-image: url("/img/search.png");
	background-repeat: no-repeat;
	background-position: 579px 3px;
	box-sizing: border-box;
	padding: 4px;
	font-size: 14px;
	color: #ffffff;
}
div.acctsearch div.acctlist {
	display: none;
	top: 25px;
	right: -1px;
	position: absolute;
	z-index: 1000;
	width: 602px;
	max-height: 300px;
	background-color: rgba(253,151,39,.90);
	border: 1px solid #FD9727;
	padding: 4px;
	font-size: 11px;
	color: #ffffff;
	box-sizing: border-box;
	overflow-y: auto;
}
div.acctsearch.tapped div.acctlist {
	display: block;
}
div.acctsearch:hover div.acctlist {
	display: block;
}
div.acctsearchhdr {
	cursor: pointer;
}
div.acctsearch h2 {
	color: #ffffff;
}
div.acctsearch div#acct_results {
	padding-bottom: 10px;
}
div.account_result {
	padding: 5px;
	font-weight: normal;
	font-size: 13px;
	cursor: pointer;
}
div.account_result:hover {
	background-color: #FD9727;
}

div.acctsearch label {
	box-sizing: border-box;
	font-weight: normal;
	height: 11px;
	width:49%;
    display: inline-block;
}
div.acctsearch div.field {
	float: none;
	width: 100%;
	padding-bottom: 10px;
}

div.acctsearch input, div.acctsearch input:focus, div.acctsearch select, div.acctsearch select:focus, div.acctsearch textarea, div.acctsearch textarea:focus {
	border: 1px solid #7C7B8B;
	/*margin-left: 20px;*/
	padding: 2px;
	height: 20px;
	box-sizing: content-box;
	width:100%;
}
div.acctsearch .inputdiv {
	padding: 2px;
	/*padding-left: 22px;*/
	padding-right: 12px;
	width:50%;
	box-sizing: border-box;
    display: inline-block;
}


/* Receipt Styling */
div.receipt  {
	background-color: #fff;
	color: #000;
	width: 450px;
	margin-left: auto;
	margin-right: auto;
	padding: 10px;
	border: 1px dashed #000000;
}
div.receipt span.align_right {
	text-align: right;
}
div.receipt span {
	width:150px;
    display: inline-block;
}
div.receipt h3 {
	text-align: center;
	color: #000;
}
div.receipt div.field {
	float: none;
	width: 100%;
	padding-bottom: 10px;
}

div.receipt input, div.receipt input:focus, div.receipt select, div.receipt select:focus, div.receipt textarea, div.receipt textarea:focus {
	border: 1px solid #7C7B8B;
	/*margin-left: 20px;*/
	padding: 2px;
	height: 20px;
	box-sizing: content-box;
	width:100%;
}
div.receipt label {
	box-sizing: border-box;
	font-weight: bold;
	height: 11px;
	width:50%;
    display: inline-block;
	border-bottom: 1px dotted #cccccc;
}
div.receipt .indented label {
	margin-left: 50px;
	width: calc(50% - 50px);
}
div.receipt .inputdiv {
	padding: 2px;
	/*padding-left: 22px;*/
	padding-right: 12px;
	width:30%;
	box-sizing: border-box;
    display: inline-block;
}

/* ToolTips */
/*
.tooltip {
    position: relative;
    display: inline-block;
    border-bottom: 1px dotted #FD9727;
    zcursor: help;
    color: #006080;
}
.tooltip .tooltiptext {
    visibility: hidden;
    position: absolute;
    width: 120px;
    background-color: #FD9727;
    color: #ffffff;
    text-align: center;
    padding: 5px 0;
    border-radius: 6px;
    z-index: 1;
    opacity: 0;
    transition: opacity 1s;
}
.tooltip:hover .tooltiptext {
    visibility: visible;
    opacity: 1;
}
.tooltip .tooltiptext2 {
    visibility: hidden;
    position: absolute;
    width: 125px;
    background-color: #FD9727;
    color: #ffffff;
    text-align: center;
    padding: 5px 0;
    border-radius: 6px;
    z-index: 1;
}
.tooltip:hover .tooltiptext2 {
    visibility: visible;
}
.tooltip-right {
  top: -5px;
  left: 125%;  
}
.tooltip-right2 {
  top: -5px;
  left: 105%;  
}

.tooltip-right::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 100%;
    margin-top: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: transparent #FD9727 transparent transparent;
}

.tooltip-bottom {
  top: 115%;
  left: 50%;  
  margin-left: -150px;
  min-width: 300px;
}

.tooltip-bottom2 {
  top: 125%;
  left: 50%;  
  margin-left: -60px;
}

.tooltip-bottom::after {
    content: "";
    position: absolute;
    bottom: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: transparent transparent #FD9727 transparent;
}

.tooltip-top {
  bottom: 125%;
  left: 50%;  
  margin-left: -60px;
}
.tooltip-top2 {
  bottom: 115%;
  left: 50%;  
  margin-left: -60px;
}

.tooltip-top::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: #FD9727 transparent transparent transparent;
}

.tooltip-left {
  top: -5px;
  bottom:auto;
  right: 128%;  
}

.tooltip-left2 {
  top: -5px;
  bottom:auto;
  right: 105%;  
}

.tooltip-left::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 100%;
    margin-top: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: transparent transparent transparent #FD9727;
}

.tooltip .tooltiptext-bottomarrow {
    visibility: hidden;
    width: 120px;
    background-color: #ffffff;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px 0;
    position: absolute;
    z-index: 1;
    bottom: 130%;
    left: 50%;
    margin-left: -60px;
}
.tooltip .tooltiptext-bottomarrow::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: #ffffff transparent transparent transparent;
}
.tooltip:hover .tooltiptext-bottomarrow {
    visibility: visible;
}

.tooltip .tooltiptext-toparrow {
    visibility: hidden;
    width: 120px;
    background-color: #FD9727;
    color: #ffffff;
    text-align: center;
    border-radius: 6px;
    padding: 5px 0;
    position: absolute;
    z-index: 1;
    top: 150%;
    left: 50%;
    margin-left: -60px;
}
.tooltip .tooltiptext-toparrow::after {
    content: "";
    position: absolute;
    bottom: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: transparent transparent #FD9727 transparent;
}
.tooltip:hover .tooltiptext-toparrow {
    visibility: visible;
}

.tooltip .tooltiptext-leftarrow {
    visibility: hidden;
    width: 120px;
    background-color: #FD9727;
    color: #ffffff;
    text-align: center;
    border-radius: 6px;
    padding: 5px 0;
    position: absolute;
    z-index: 1;
    top: -5px;
    left: 110%;
}
.tooltip .tooltiptext-leftarrow::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 100%;
    margin-top: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: transparent #FD9727 transparent transparent;
}
.tooltip:hover .tooltiptext-leftarrow {
    visibility: visible;
}
.tooltip .tooltiptext-rightarrow {
    visibility: hidden;
    width: 120px;
    background-color: #FD9727;
    color: #ffffff;
    text-align: center;
    border-radius: 6px;
    padding: 5px 0;
    position: absolute;
    z-index: 1;
    top: -5px;
    right: 110%;
}
.tooltip .tooltiptext-rightarrow::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 100%;
    margin-top: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: transparent transparent transparent #FD9727;
}
.tooltip:hover .tooltiptext-rightarrow {
    visibility: visible;
}*/

.q_ext {
	color: #fff;
	border-bottom: 1px solid #fff;
}


.toolTip {
	margin-left: 5px;
	position:relative;
	display: inline-block;
	cursor: pointer;
	border-bottom: 1px solid #FD9727;
	color: #FD9727;
}
.toolTip .tipText {
	visibility: hidden;
	width: 300px;
	background-color: #FD9727;
	color: #ffffff;
	padding: 8px;
	border-radius: 8px;
	position: absolute;
	z-index: 9999;
    height: initial;
}
.q_ext .toolTip {
	color: #fff;
	border-bottom: 1px solid #fff;
}
.toolTip:hover .tipText {
	visibility: visible;
}
.toolTip.tapped .tipText {
	visibility: visible;
}

/* Questionnaire Styling */
div.questionnaire div.field {
	float: none;
	width: 100%;
	padding-bottom: 10px;
}

div.questionnaire input, div.questionnaire input:focus, div.questionnaire select, div.questionnaire select:focus, div.questionnaire textarea, div.questionnaire textarea:focus {
	border: 1px solid #7C7B8B;
	/*margin-left: 20px;*/
	padding: 2px;
	height: 20px;
	box-sizing: content-box;
	width:100%;
}

div.questionnaire label.radio {
	line-height: 18px;
	display: inline-block;
	width: calc(100% - 19px);
	padding-left: 4px;
}
div.questionnaire input[type=radio].radioToggle {
	display: none!important;
}
div.questionnaire div.inputdiv.radioToggle div {
	display: inline-block;
}
div.questionnaire div.inputdiv.radioToggle div label {
	display: block;
	text-align: center;
	color: #CCC;
	font-weight: bold;
	
	background-color: #AAA;
	padding: 4px;
	cursor: pointer;
    box-sizing: border-box;
    padding: 4px 8px 4px 8px;
	height: 24px;
	width: initial;
	
}
div.questionnaire div.inputdiv.radioToggle div label {
	min-width: 75px;
}

div.questionnaire div.inputdiv.radioToggle label.selected  {
	background-color: #FD9727;
	color: #ffffff;
}

div.questionnaire div.inputdiv.radioToggle div:first-of-type label {
	border-radius: 8px 0px 0px 8px;
}
div.questionnaire div.inputdiv.radioToggle div:last-of-type label {
	border-radius: 0px 8px 8px 0px;
}

div.questionnaire input.error, div.questionnaire input.error:focus, div.questionnaire select.error, div.questionnaire select.error:focus, div.questionnaire textarea.error, div.questionnaire textarea.error:focus {
	border: 1px solid #ffaaaa;
	background-color: #ffdddd;
}
div.form, div.questionnaire {
	-webkit-touch-callout: none; /* iOS Safari */
  -webkit-user-select: none;   /* Chrome/Safari/Opera */
  -khtml-user-select: none;    /* Konqueror */
  -moz-user-select: none;      /* Firefox */
  -ms-user-select: none;       /* IE/Edge */
  user-select: none;           /* non-prefixed version, currently
                                  not supported by any browser */
}
div.form .selectable, div.questionnaire .selectable {
  -webkit-touch-callout: text; /* iOS Safari */
    -webkit-user-select: text; /* Chrome/Safari/Opera */
     -khtml-user-select: text; /* Konqueror */
       -moz-user-select: text; /* Firefox */
        -ms-user-select: text; /* Internet Explorer/Edge */
            user-select: text; /* Non-prefixed version, currently
                                  not supported by any browser */
}
div.form canvas.signature {
	border: 1px solid #7C7B8B;
	height:144px;
	background-color:#fff;
	padding: 2px;
	box-sizing: content-box;
	width:100%;
	cursor:pointer;
}
div.questionnaire label {
	box-sizing: border-box;
	font-weight: bold;
	height: 11px;
	width:69%;
    display: inline-block;
	border-bottom: 1px dotted #cccccc;
}
div.questionnaire .indented label {
	margin-left: 50px;
	width: calc(69% - 50px);
}
div.questionnaire .inputdiv {
	padding: 2px;
	/*padding-left: 22px;*/
	padding-right: 12px;
	width:30%;
	box-sizing: border-box;
    display: inline-block;
}
div.questionnaire .productItem {
	float: left;
    box-sizing: border-box;
    width: 33.333%;
	height: initial;
	
}
div.questionnaire .productImage {
    box-sizing: border-box;
	margin: 10px;
	padding: 8px;
	border-radius: 8px;
	background-color: rgba(253,151,39,.90);/*rgba(253, 151, 39, .75);*/
	color: #ffffff;
}
div.questionnaire .productImage,
div.questionnaire .productDesc {
	float: none;
	width: 100%;
	height: initial;
	clear: both;
	font-weight: bold;
	text-align: center;
}

div.questionnaire .productPrice { display: none; }

/* Form Styling */
div.form {
	/*float: left;
	width: 50%;*/
}
div.form div.field {
	float: left;
	width: 25%;
	padding-bottom: 10px;
}

div.form div.field.smallField {
	float: left;
	width: 12.5%;
	padding-bottom: 10px;
}

div.form div.field.halfField {
	float: left;
	width: 50%;
	padding-bottom: 10px;
}

div.form div.field.audioField {
	float: left;
	width: 50%;
	padding-bottom: 10px;
}

div.form div.field.audioField .sel_method {
	float: left;
	width: 25%;
	padding-bottom: 10px;
}

div.form div.field.audioField .audioField_view {
	float: left;
	width: calc(75% - 6px);
	padding-bottom: 10px;
}

div.form div.field.audioField audio {
	width: 100%;
	box-sizing: border-box;
    padding: 2px;
    margin-top: 2px;
}
div.form div.field.audioField .record_status {
	width: 70%;
	float: left;
	/*height: 20px;*/
	/*border: 1px solid #7C7B8B;*/
	background-color:#333;
	color: #C33;
	box-sizing:border-box;
	padding: 4px 16px 4px 16px;
    margin: 0;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
	font-size: 12px;
    line-height: 18px;
	top: 4px;
	position: relative; 
}

div.form div.field.audioField .record_buttons {
	width: 30%;
	float: left;
	box-sizing:border-box;
}
div.form div.field.fullField {
	float: left;
	width: 100%;
	padding-bottom: 10px;
}
div.form input, div.form input:focus, div.form select, div.form select:focus, div.form textarea, div.form textarea:focus {
	border: 1px solid #7C7B8B;
	/*margin-left: 20px;*/
	padding: 2px;
	height: 20px;
	box-sizing: content-box;
	width:100%;
}
div.form select[multiple] {
    height: auto;
}
div.form .inline input, div.form .inline input:focus, div.form .inline select, div.form .inline select:focus, div.form .inline textarea, div.form .inline textarea:focus {
	border: 1px solid #7C7B8B;
	/*margin-left: 20px;*/
	padding: 2px;
	height: 20px;
	box-sizing: content-box;
	/*width:100%;*/
}
div.form input.radio, div.form input.radio:focus {
	width:15px;
	margin: 0;
	vertical-align: top;
	line-height: 18px;
}
div.form .right {
	text-align:right;
}
div.form .inline.input-left label, div.form .inline.input-left .inputdiv {
	float: right;
}
div.form label {
	height: 11px;
}
div.form div.field.multiField select {
	height: 71px;
}
div.form .checkbox .inputdiv {
	width: 30px!important;
}
div.form .checkbox label {
	line-height: 30px;
	width: calc(100% - 30px);
}
div.form .inputdiv {
	padding: 2px;
	/*padding-left: 22px;*/
	padding-right: 12px;
	width:100%;
	box-sizing: border-box;

}
div.form .field.inline {
	padding-bottom: 0px!important;
}
div.form .inline.inputdiv {
	padding: 2px;
	/*padding-left: 22px;*/
	padding-right: 12px;
	display: inline-block;
	box-sizing: border-box;
	width: 40%;

}
div.form div.field.fullField textarea, div.form div.field.fullField textarea:focus {
	border: 1px solid #7C7B8B;
	/*margin-left: 20px;*/
	padding: 2px;
	height: 100px;
	box-sizing: content-box;
	/*width:95%;*/
}
div.form span {
	/*margin-left: 20px;*/
	padding: 3px 3px 3px 0px;
	height: 24px; /*15px;*/
	box-sizing: content-box;
	display: inline-block;
}
div.form label {
	display: block;
	color: rgb(19,25,36);
	font-family: AileronSemiBold;
}
div.form .inline label {
	display: inline-block;
}
div.form label.radio {
	line-height: 18px;
	display: inline-block;
	width: calc(100% - 19px);
	padding-left: 4px;
}
div.form input[type=radio].radioToggle {
	display: none!important;
}
div.form div.inputdiv.radioToggle div {
	display: inline-block;
}
div.form div.inputdiv.radioToggle div label {
	display: block;
	text-align: center;
	color: #CCC;
	font-weight: bold;
	
	background-color: #AAA;
	padding: 4px;
	cursor: pointer;
    box-sizing: border-box;
    padding: 4px 8px 4px 8px;
	height: 24px;
	width: initial;
	
}
div.form div.inputdiv.radioToggle div label {
	min-width: 75px;
}
div.followme div.inputdiv.radioToggle div label {
	min-width: initial;
}

div.form div.inputdiv.radioToggle label.selected  {
	background-color: #FD9727;
	color: #ffffff;
}

div.form div.inputdiv.radioToggle div:first-of-type label {
	border-radius: 8px 0px 0px 8px;
}
div.form div.inputdiv.radioToggle div:last-of-type label {
	border-radius: 0px 8px 8px 0px;
}

div {
  -webkit-transition: all .75s ease;
  -moz-transition: all .75s ease;
  transition: all .75s ease;
}
div.hidden {
	max-height: 0px;
	overflow: hidden;
}


div.form div.field.hr {
	width: 100%;
	float: none;
	clear: both;
	background-image: url("/img/greypix.png");
	background-repeat: repeat-x;
	background-position: 25% center;
	margin-bottom: 5px;
	margin-top: 5px;
}
div.form div.field.hr label {
	display: inline-block;
	width: 75%;
}
div.form div.field.hr select {
	display: inline-block;
	width: 20%;
	float:right;
}

#pwd_new, #pwd_new_confirm {
    padding:4px;
    margin:2px;
    border:solid 1px #999;
}

#pwd_new div, #pwd_new_confirm div {
    margin-left:20px;
    margin-top:6px;
}
#pwd_new .left, #pwd_new_confirm .left {
    float:left;
}
#pwd_new .clear, #pwd_new_confirm .clear {
    clear:both;
}




.pretext {
	font-style: italic;
	color: #BDBDBD;
}

.jstree-icon .user{background:url(../img/icon-agent.png) no-repeat center left;}



/* login screen
----------------------------------------------- */
.loginPanel {
    position: absolute;
    width: 400px;
    height: 220px;
    top: 50%;
    left: 50%;
    margin-left: -200px; /* margin is -0.5 * dimension */
    margin-top: -140px;
}

.fullscreenDiv {
    /*background-color: #e8e8e8;*/
    width: 100%;
    height: auto;
    bottom: 0px;
    top: 0px;
    left: 0;
    position: absolute;
}

td.loginLabel {
	color: #ffffff;
	font-weight: bold;
}

/* Agent Status Indicators */
.agentStatus {
	text-align: center;
	font-weight: bold;
	font-size: 12px;
}

.agentStatusReady { background: #04B404; }
.agentStatusNotConnected { background: #ff0000; } 
.agentStatusPaused { background: #FF8000; }
.agentStatusConnected { background: #00BFFF; }


/* commons
----------------------------------------------- */
.floatleft{float:left;}
.floatright{float:right;}
.fontwhite{color:#fff;}
.small{font-size:9px;}
.inline-ul li{display:inline; color:#fff;}
.marginleft10{margin-left:10px;}
.grey{color:#C2C2C2;}
.white-bold {color:#ffffff; font-weight:bold;}
.toolbar{float:left;}

/* anchors
----------------------------------------------- */
a {
	color: #000;
	font-weight:bold;
	text-decoration: none;
}
a:hover {
	color:#333;
}


/* 960 grid system container background
----------------------------------------------- */
.container_12,
.container_16 {
}


/* headings
----------------------------------------------- */
h1, h2, h3, h4, h5, h6 {font-family: Droid Sans Bold; line-height:1.2em; margin-bottom:.5em; color: rgb(19,25,36); }
/*h2 {margin-top:1em;}*/
h2 {
	font-size:1.2em;
	font-weight:bold;
}
h6 {font-size:1em; text-transform:uppercase;}


h1 a {
	font-weight:normal;
}

h1 { padding-top:0.5em;padding-bottom:0.5em;border-bottom: 1px solid #7C7B8B; }


/* Dashboard Stuff
----------------------------------------------- */
.unbilled { font-size: 2em; font-family: Droid Sans Bold; color: #7C7B8B;}
.unbilled span { font-size: 2em; }

/* Section Headings
----------------------------------------------- */
h1.time { border: none; padding-right: 3em; background-image: url("/img/time.png"); background-position: right top; background-repeat: no-repeat; background-size: 3em; }
h1.invoice { border: none; padding-right: 3em; background-image: url("/img/invoices.png"); background-position: right top; background-repeat: no-repeat; background-size: 3em; }
h1.project { border: none; padding-right: 3em; background-image: url("/img/projects.png"); background-position: right top; background-repeat: no-repeat; background-size: 3em; }
h1.prepaid { border: none; padding-right: 3em; background-image: url("/img/time.png"); background-position: right top; background-repeat: no-repeat; background-size: 3em; }
h1.quote { border: none; padding-right: 3em; background-image: url("/img/quotes.png"); background-position: right top; background-repeat: no-repeat; background-size: 3em; }
h1.account { border: none; padding-right: 3em; background-image: url("/img/dashboard.png"); background-position: right top; background-repeat: no-repeat; background-size: 3em; padding-bottom: 0em; }
h1 span { display:block; font-size: 0.4em; color: rgb(19,25,36); font-family: AileronRegular;border-bottom: 1px solid rgb(19,25,36); }
h2 span { display:block; padding-top: 2px; font-size: 0.8em; color: rgb(19,25,36); font-family: AileronRegular; }

/* branding
----------------------------------------------- */
#branding {
	font-weight:normal;
	text-align:left;
	padding:25px 1em 25px 1em;
	margin-bottom:0;
	max-width:1300px;
	margin-left: auto;
	margin-right: auto;
	position:relative;
	z-index: 999;
}

/*.header-repeat{ background-color:#263248;}*/
.header_pad { width:100%;height:83px;}
.header { position:fixed;width:100%; transition:all 0.4s ease; z-index:999; /*background-color: #7C7B8B; border-bottom: 1px solid #7C7B8B;*/}
.header.sticky { background-color: rgba(38,50,72,.90); /*rgba(0,0,0,.25);*/ }
/*
#branding a{color:#A1EAFF; font-weight:normal;}
#branding a:hover{color:#fff;}

#branding a:before{content:" | "; color:#fff;}

#branding ul, #branding ul li{margin:0px; padding:0px; }
#branding li{padding:0px 0px 0px 0px !important;}
.top-10{margin-top:-10px;}
*/

/* page heading
----------------------------------------------- */
h2#page-heading {
	font-weight:normal;
	padding:.5em;
	margin:0 0 10px 0;
	border-bottom:1px solid #ccc;
	color:#fff;
}


/* boxes
----------------------------------------------- */
.box {
	/*margin-bottom:20px;*/
	/*margin:10px 10px 10px 10px;*//* margin-left:-8px;*/
	padding:2px;/* margin-left:-8px;*/
	/*border: 1px solid #315c7c;*/
	padding-right: 75px;
}
.box.grid{padding-bottom:20px;}
.box.round{
}

.box h2 {
	font-size:1.2em;
	font-weight:bold;
	color:#7C7B8B;
	margin:0;
	padding: 0.5em 0.5em 1.0em 0;
	border-bottom:1px solid #7C7B8B;
}
.box h2 a,
.box h2 a.visible {
	color:#1B548D;
	background:url("../img/switch_minus.gif") 97% 50% no-repeat;
	display:block;
	padding:6px 12px;
	margin:-6px -12px;
	border:none;

	 -moz-border-radius: 5px 5px 0px 0px; /* Firefox */
	  -webkit-border-radius: 5px 5px 0px 0px; /* Safari, Chrome */
	  border-radius: 5px 5px 0px 0px; /* CSS3 */

}
.grid_4 .box h2 a {
	background-position: 97% 50%;
}
.grid_5 .box h2 a {
	background-position: 98% 50%;
}
.grid_12 .box h2 a {
	background-position: 99% 50%;
}


.box h2 a.hidden,
.box h2 a.hidden:hover {
	background-image: url("../img/switch_plus.gif");
}
.box h2 a:hover {
	background-color:transparent;
}

.box.first{margin-top:5px;}

.block {
	padding-top:5px;
}
div.menu {
	padding:0;
}
div.menu h2 {
	margin:0;
}
div.menu .block {
	padding-top:0;
}


/* sidebar menu
----------------------------------------------- */

.box.sidemenu{ background-color:#333; border-right:1px solid #3A5665; padding:0px; margin:0px; cursor:pointer; }
.box.sidemenu .block{padding-top:0px; margin-top:0px;}

/* paragraphs, quotes and lists
----------------------------------------------- */
p {
	margin-bottom:1em;
}
blockquote {
	font-family: AileronRegular, serif;
	font-size:1.2em;
	padding-left:1em;
	border-left:4px solid #ccc;
}
blockquote cite {
	font-size:.9em;
}
ul, ol {
	padding-top:0;
}


/* menus
----------------------------------------------- */
ul.menu {
	list-style:none;
	border-top:1px solid #bbb;
}
ul.menu li {
	margin:0;
}
ul.menu li a {
	display:block;
	padding:4px 10px;
	border-bottom:1px solid #ccc;
}
ul.menu li a:hover {
	background:#eee;
}
ul.menu li a:active {
	background:#ccc;
}


/* submenus
----------------------------------------------- */
ul.menu ul {
	list-style:none;
	margin:0;
}
ul.menu ul li a {
	padding-left:30px;
}


/* section menus
----------------------------------------------- */
ul.section {
	border-top:0;
	margin-bottom:0;
}
ul.section li {

}
ul.section li a {
	background:url(../img/sidemenu-repeat.jpg) repeat-x;
	line-height:26px;
}
ul.section li a:hover {
	background:url(../img/sidemenu-repeat-hover.jpg) repeat-x;
}
ul.section li a:active {
	color:#1B548D;
	background:url(../img/sidemenu-repeat-hover.jpg) repeat-x;
}
ul.section li li a {
	background:#ddd;
	border-bottom:1px solid #eee;
}
ul.section li li a:hover {
	background:#ccc;
}
ul.section li li a:active {
	color:#000;
	background:#fff;
}
ul.section ul li {
	text-transform:none;
}
ul.section ul.current li a {
	background:#eee;
	border-bottom:1px solid #fff;
}
ul.section ul.current li a:hover {
	background:#E6F0F3;
}
ul.section ul.current li a:active {
	background:#E6F0F3;
}
ul.section li a.current {
	color:#1B548D;
	background:url(../img/sidemenu-repeat-hover.jpg) repeat-x;
}
ul.section li a.current:hover {
	color:#1B548D;
	background:url(../img/sidemenu-repeat-hover.jpg) repeat-x;
}
ul.section li a.current:active {
	color:#1B548D;
	background:url(../img/sidemenu-repeat-hover.jpg) repeat-x;
}
ul.section li a.active {
	background:#fff;
	cursor:default;
}
ul.section li.current > a.active,
ul.section li.current > a.active:hover {
	color:#fff;
	background:#666;
	cursor:default;
}


/* table
----------------------------------------------- */
.slideSwitch {
	width: 80px;
	height: 26px;
	background: #333;
	margin: 20px auto;

	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;
	position: relative;

	-webkit-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,0.2);
	-moz-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,0.2);
	box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,0.2);
}

.slideSwitch:after {
	content: 'OFF';
	font: 12px/26px Arial, sans-serif;
	color: #000;
	position: absolute;
	right: 10px;
	z-index: 0;
	font-weight: bold;
	text-shadow: 1px 1px 0px rgba(255,255,255,.15);
}

.slideSwitch:before {
	content: 'ON';
	font: 12px/26px Arial, sans-serif;
	color: #00bf00;
	position: absolute;
	left: 10px;
	z-index: 0;
	font-weight: bold;
}

.slideSwitch label {
	display: block;
	width: 34px;
	height: 20px;

	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;

	-webkit-transition: all .4s ease;
	-moz-transition: all .4s ease;
	-o-transition: all .4s ease;
	-ms-transition: all .4s ease;
	transition: all .4s ease;
	cursor: pointer;
	position: absolute;
	top: 3px;
	left: 3px;
	z-index: 1;

	-webkit-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.3);
	box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.3);
	background: #fcfff4;

	background: -webkit-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: -moz-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: -o-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: -ms-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfff4', endColorstr='#b3bead',GradientType=0 );
}

.slideSwitch input[type=checkbox]:checked + label {
	left: 43px;
}

table.form {
	width:100%;
}

table.form td {
	padding:1px 0px;
	font-weight:bold;
}
table.form label {
	font-weight:bold;
}

table.form .col1{width:40%;}
table.form .col2{}
table.form input, table.form select{
	padding: 4px 4px 5px 4px;
	border-top: 1px solid #b3b3b3;
	border-left: 1px solid #b3b3b3;
	border-right: 1px solid #eaeaea;
	border-bottom: 1px solid #eaeaea;

}
.noBorder {
	border: none !important;
}

input.mini{width: 30%;	}

input.Threedigit{width: 30px;	}
input.Fourdigit{width: 50px;	}

input.medium
{
	width: 55%;
}

input.large
{
	width: 85%;
}

input.date
{
	width: 180px;
}

input.button
{
	margin: 0;
	padding: 4px 8px 4px 8px;
	background: #D4D0C8;
	border-top: 1px solid #FFFFFF;
	border-left: 1px solid #FFFFFF;
	border-right: 1px solid #404040;
	border-bottom: 1px solid #404040;
	color: #000000;
}


input.error
{
	background: #FBE3E4;
	border-top: 1px solid #e1b2b3;
	border-left: 1px solid #e1b2b3;
	border-right: 1px solid #FBC2C4;
	border-bottom: 1px solid #FBC2C4;
}
textarea.error
{
	background: #FBE3E4;
	border-top: 1px solid #e1b2b3;
	border-left: 1px solid #e1b2b3;
	border-right: 1px solid #FBC2C4;
	border-bottom: 1px solid #FBC2C4;
}

select.error
{
	background: #FBE3E4;
	border-top: 1px solid #e1b2b3;
	border-left: 1px solid #e1b2b3;
	border-right: 1px solid #FBC2C4;
	border-bottom: 1px solid #FBC2C4;
}

 input.success
{
	background: #E6EFC2;
	border-top: 1px solid #cebb98;
	border-left: 1px solid #cebb98;
	border-right: 1px solid #c6d880;
	border-bottom: 1px solid #c6d880;
}

 input.warning
{
	background: #fff3b3;
	border-top: 1px solid #cebb98;
	border-left: 1px solid #cebb98;
	border-right: 1px solid #c6d880;
	border-bottom: 1px solid #c6d880;
}

 span.error
{
	margin: 8px 0 0 0;
	padding: 0;
	height: 1%;

	color: #FF0000;
}

span.success
{
	margin: 8px 0 0 0;
	padding: 0;
	height: 1%;

	color: #7b912b;
}

label.error
{
	margin: 8px 0 0 0;
	padding: 0;
	height: 1%;
	display: block;
	color: #FF0000;
}


/* site information
----------------------------------------------- */
#site_info {
	/*color:#fff;
	background:#263248;*/
	text-align: center;
	/*position: fixed;
	bottom: 0px;
	bottom:0px;*/
	width: 100%;
	height: 3em;
	/*background-color: rgba(38,50,72,.90);*//*rgba(0,0,0,.25);*/
	color: #fff;
	border-bottom: #FD9727 solid 5px;

}
#site_info_pad {
	height: 3em;
	width: 100%;
}

#site_info p{line-height:35px; margin-bottom:0px;}
#site_info a {
	color:#fff;
}
#site_info a:hover {
	color:#fff;
}

.wrap_hidden {
}
/* AJAX sliding shelf
----------------------------------------------- */
#loading {float:right; margin-right:14px; margin-top:-2px;}
.block {padding-bottom:1px; /* background-color:red; margin-left:-10px; padding-left:10px;*/}


/* Accordian
----------------------------------------------- */
.toggler {
	color: #222;
	margin: 0;
	padding: 2px 5px;
	background: #eee;
	border-bottom: 1px solid #ddd;
	border-right: 1px solid #ddd;
	border-top: 1px solid #f5f5f5;
	border-left: 1px solid #f5f5f5;
	font-size:1.1em;
	font-weight: normal;
}
.element h4 {
	margin: 0;
	padding:4px;
	line-height:1.2em;
}
.element p {
	margin: 0;
	padding: 4px;
}
.float-right {
	padding:10px 20px;
	float:right;
}

#accordian-block {
	padding-bottom:10px;
}


/* Mootools Kwicks
----------------------------------------------- */
#kwick-box {
	padding:0;
	overflow:hidden;
}
#kwick-box h2 {
	margin:0;
}
#kwick {
	position: relative;
}
#kwick .kwicks {
	display: block;
	background: #999;
	height: 120px;
	list-style:none;
	margin:0;
	overflow:hidden;
}
#kwick li {
	float: left;
	margin:0;
	padding:0;
}
#kwick .kwick {
	display: block;
	cursor: pointer;
	overflow: hidden;
	height: 100px;
	width: 215px;
	padding: 10px;
	background: #fff;
}
#kwick .kwick span {
	color:#fff;
}
#kwick .one {
	background: #666;
}
#kwick .two {
	background: #777;
}
#kwick .three {
	background: #888;
}
#kwick .four {
	background: #999;
}


.stat-col{float:left; margin:0px; margin-right:30px;}
.stat-col span{font-weight:bold; font-size:1.1em; font-family:AileronRegular, Helvetica Neue, Arial;}
.stat-col p{font-family:AileronRegular, Helvetica Neue, Arial; font-size:3em; color:#fff; font-weight:bold; text-shadow: 1px 1px 0px rgba(27, 27, 27, 0.4);; filter: dropshadow(color=#1b1b1b, offx=1, offy=1) /* IE */
	  -moz-border-radius: 4px; /* Firefox */
	  -webkit-border-radius: 4px; /* Safari, Chrome */
	  border-radius: 4px; /* CSS3 */
	  line-height:1.1em;
	  padding:4px 12px;
	  margin-bottom:10px;
	  margin-top:4px;
	  }


.stat-col p.purple{


  background-color: #47196e;
  background: -webkit-gradient(linear, left top, left bottom, from(#a072c7), to(#47196e));
  background: -webkit-linear-gradient(top, #a072c7, #47196e);
  background:    -moz-linear-gradient(top, #a072c7, #47196e);
  background:     -ms-linear-gradient(top, #a072c7, #47196e);
  backgroun:      -o-linear-gradient(top, #a072c7, #47196e);
  background:         linear-gradient(top, #a072c7, #47196e);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#a072c7', EndColorStr='#47196e');


}

.stat-col p.yellow{
	background-color:#ffb400;

  background-image: -webkit-gradient(linear, left top, left bottom, from(#ffc22e), to(#d19400));
  background-image: -webkit-linear-gradient(top, #ffc22e, #d19400);
  background-image:    -moz-linear-gradient(top, #ffc22e, #d19400);
  background-image:     -ms-linear-gradient(top, #ffc22e, #d19400);
  background-image:      -o-linear-gradient(top, #ffc22e, #d19400);
  background-image:         linear-gradient(top, #ffc22e, #d19400);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#ffc22e', EndColorStr='#d19400');

}
.stat-col p.darkblue{

	background-color: #163247;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#5d798e), to(#163247));
  background-image: -webkit-linear-gradient(top, #5d798e, #163247);
  background-image:    -moz-linear-gradient(top, #5d798e, #163247);
  background-image:     -ms-linear-gradient(top, #5d798e, #163247);
  background-image:      -o-linear-gradient(top, #5d798e, #163247);
  background-image:         linear-gradient(top, #5d798e, #163247);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#5d798e', EndColorStr='#163247');

}

.stat-col p.green{

  background-color: #5c8000;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#a3c747), to(#5c8000));
  background-image: -webkit-linear-gradient(top, #a3c747, #5c8000);
  background-image:    -moz-linear-gradient(top, #a3c747, #5c8000);
  background-image:     -ms-linear-gradient(top, #a3c747, #5c8000);
  background-image:      -o-linear-gradient(top, #a3c747, #5c8000);
  background-image:         linear-gradient(top, #a3c747, #5c8000);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#a3c747', EndColorStr='#5c8000');

}
.stat-col p.blue{

  background-color: #074676;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#4d8cbc), to(#074676));
  background-image: -webkit-linear-gradient(top, #4d8cbc, #074676);
  background-image:    -moz-linear-gradient(top, #4d8cbc, #074676);
  background-image:     -ms-linear-gradient(top, #4d8cbc, #074676);
  background-image:      -o-linear-gradient(top, #4d8cbc, #074676);
  background-image:         linear-gradient(top, #4d8cbc, #074676);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#4d8cbc', EndColorStr='#074676');

}
.stat-col p.red{

 background-color: #a40312;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#ea4958), to(#a40312));
  background-image: -webkit-linear-gradient(top, #ea4958, #a40312);
  background-image:    -moz-linear-gradient(top, #ea4958, #a40312);
  background-image:     -ms-linear-gradient(top, #ea4958, #a40312);
  background-image:      -o-linear-gradient(top, #ea4958, #a40312);
  background-image:         linear-gradient(top, #ea4958, #a40312);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#ea4958', EndColorStr='#a40312');

}

.stat-col.last{margin-right:0px;}



/* -----------------------------------------------------------
	images
----------------------------------------------------------- */

img.left
{
	margin: 10px 10px 10px 0;
	border: none;
	float: left;
}

img.right
{
	margin: 10px 0 10px 10px;
	border: none;
	float: right;
}

.fullpage{margin-left:0px;}


/* form */

.table-form{}



/* PrettyPhoto styling */




.prettygallery{ margin-top:10px; }
.prettygallery li{display:inline; padding:0px 70px 40px 10px; margin:0px;  float:left; }
.prettygallery img {

	box-shadow:0px 0px 5px #ccc;
	-moz-box-shadow:0px 0px 5px #ccc;
	-webkit-box-shadow:0px 0px 5px #ccc;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	padding:5px;
	background:#fff;

}





/* Data Tables */


/*.dataTables_info,
.dataTables_paginate { margin-bottom: 3em; } */

.dataTables_wrapper {
	position: relative;
	min-height: 50px;
	clear: both;
	_height: 50px;
	zoom: 1; /* Feeling sorry for IE */
}

.dataTables_processing {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 250px;
	height: 30px;
	margin-left: -125px;
	margin-top: -15px;
	padding: 14px 0 2px 0;
	border: 1px solid #ddd;
	text-align: center;
	color: #999;
	font-size: 14px;
	background-color: white;
}

.dataTables_length {
	width: 40%;
	float: left;
	margin-bottom: 1em;
}

.dataTables_filter {
	width: 35%;
	float: right;
	text-align: right;
	margin-bottom: 1em;
}

.dataTables_info {
	width: 60%;
	float: left;
	margin-top: 1em; 
}

.dataTables_paginate {

	float: right;
	text-align: right;
	margin-top: 1em; 
}

/* Pagination nested */
.paginate_disabled_previous, .paginate_enabled_previous, .paginate_disabled_next, .paginate_enabled_next {
	height: 19px;
	width: 19px;
	margin-left: 3px;
	float: left;
	cursor: pointer;
}

.paginate_disabled_previous {
	background-image: url(../img/table/back_disabled.png);
}

.paginate_enabled_previous {
	background-image: url(../img/table/back_enabled.png);
}

.paginate_disabled_next {
	background-image: url(../img/table/forward_disabled.png);
}

.paginate_enabled_next {
	background-image: url(../img/table/forward_enabled.png);
}



/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
 * DataTables display
 */
table.display {
	margin: 0 auto;
	clear: both;
	width: 100%;
	
	/* Note Firefox 3.5 and before have a bug with border-collapse
	 * ( https://bugzilla.mozilla.org/show%5Fbug.cgi?id=155955 ) 
	 * border-spacing: 0; is one possible option. Conditional-css.com is
	 * useful for this kind of thing
	 *
	 * Further note IE 6/7 has problems when calculating widths with border width.
	 * It subtracts one px relative to the other browsers from the first column, and
	 * adds one to the end...
	 *
	 * If you want that effect I'd suggest setting a border-top/left on th/td's and 
	 * then filling in the gaps with other borders.
	 */
}

table.display th{ /* background:#8f8f8f;   */ }



/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
 * DataTables sorting
 */


.sorting_asc {
	background: #8f8f8f url(../img/table/sort_asc.png) no-repeat center right; padding:8px 5px; text-align:left;
}

.sorting_desc {
	background: #8f8f8f url(../img/table/sort_desc.png) no-repeat center right; padding:8px 5px; text-align:left;
}

.sorting {
	background:#8f8f8f   url(../img/table/sort_both.png) no-repeat center right; padding:8px 5px; text-align:left; 
}

.sorting_asc_disabled {
	background: #8f8f8f url(../img/table/sort_asc_disabled.png) no-repeat center right; padding:8px 5px; text-align:left;
}

.sorting_desc_disabled {
	background: #8f8f8f url(../img/table/sort_desc_disabled.png) no-repeat center right; padding:8px 5px; text-align:left;
}




tr.odd {
	  height: 30px;
line-height: 30px; border-bottom:1px solid #e6e6e6; 
}

tr.even {
	 height: 30px;
line-height: 30px; border-bottom:1px solid #e6e6e6;
}
tr.odd:hover, tr.even:hover { background:#f6f6f6; }
tr.odd td, tr.even td{ padding-left:5px; }



.clear {
	clear: both;
}

.dataTables_empty {
	text-align: center;
}

tfoot { display: none; }
tfoot input {
	margin: 0.5em 0;
	width: 100%;
	color: #444;
}

tfoot input.search_init {
	color: #999;
}

td.group {
	background-color: #d1cfd0;
	border-bottom: 2px solid #A19B9E;
	border-top: 2px solid #A19B9E; 
}

td.details {
	background-color: #d1cfd0;
	border: 2px solid #A19B9E;
}


.example_alt_pagination div.dataTables_info {
	width: 40%;
}

.paging_full_numbers {
	width: 400px;
	height: 22px;
	line-height: 22px;
}

.paging_full_numbers span.paginate_button,
 	.paging_full_numbers span.paginate_active {
	border: 1px solid #aaa;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	padding: 2px 5px;
	margin: 0 3px;
	cursor: pointer;
	*cursor: hand;
}

.paging_full_numbers span.paginate_button {
	background-color: #ddd;
}

.paging_full_numbers span.paginate_button:hover {
	background-color: #ccc;
}

.paging_full_numbers span.paginate_active {
	background-color: #FD9727;
}



/* Buttons */

.btn,
.btn-icon,
.btn-mini
{
	background-repeat: repeat-x;
	color: #FFF;
	font-weight: bold;
	display: inline-block;
	text-decoration: none;
	border-width: 0px;
	border-style: solid;
	padding: 4px 16px 4px 16px;
	margin: 0;
	/*text-shadow: 1px 1px 1px rgba(0,0,0,.2);
	-moz-box-shadow: 1px 1px 1px rgba(0,0,0,.25);
	-webkit-box-shadow: 1px 1px 1px rgba(0,0,0,.25);*/
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	/*filter: progid:DXImageTransform.Microsoft.Shadow(color=#999999,direction=135,strength=2);*/
	cursor: pointer;
	position: relative;
}

	/* Active/Click state */
	/*.btn:active, .btn-icon:active, .btn-mini:active { top: 1px; }*/


/* Sizes */
/*.btn, .btn-icon { background-position: 0 -80px; font-size: 12px; height: 32px; line-height: 29px; }*/
.btn.btn-small, .btn-icon.btn-small { background-position: 0 0; font-size: 12px; height: 26px; line-height: 23px; }
.btn.btn-large, .btn-icon.btn-large { background-position: 0 -160px; font-size: 15px; height: 42px; line-height: 40px; }

	/* Sizes - Line height for A buttons need to be different */
	a.btn, a.btn-icon { height: 32px; line-height: 32px; padding-bottom: 0; }
	a.btn.btn-small, a.btn-icon.btn-small { line-height: 26px; padding-bottom: 0; }
	a.btn.btn-large, a.btn-icon.btn-large { line-height: 42px; padding-bottom: 0; }

/* Fix the button in IE7 :-( */
*+html .btn, *+html .btn-icon { border-color: none ; border: 1px solid transparent; }



/* Set default button colors */
/*.btn, .btn-icon, .btn-mini,
.btn:visited, .btn-icon:visited, .btn-mini:visited {  background-image: url(../img/bg-lite.png); background-color: #F90; border-color: #D58000; color: #FFF; }*/

.btn:hover, .btn-icon:hover, .btn-mini:hover { background-color: #D58000; color: #FFF; }


/* Colors */
.btn-pink,
.btn-pink:visited { background-color: #FF0066; border-color: #DA0C59; }
.btn-pink:hover { background-color: #DA0C59; }

.btn-blue,
.btn-blue:visited { background-color: #DDD; border-color: #DDD; color:#7C7B8B; }
.btn-blue:hover { background-color: #FD9727; color:#fff; }

.btn-red,
.btn-red:visited { background-color: #E40001; border-color: #CC0000; }
.btn-red:hover { background-color: #CC0000; }

.btn-green,
.btn-green:visited { background-color: #77B32F; border-color: #689C29; }
.btn-green:hover { background-color: #689C29; }

.btn-black,
.btn-black:visited { background-color: #111; border-color: #000; }
.btn-black:hover { background-color: #000; }

.btn-purple,
.btn-purple:visited { background-color: #7B0F75; border-color: #6A0D66; }
.btn-purple:hover { background-color: #6A0D66; }

.btn-navy,
.btn-navy:visited { background-color: #002142; border-color: #00172F; }
.btn-navy:hover { background-color: #00172F; }

.btn-maroon,
.btn-maroon:visited { background-color: #750000; border-color: #530000; }
.btn-maroon:hover { background-color: #530000; }

.btn-yellow,
.btn-yellow:visited { background-color: #FFCC00; border-color: #D9AD01; }
.btn-yellow:hover { background-color: #D9AD01; }

.btn-teal,
.btn-teal:visited { background-color: #39A7B6; border-color: #2E8794; }
.btn-teal:hover { background-color: #2E8794; }

.btn-orange,
.btn-orange:visited { background-color: #F90; border-color: #D58000; color: #FFF; }
.btn-orange:hover{ background-color: #D58000; color: #FFF; }

.btn-grey,
.btn-grey:visited  { background-color: #999; border-color: #888; color: #FFF; }
.btn-grey:hover{ background-color: #888; color: #FFF; }


/* Images Overlays - Gradient Effect */
/* 50% Opacity for darker colors */
/*.btn-blue,
.btn-black,
.btn-purple,
.btn-navy,
.btn-maroon,
.btn-teal,
.btn-grey { background-image: url(../img/bg-dark.png) !important; }*/


/* 65% opacity for lighter colors */
/*.btn-red,
.btn-orange,
.btn-green,
.btn-yellow,
.btn-pink { background-image: url(../img/bg-lite.png) !important; }/*



/* Icon Button Styles */
/*.btn-icon { padding-left: 32px !important; }*/
/**+html .btn-icon { padding-left: 20px !important; padding-right: 5px !important; }*/

/*.btn-icon span
{
	background-image: url(../img/btn-icons.png);
	background-repeat: no-repeat;
	background-position: 0 0;
	width: 16px;
	height: 16px;
	position: absolute;
	left: 6px;
	top: 6px;
}*/

	.btn-icon.btn-small span { top: 4px; }
	.btn-icon.btn-large span { top: 12px; }
	@-moz-document url-prefix() { .btn-icon span { left: -24px; top: 0px; } .btn-icon.btn-small span { top: -1px; } .btn-icon.btn-large span { top: 4px; } }


.btn.btn-xsmall, .btn-icon.btn-small { background-position: 0 0; font-size: 12px; line-height: 18px; }
/* Mini Buttons */
.btn-mini
{
	background-position: 0 0;
	width: 32px;
	height: 26px !important;
	line-height: 500px !important;
	overflow: hidden;
	padding: 0;
}

	.btn-mini span
	{
		background-image: url(../img/btn-icons.png);
		background-repeat: no-repeat;
		display: block;
		width: 16px;
		height: 16px;
		line-height: 0;
		position: absolute;
		left: 50%;
		top: 50%;
		margin-left: -8px;
		margin-top: -8px;
	}


/* Icon Classes */
.btn-arrow-down span { background-position: -48px 0; }
.btn-arrow-up span { background-position: -32px 0; }
.btn-arrow-right span { background-position: -16px 0; }
.btn-arrow-left span { background-position: 0 0; }
.btn-comment span { background-position: -112px 0; }
.btn-heart span { background-position: -96px 0; }
.btn-star span { background-position: -80px 0; }
.btn-cart span { background-position: -64px 0; }
.btn-print span { background-position: -128px 0; }
.btn-rss span { background-position: -144px 0; }
.btn-person span { background-position: 0 -16px; }
.btn-check span { background-position: -16px -16px; }
.btn-dollar span { background-position: -32px -16px; }
.btn-refresh span { background-position: -48px -16px; }
.btn-home span { background-position: -64px -16px; }
.btn-plus span { background-position: -80px -16px; }
.btn-minus span { background-position: -96px -16px; }
.btn-cross span { background-position: -112px -16px; }


/* Transparent Button Styles */
/*.btn-transparent, .btn-transparent:hover { background-image: url(../img/bg-lite.png); background-color: transparent; filter: none; border-color: transparent\0/; border-color: rgba(0,0,0,.4) !important; margin: 0 1em 0 0; }
*+html .btn-transparent { border: none; }*/


/*  Notifications */

.message {
    padding: 10px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -khtml-border-radius: 5px;
    border-radius: 5px;
    margin-bottom: 10px;
    -moz-box-shadow:inset 0 1px 0 rgba(255,255,255,0.5);
    -webkit-box-shadow:inset 0 1px 0 rgba(255,255,255,0.5);
    box-shadow:inset 0 1px 0 rgba(255,255,255,0.5);
}
    .message h3 {
        margin-top: 0;
    }
    .message p {
        margin-bottom: 0;
    }

.message.info {
    border: 1px solid #cadcea;
    background: #e1f2fc;
    background: -webkit-gradient(linear, left top, left bottom, from(#e1f2fc), to(#cae9fd));
    background: -moz-linear-gradient(top,  #e1f2fc,  #cae9fd);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#e1f2fc', endColorstr='#cae9fd');
    color: #225b86;
    text-shadow: 0 1px 0 #fff;
}

.message.error {
    border: 1px solid #eeb7ba;
    background: #fae2e2;
    background: -webkit-gradient(linear, left top, left bottom, from(#fae2e2), to(#f2cacb));
    background: -moz-linear-gradient(top,  #fae2e2,  #f2cacb);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#fae2e2', endColorstr='#f2cacb');
    color: #be4741;
    text-shadow: 0 1px 0 #fff;
}

.message.success {
    border: 1px solid #b8c97b;
    background: #e5edc4;
    background: -webkit-gradient(linear, left top, left bottom, from(#e5edc4), to(#d9e4ac));
    background: -moz-linear-gradient(top,  #e5edc4,  #d9e4ac);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#e5edc4', endColorstr='#d9e4ac');
    color: #3f7227;
    text-shadow: 0 1px 0 #fff;
}

.message.warning {
    border: 1px solid #e5dbaa;
    background: #ffffc0;
    background: -webkit-gradient(linear, left top, left bottom, from(#ffffc0), to(#f9ee9c));
    background: -moz-linear-gradient(top,  #ffffc0,  #f9ee9c);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffc0', endColorstr='#f9ee9c');
    color: #6d7829;
    text-shadow: 0 1px 0 #fff;
}

.gallery-sand .sorting{background-color:white !important;}


/* accordian div */
div.collapsed {
	max-height: 0!important;
	overflow: hidden;
}

/* Device Listing */
div.device {
	cursor: pointer;
	float: left;
	width: 16.66%;
	box-sizing: border-box;
	border-radius: 8px;
	margin: 10px;
	padding: 8px;
	background-color: rgba(253,151,39,.90);/*rgba(253, 151, 39, .75);*/
	color: #ffffff;
}
div.device span.device_name  {
	margin-top: 4px;
	display: block;
	/*float: left;
	width: 50%;*/
	margin: 0;
	height: initial;
	box-sizing: border-box;
	overflow: hidden;
	height: 1.5em;
}
div.device span.device_status {
	margin-top: 4px;
	display: block;
	float: left;
	width: 50%;
	margin: 0;
	height: initial;
	box-sizing: content-box;
	overflow: hidden;
	height: 1.5em;
}
div.device span.device_status {
	font-weight:normal;
	float: left;
	border-radius: 8px;
	text-align: center;
	padding: 4px 16px 4px 16px;
	line-height: 18px;
    font-size: 12px;
}
div.device span.device_status.unregistered {
	background-color: red;
	color: #fff;
}
div.device span.device_status.registered {
	background-color: green;
	color: #fff;
}
div.device_stats {
	float: none;
	width: 100%;
	box-sizing: border-box;
	height: 4em;
    text-align: center;
}
div.device_options {
	position: relative;
	float: none;
	width: 100%;
	height: 1.5em;
}
div.device_options button {
	float: right;
	/*position: absolute;
    bottom: 0px;
    right: 0px;*/
}
/* did listing */



div.device_stat_bar span.device_status {
	margin-top: 4px;
	display: block;
	float: left;
	margin: 0;
	height: initial;
	box-sizing: content-box;
	overflow: hidden;
	height: 1.5em;
}
div.device_stat_bar span.device_status {
	font-weight:normal;
	float: left;
	border-radius: 8px;
	text-align: center;
	padding: 4px 16px 4px 16px;
	line-height: 18px;
    font-size: 12px;
}
div.device_stat_bar span.device_status.unregistered {
	background-color: red;
	color: #fff;
}
div.device_stat_bar span.device_status.registered {
	background-color: green;
	color: #fff;
}


div.device_pane_left {
	width: 25%;
	text-align: center;
	float: left;
}
div.device_pane_right {
	width: 75%;
	float: left;
}
div.sch_detail {
	float: none;
	cursor: pointer;
	box-sizing: border-box;
	border-radius: 8px;
	margin: 10px;
	padding: 8px;
	background-color: rgba(253,151,39,.90);/*rgba(253, 151, 39, .75);*/
	color: #ffffff;
	clear: both;
}
div.sch_detail label {
	color: #fff;
}
div.misc_purchase {
	float: none;
	cursor: pointer;
	box-sizing: border-box;
	border-radius: 8px;
	margin: 10px;
	padding: 8px;
	background-color: rgba(253,151,39,.90);/*rgba(253, 151, 39, .75);*/
	color: #ffffff;
	clear: both;
}
div.misc_purchase label {
	color: #fff;
}
div.did {
	float: none;
	cursor: pointer;
	box-sizing: border-box;
	border-radius: 8px;
	margin: 10px;
	padding: 8px;
	background-color: rgba(253,151,39,.90);/*rgba(253, 151, 39, .75);*/
	color: #ffffff;
	clear: both;
}
div.did label {
	color: #fff;
}
div.add_did label {
	color: #fff;
}
div.pv {
	float: none;
	cursor: pointer;
	box-sizing: border-box;
	border-radius: 8px;
	margin: 10px;
	padding: 8px;
	background-color: rgba(253,151,39,.90);/*rgba(253, 151, 39, .75);*/
	color: #ffffff;
	clear: both;
}
div.pv label {
	color: #fff;
}
div.route {
	float: none;
	cursor: pointer;
	box-sizing: border-box;
	border-radius: 8px;
	margin: 10px;
	padding: 8px;
	background-color: rgba(253,151,39,.90);/*rgba(253, 151, 39, .75);*/
	color: #ffffff;
	clear: both;
}
div.route label {
	color: #fff;
}
div.add_route label {
	color: #fff;
}

/* Questionnaire Extension Listing */

/* did listing */

div.q_ext {
	float: none;
	cursor: pointer;
	box-sizing: border-box;
	border-radius: 8px;
	margin: 10px;
	padding: 8px;
	background-color: rgba(253,151,39,.90);/*rgba(253, 151, 39, .75);*/
	color: #ffffff;
	clear: both;
}
div.q_ext label {
	color: #fff;
}
div.q_ext_did label {
	color: #fff;
}

/* Notifications */

div.reprovision_notice {
	float: none;
	cursor: default;
	box-sizing: border-box;
	border-radius: 8px;
	background-color: rgba(253,151,39,.90);/*rgba(253, 151, 39, .75);*/
	color: #ffffff;
	clear: both;
    padding: 8px 20px;
}
div.reprovision_notice label {
	color: #fff;
}

/* Note listing */

div.note {
	float: none;
	cursor: pointer;
	box-sizing: border-box;
	border-radius: 8px;
	margin: 10px;
	padding: 8px;
	background-color: rgba(253,151,39,.90);/*rgba(253, 151, 39, .75);*/
	color: #ffffff;
	clear: both;
}
div.note label {
	color: #fff;
}
div.add_note label {
	color: #fff;
}


/* followme listing */

div.followme {
	float: none;
	cursor: pointer;
	box-sizing: border-box;
	border-radius: 8px;
	margin: 10px;
	padding: 8px;
	background-color: rgba(253,151,39,.90);/*rgba(253, 151, 39, .75);*/
	color: #ffffff;
	clear: both;
}
div.followme label {
	color: #fff;
}
div.add_followme label {
	color: #fff;
}
/* device model listing */

div.modelPicker {
	float: none;
	cursor: pointer;
	box-sizing: border-box;
	border-radius: 8px;
	margin: 10px;
	padding: 8px;
	background-color: rgba(253,151,39,.90);/*rgba(253, 151, 39, .75);*/
	color: #ffffff;
	clear: both;
}
/*div.inputdiv.modelPicker  > ul > li {
	display: block;
	float: none;
}*/
div.modelPicker label {
	color: #fff;
}
div.modelPicker .group_title {
	font-weight: bold;
	font-size: 2em;
}

#plan_desc {
	font-size: 12px;
	line-height: 16px;
	padding-left: 10px;
	padding-right: 10px;
}
#plan_price {
	font-size: 28px;
	font-weight: bold;
	text-align:right;
	padding-left: 10px;
	padding-right: 10px;
}
#plan_volume_price {
	padding-bottom: 20px;
}
#plan_volume_price .vp_left {
	font-size: 14px;
	float: left;
	width: 50%;
	text-align: right;
	box-sizing:border-box;
	padding-right: 10px;
	font-weight: bold;
}
#plan_volume_price .vp_right {
	font-size: 14px;
	float: left;
	width: 50%;
}
#plan_volume_price .vp_right .small {
	font-size: 10px;
	height: initial;
	
}


/* extension type picker */

div.extTypePicker {
	float: none;
	cursor: pointer;
	box-sizing: border-box;
	border-radius: 8px;
	margin: 10px;
	padding: 8px;
	background-color: rgba(253,151,39,.90);/*rgba(253, 151, 39, .75);*/
	color: #ffffff;
	clear: both;
}
div.extTypePicker label {
	color: #fff;
}
div.extTypePicker .group_title {
	font-weight: bold;
	font-size: 2em;
}
div.extTypePicker ul.thumbnails.image_picker_selector li {
	width: 33.3%;
	box-sizing: border-box;
	margin-left: 0%;
	margin-right: 0%;
	position: relative;
}

div.extTypePicker ul.thumbnails.image_picker_selector li:hover .tipText {
	visibility: visible;
}
div.extTypePicker ul.thumbnails.image_picker_selector li .thumbnail {
	border: none;
	/*text-align: center;*/
	height: 65px;
    border-radius: 8px;
}
div.extTypePicker ul.thumbnails.image_picker_selector li .thumbnail.selected {
}
div.extTypePicker ul.thumbnails.image_picker_selector li .thumbnail p {
	display: block;
	box-sizing: border-box;
	padding: 10px;
	width: calc(100% - 100px);
	float: left;
}
div.extTypePicker .toolTip {
	color: initial;
	border: none;
	position: static;
}
div.extTypePicker .toolTip .tipText {
	width: 85%;
	margin:5%;
	bottom: 0px;
	left: 0px;
    border: 2px solid white;
}
/* Notification listing */

div.notify  {
	float: none;
	box-sizing: border-box;
	border-radius: 8px;
	margin: 10px;
	padding: 8px;
	background-color: rgba(253,151,39,.90);/*rgba(253, 151, 39, .75);*/
	color: #ffffff;
	clear: both;
}
div.notify label {
	color: #fff;
}

div.detail {
	float: none;
	box-sizing: border-box;
	margin: 0px;
	padding: 4px;
	background-color: #fff;/*rgba(253, 151, 39, .75);*/
	color: #000;
	clear: both;
	border-right: 1px solid black;
	border-left: 1px solid black;
	border-bottom: 1px solid black;
}
div.detail_alt:nth-child(odd) { background-color: #ffffff; }
div.detail_alt:nth-child(even) { background-color: #efefef; }
div.detail label {
	color: #000;
	display: none;
}
div.detail_header {
	float: none;
	box-sizing: border-box;
	margin: 0px;
	padding: 4px;
	background-color: none;/*rgba(253, 151, 39, .75);*/
	color: #000;
	clear: both;
	border-bottom: 1px solid black;
	
}
div.detail_header .field {
	padding-bottom: 0px!important;
}
div.detail_header label {
	color: #000;
	height: initial;
	font-size: 13px;
}
div.detail_header .field span {
	color: #000;
	display: none!important;
}
div.detail_totals {
	float: none;
	box-sizing: border-box;
	margin: 0px;
	padding: 0px;
	background-color: none;/*rgba(253, 151, 39, .75);*/
	color: #000;
	clear: both;
	position: relative;
}
div.detail_totals .field  {
	float: right;
	clear:both;
	padding-bottom: 0px!important;
	position:relative;
	right: 0px;
	text-align:right
}
div.detail_totals .field span {
	float: left;
	width: calc(50% - 18px);
	padding: 4px;
	background-color: #fff;
	border-right: 1px solid black;
	border-left: 1px solid black;
	border-bottom: 1px solid black;
	height: initial;
}
div.detail_totals .field label {
	float: left;
	padding: 4px;
	width: 50%;
	text-align:right;
	
}
.align_right { text-align: right; }
div.detail_totals .field.halfField {
	margin-left: 50%;
}
/* Queue Member Listing */
div.member, div.queue_member {
	float: none;
	box-sizing: border-box;
	border-radius: 8px;
	margin: 10px;
	padding: 8px;
	background-color: rgba(253,151,39,.90);/*rgba(253, 151, 39, .75);*/
	color: #ffffff;
	clear: both;
	
}
div.member, div.queue_member label {
	color: #fff;
}

/* Sub Device Listing */
div.sub {
	float: none;
	box-sizing: border-box;
	border-radius: 8px;
	margin: 10px;
	padding: 8px;
	background-color: rgba(253,151,39,.90);/*rgba(253, 151, 39, .75);*/
	color: #ffffff;
	clear: both;
	
}
div.sub label {
	color: #fff;
}

/* Fax Listing */
div.fax {
	cursor: pointer;
	float: left;
	width: calc(25% - 20px);
	box-sizing: border-box;
	border-radius: 8px;
	margin: 10px;
	padding: 8px;
	background-color: rgba(253,151,39,.90);/*rgba(253, 151, 39, .75);*/
	color: #ffffff;
}
div.faxrow {
	cursor: pointer;
	width: calc(25% - 20px);
	height: 86px;
	float: left;
	box-sizing: border-box;
	border-radius: 8px;
	margin: 10px;
	padding: 8px;
	background-color: rgba(253,151,39,.90);/*rgba(253, 151, 39, .75);*/
	color: #ffffff;
}
div.faxrow .fax_img {
	float: left;
	width: 50px;
}
div.faxrow span.fax_name, div.faxrow span.fax_status {
	margin-top: 4px;
	margin: 0;
	height: initial;
	box-sizing: border-box;
	color: #fff;
	padding-left: 60px;
	margin-bottom: 10px;
	display: block;
}
div.fax span.fax_name, div.fax span.fax_status {
	margin-top: 4px;
	display: block;
	/*float: left;
	width: 50%;*/
	margin: 0;
	height: initial;
	box-sizing: border-box;
	text-align: center;
	color: #fff;
}
div.fax span.fax_status {
	font-weight:normal;
	border-radius: 8px;
}
div.fax span.fax_status.unregistered {
	background-color: red;
	color: #fff;
}
div.fax span.fax_status.registered {
	background-color: green;
	color: #fff;
}
/* Signup Stuff */
.productItem {
	float: left;
	width: 50%;
	padding: 10px;
	height: 150px;
	position: relative;
}
.productImage {
	float: left;
	width: 50%;
}
.productDesc {
	float: left;
	width:50%;
	text-align: left;
	height: 100px;
}
.productPrice {
	float: left;
	text-align: right;
	width:50%;
	height: 50px;
}
.productPrice .price {
	font-weight: bold;
	font-size: 14px;
}


.did_e911, .did_cid {
	opacity: 0.25;
    filter: alpha(opacity=25);
}
.did_e911:hover, .did_cid:hover {
	opacity: 1;
    filter: alpha(opacity=100);
	background-color: green;
}
.did_e911.selected, .did_cid.selected {
	opacity: 1;
    filter: alpha(opacity=100);
	background-color: green;
	color: #fff;
}
.did_e911.selected:hover, .did_cid.selected:hover {
	background-color: green;
	color: #fff;
}

.msgBox {
	width: 400px;
	text-align:center;
	margin-left: auto;
	margin-right: auto;
	cursor: default;
	box-sizing: border-box;
	border-radius: 8px;
	padding: 8px;
	background-color: rgba(253,151,39,.90);/*rgba(253, 151, 39, .75);*/
	color: #ffffff;
	font-size: 1.25em;
}
.msgBox h2 {
	color: #ffffff;
}
/* Spinner */
#spinner_screenlock, #spinner_screenlock_account_context, #spinner_screenlock_popup, #spinner_screenlock_orders{
	display: none;
	position: fixed;
	top: 0px;
	left: 0px;
	height: 100%;
	width: 100%;
	box-sizing:border-box;
	cursor: wait;
	z-index: 10000;
}
#spinner, #spinner2, #spinner3, #spinnerOrders {
	display: none;
	height: 100%;
	width: 100%;
	padding-top: 300px;
	background-color: rgba(255,255,255,.5);
	backdrop-filter: blur(2px);
	-webkit-backdrop-filter: blur(2px);
}
#spinner3 {
	padding-top: 100px;
}
.bubblingG {
	text-align: center;
	width:78px;
	height:49px;
	margin: auto;
}

.bubblingG span {
	display: inline-block;
	vertical-align: middle;
	width: 10px;
	height: 10px;
	margin: 24px auto;
	background: rgba(253,151,39,1);
	border-radius: 49px;
		-o-border-radius: 49px;
		-ms-border-radius: 49px;
		-webkit-border-radius: 49px;
		-moz-border-radius: 49px;
	animation: bubblingG 1.5s infinite alternate;
		-o-animation: bubblingG 1.5s infinite alternate;
		-ms-animation: bubblingG 1.5s infinite alternate;
		-webkit-animation: bubblingG 1.5s infinite alternate;
		-moz-animation: bubblingG 1.5s infinite alternate;
}

#bubblingG_1 {
	animation-delay: 0s;
		-o-animation-delay: 0s;
		-ms-animation-delay: 0s;
		-webkit-animation-delay: 0s;
		-moz-animation-delay: 0s;
}

#bubblingG_2 {
	animation-delay: 0.45s;
		-o-animation-delay: 0.45s;
		-ms-animation-delay: 0.45s;
		-webkit-animation-delay: 0.45s;
		-moz-animation-delay: 0.45s;
}

#bubblingG_3 {
	animation-delay: 0.9s;
		-o-animation-delay: 0.9s;
		-ms-animation-delay: 0.9s;
		-webkit-animation-delay: 0.9s;
		-moz-animation-delay: 0.9s;
}



@keyframes bubblingG {
	0% {
		width: 10px;
		height: 10px;
		background-color:rgba(253,151,39,0);
		transform: translateY(0);
	}

	100% {
		width: 23px;
		height: 23px;
		background-color:rgba(253,151,39,1);
		transform: translateY(-20px);
	}
}

@-o-keyframes bubblingG {
	0% {
		width: 10px;
		height: 10px;
		background-color:rgba(253,151,39,0);
		-o-transform: translateY(0);
	}

	100% {
		width: 23px;
		height: 23px;
		background-color:rgba(253,151,39,1);
		-o-transform: translateY(-20px);
	}
}

@-ms-keyframes bubblingG {
	0% {
		width: 10px;
		height: 10px;
		background-color:rgba(253,151,39,0);
		-ms-transform: translateY(0);
	}

	100% {
		width: 23px;
		height: 23px;
		background-color:rgba(253,151,39,1);
		-ms-transform: translateY(-20px);
	}
}

@-webkit-keyframes bubblingG {
	0% {
		width: 10px;
		height: 10px;
		background-color:rgba(253,151,39,0);
		-webkit-transform: translateY(0);
	}

	100% {
		width: 23px;
		height: 23px;
		background-color:rgba(253,151,39,1);
		-webkit-transform: translateY(-20px);
	}
}

@-moz-keyframes bubblingG {
	0% {
		width: 10px;
		height: 10px;
		background-color:rgba(253,151,39,0);
		-moz-transform: translateY(0);
	}

	100% {
		width: 23px;
		height: 23px;
		background-color:rgba(253,151,39,1);
		-moz-transform: translateY(-20px);
	}
}

.halfField .intl-tel-input input {
	width: calc(100% - 14px)!important;
}.intl-tel-input input {
	width: calc(100% - 54px)!important;
}

.followme .intl-tel-input input {
	width: calc(100% - 54px)!important;
}
/* Media Queries and etc */

.ext_details_subpanel_left {
	float:right;width:66%
}
.ext_details_subpanel_right {
	float:right;width:34%
}

@media only screen and (max-width: 1330px) {
	#branding {
		max-width:1000px;
	}
	
	div.device {
		width: 20%;
	}
}
@media all and (max-width:60.000em) {
	.header_pad { height: 5.6em; }
	.container_12, .container_16 {
		width: 90%;
	}
	div.form label {
		font-size: 0.75em;
	}
	div.form div.field, div.form div.field.halfField {
		float: left;
		width: 50%;
		padding-bottom: 10px;
	}

	div.form div.field.smallField {
		float: left;
		width: 25%;
		padding-bottom: 10px;
	}
	
	div.form div.field.audioField {
		float: left;
		width: 100%;
	}
	
	div.device {
		width: 45%;
	}
	.toolTip {
	/*	margin-left: 5px;
		position:relative;
		display: inline-block;
		cursor: pointer;
		border-bottom: 1px solid #FD9727;
		color: #FD9727;*/
	}
	.toolTip .tipText {
		width: 300px;
	}
	#spinner3 {
	}
	#spinner3 .bubblingG { display: none; }
	#spinner3 .msgBox {
		width:100%;
		height:100%;
		position: absolute;
		top: 0px;
		overflow-y: scroll;
	}
	div.extTypePicker ul.thumbnails.image_picker_selector li {
		width: 50%;
	}
}

@media all and (max-width:46.000em) {
	div.questionnaire .productItem {
		width: 50%;
	}
	div.extTypePicker ul.thumbnails.image_picker_selector li {
		width: 100%;
	}
	
.ext_details_subpanel_left {
	float:left;width:100%;
}
.ext_details_subpanel_right {
	float:left;width:100%;
}
}
@media all and (max-width:36.000em) {
	
	div.acctsearch {
		border-radius: 8px 8px 0px 0px;
		width: 100%;
		
		background-position: 93% 3px;
	}
	
	div.acctsearch div.acctlist {
		width: 100%;
		max-height: 300px;
	}
	div.questionnaire .productItem {
		width: 100%;
	}
	.toolTip {
		position:static;
		padding: 1px 12px 1px 12px;
		border-radius: 8px;
		background-color:#FD9727;
		color: #ffffff;
	}
	.toolTip .tipText {
		width: 20em;
		position: absolute;
		left: 1em;
	}
	.floatleft, .floatright {
		float: none;
	}
	.box { padding-right: 2px; }
	
	div.form div.field, div.form div.field.halfField {
		float: left;
		width: 100%;
		padding-bottom: 10px;
	}
	

	div.form div.field.smallField {
		float: left;
		width: 50%;
		padding-bottom: 10px;
	}
	

	div.form div.field.audioField .sel_method {
		width: 100%;
	}

	div.form div.field.audioField .audioField_view {
		width: 100%;
	}

	div.form div.field.audioField audio {
		width: 100%;
	}
	div.form div.field.audioField .record_status {
		width: 100%;
	}

	div.form div.field.audioField .record_buttons {
		width: 100%;
	}
	
	div.device {
		float: none;
		width: initial;
	}
	div.extTypePicker .toolTip { background: none; }
}
.section-bg {
  background-size: cover;
  background-position: center 0px;
  background-attachment: fixed;
  background-repeat:no-repeat;
  position: absolute;
  width: 100%;
  box-sizing: border-box;
}
.panel {
	background-color: #fff;
    background-color: rgba(255,255,255,0.65);
	margin: 20px auto;
	position: relative;
	padding: 20px;
	border-radius: 8px;
	margin-bottom: 0px;
	/*
		Filter has been implemented using ::before method,
		more resource intensive, but works on more browsers
		currently

		backdrop-filter: blur(2px);
	-webkit-backdrop-filter: blur(2px);*/
}
.panel::before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  filter: blur(4px);
  z-index: -1;
}
.container_12::after {
	/* exists to prevent weird margin calculations */
	content: '';
	height: 4em;
	display:block;
}
.faded {
	opacity: 0.25;
	cursor:arrow;
}
.hideme { display: none!important; }
html{
 height:100%;
 min-height:100%;
 }
body{
 min-height:100%;
 }
 
table.dataTable tr.odd { background-color: rgb(245,245,245); }
table.dataTable tr.even { background-color: rgb(230,230,230); }

table.dataTable tr.odd:hover, table.dataTable tr.even:hover { cursor:pointer; background-color: rgba(253,151,39,.90) !important; color: #ffffff; }
table.dataTable tr.odd:hover .sorting_1, table.dataTable tr.even:hover .sorting_1 { background: none; }
table.dataTable tr.odd td.sorting_1 { background-color: rgb(245,245,245);/*DDE7F6;*/ }
table.dataTable tr.odd td.sorting_2 { background-color: rgb(240,240,240);/*DADCFF;*/ }
table.dataTable tr.odd td.sorting_3 { background-color: rgb(235,235,235);/*E0E2FF;*/ }
table.dataTable tr.even td.sorting_1 { background-color: rgb(230,230,230);/*E9F2FF;*/ }
table.dataTable tr.even td.sorting_2 { background-color: rgb(225,225,225);/*F2F3FF;*/ }
table.dataTable tr.even td.sorting_3 { background-color: rgb(220,220,220);/*F9F9FF;*/ }
table.dataTable tr.row_selected td { background-color: #FD9727 !important; color: #ffffff; }
 
 
 
 
@media only screen and (min-width: 1903px) {
	.section-bg, .panel::before {
		background-image: url("/images/img/3430/1189");
		background-attachment: fixed;
		background-size: cover;
		background-position: center 0px;
	  
	}
}
@media only screen and (max-width: 1903px) {
	.section-bg, .panel::before {
		background-image: url("/images/img/1903/1189");
		background-attachment: fixed;
		background-size: cover;
		background-position: center 0px;
	}
}
@media only screen and (max-width: 1366px) {
	.section-bg, .panel::before {
		background-image: url("/images/img/1366/1189");
		background-attachment: fixed;
		background-size: cover;
		background-position: center 0px;
	}
}
@media only screen and (max-width: 880px) {
	.section-bg, .panel::before {
		background-position-y: 50px;
		background-image: url("/images/img/880/1189");
		background-position: -200px 0px;
		background-size: fill;
		background-attachment: fixed;
		/*background-size: cover;*/
	}
}
.dataTables_filter input { width: initial!important; }

/* Additional Input Types
 */
.selectExtType {
	width: 250px;
	height: 60px;
}
/*Taining Module*/
.sequenceNo 
{
    display:inline-block;
    width: 50px;
    height: 50px;
    -moz-border-radius: 50px;
    -webkit-border-radius: 50px;
    border-radius: 50px;
    font-size: 25px;
    color: #fff;
    line-height: 50px;
    text-align: center;
    background: #FD9727;
    margin-left: -50px;
}
#trainingDiv{
    border-top:none!important;
    position:absolute!important; /*Channges for training DIv*/
    opacity:0.9;
    background-color: white;
}
div.modal-overlay {
    position: absolute;
    width: 100%;
    min-height: 100%;
    z-index: 11000;
    top: 0px;
    left: 0px;
}
#training-input-form{
     display:inline-block;
     padding: 40px 30px 10px 30px;
}
#training {
    background:none!important;
    z-index: 1100;
    height: 100%;
    width:100%;
}
.stepDesc {
    height: 100px;
    width: 250px;
    display:inline-block;
    font-family: Droid Sans Bold;
    color: rgb(0,60,123);
    font-size: 15px;
    line-height: 20px;
    margin-left:20px;
}
#trainingDiv .form-close{
    margin-right: 15px;
    margin-top: 10px;
    position: absolute;
    top: 9px;
    right: -1px;
    width: 18px;
} 
/*
#btnSeqPrev, #btnSeqNext{
    font-family: 'Raleway-Bold';
    margin-bottom: 4px;
    margin-right: 25px;
    display: inline-block;
    color: #FD9727;
    text-transform: uppercase;
    letter-spacing: 1.4px;
    background:none;
    border:none;
    margin:0;
    padding:0;
}*/

#btnSeqPrev{
    margin-bottom: 4px;
    margin-right: 25px;
}
div#btnRow{
    margin-left:200px;
}
.ms-Callout--arrowTop{
border: 2px solid #efefef;
}
.ms-Callout--arrowTop:before {
    z-index: 0;
    outline: 1px solid transparent;
}
.ms-Callout--arrowTop:before {
    content: '';
    position: absolute;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}
.ms-Callout.ms-Callout--arrowTop:before {
    border-top: 2px solid #efefef;
    border-right: 2px solid #efefef;
    top: -10px;
    width: 20px;
    height: 20px;
    background-color: #fff;
}
.ms-Callout--arrowTop:before {
    left: 20%;
    right: 0;
    /*margin: 0 auto;*/
    width: 0;
}

/*Training Pulse CSS*/
.wrapper {
    position: absolute!important;
    padding-left: 1em;
    padding-right: 1em;
	margin: auto;
	display: block;
	width: 27px;
}

.cssload-loader {
		width: 18px;
		height: 18px;
		border-radius: 50%;
		margin: 2em;
		display: inline-block;
		position: relative;
		vertical-align: middle;
}

.cssload-loader {
		width: 18px;
		height: 18px;
		border-radius: 50%;
		margin: 2em;
		display: inline-block;
		position: relative;
		vertical-align: middle;
}
.cssload-loader,
.cssload-loader:before,
.cssload-loader:after {
		animation: 2.5s infinite ease-in-out;
		-o-animation: 2.5s infinite ease-in-out;
		-ms-animation: 2.5s infinite ease-in-out;
		-webkit-animation: 2.5s infinite ease-in-out;
		-moz-animation: 2.5s infinite ease-in-out;
}
.cssload-loader:before,
.cssload-loader:after {
		width: 100%; 
		height: 100%;
		border-radius: 50%;
		position: absolute;
		top: 0;
		left: 0;
}

.cssload-loader:before,
.cssload-loader:after {
		content: "";
}
.cssload-loader:before {
		border: 1px solid rgb(240,8,8);
		top: -1px;
		left: -1px;
		opacity: 0;
		animation-name: cssload-pulse;
		-o-animation-name: cssload-pulse;
		-ms-animation-name: cssload-pulse;
		-webkit-animation-name: cssload-pulse;
		-moz-animation-name: cssload-pulse;
}



.cssload-loader:after {
		background-color: rgb(240,8,8);
		animation-name: cssload-pulse-2;
		-o-animation-name: cssload-pulse-2;
		-ms-animation-name: cssload-pulse-2;
		-webkit-animation-name: cssload-pulse-2;
		-moz-animation-name: cssload-pulse-2;
}



@keyframes cssload-pulse {
	0% { transform: scale(1); opacity: 1; }
	50% { transform: scale(1.3); opacity: 0; }
	100% { transform: scale(1.3); opacity: 0; }
}

@-o-keyframes cssload-pulse {
	0% { -o-transform: scale(1); opacity: 1; }
	50% { -o-transform: scale(1.3); opacity: 0; }
	100% { -o-transform: scale(1.3); opacity: 0; }
}

@-ms-keyframes cssload-pulse {
	0% { -ms-transform: scale(1); opacity: 1; }
	50% { -ms-transform: scale(1.3); opacity: 0; }
	100% { -ms-transform: scale(1.3); opacity: 0; }
}

@-webkit-keyframes cssload-pulse {
	0% { -webkit-transform: scale(1); opacity: 1; }
	50% { -webkit-transform: scale(1.3); opacity: 0; }
	100% { -webkit-transform: scale(1.3); opacity: 0; }
}

@-moz-keyframes cssload-pulse {
	0% { -moz-transform: scale(1); opacity: 1; }
	50% { -moz-transform: scale(1.3); opacity: 0; }
	100% { -moz-transform: scale(1.3); opacity: 0; }
}

@keyframes cssload-pulse-2 {
	0% { transform: scale(1); }
	50% { transform: scale(0.7); }
	100% { transform: scale(1); }
}

@-o-keyframes cssload-pulse-2 {
	0% { -o-transform: scale(1); }
	50% { -o-transform: scale(0.7); }
	100% { -o-transform: scale(1); }
}

@-ms-keyframes cssload-pulse-2 {
	0% { -ms-transform: scale(1); }
	50% { -ms-transform: scale(0.7); }
	100% { -ms-transform: scale(1); }
}

@-webkit-keyframes cssload-pulse-2 {
	0% { -webkit-transform: scale(1); }
	50% { -webkit-transform: scale(0.7); }
	100% { -webkit-transform: scale(1); }
}

@-moz-keyframes cssload-pulse-2 {
	0% { -moz-transform: scale(1); }
	50% { -moz-transform: scale(0.7); }
	100% { -moz-transform: scale(1); }
}

/* Document Category View */
div.document_entry {
	padding: 10px;
	margin-top:10px;
	border-radius: 8px 8px 8px 8px;
	background-color: rgba(253,151,39,.90);
	
	color: #ffffff;
}
div.document_entry a, div.document_entry a:link, div.document_entry a:hover, div.document_entry a:visited {
	color: #ffffff;
}
span.doc_title {
	width: 20%;
	display:block;
	float: left;
}
span.doc_desc {
	width: 50%;
	display:block;
	float: left;
}
span.doc_type {
	width: 15%;
	display:block;
	float: left;
}
span.doc_link {
	width: 15%;
	display:block;
	float: left;
}

/*PDF Viewer*/ 
.PdfViewer
{
    margin-top: 100px;
    width: 885px;
    margin-left: auto;
    margin-right: auto;
    position: relative;
}
.modal-overlay .PdfViewer 
{
    margin-top: 100px;
    width: 885px;
    margin-left: auto;
    margin-right: auto;
    position: relative;
}
.pdf-close {
    position: absolute;
    top: 12px;
    right: 20px;
    width: 55px;
}

/*PDF Viewer side arrow*/
.aLF-aPX-bhP .aLF-aPX-I {
    cursor: pointer;
}
.aLF-aPX-awL-I, .aLF-aPX-axp-I {
    position: absolute;
    top: 80px;
    bottom: 80px;
    margin-top: auto;
    margin-bottom: auto;
    outline: 0;
    width: 40px;
    height: 90px;
    z-index: 5;
}
.aLF-aPX-Km-atM {
    height: 40px;
    width: 40px;
    -webkit-border-radius: 20px;
    border-radius: 20px;
    background: rgba(0,0,0,0.75);
    -webkit-transition: background .2s,opacity .34s,transform .34s cubic-bezier(0.4,0.0,0.2,1);
    transition: background .2s,opacity .34s,transform .34s cubic-bezier(0.4,0.0,0.2,1);
    opacity: 1;
}
.aLF-aPX-Km-atM {
    /* height: 30px; */
    /* width: 40px; */
    /* background: #000; */
    /* -webkit-border-radius: 3px; */
    /* border-radius: 3px; */
    filter: alpha(opacity=80);
    /* opacity: .8; */
    position: absolute;
    top: 50%;
    left: 50%;
    margin-right: -50%;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
}
.forum_hover 
{ 
    background-color: #4285f4!important; 
    cursor: pointer;
}


.aLF-aPX-Km-JX {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-right: -50%;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
}


.right_circle {
  width: 90%;
  height: 50%;
  padding-bottom: 15%;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  background: linear-gradient(to right,  rgba(0,90,128,.85) 0%,rgba(148,207,185,.85) 100%);
  position: relative;
  border: none;
}
.right_circle:before {
  content: '';
  display: block;
  border-top: solid 10px transparent;
  border-left: solid 10px #FFF;
  border-bottom: solid 10px transparent;
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -10px 0 0 -3px;
}
.left_circle {
  width: 95%;
  height: 50%;
  padding-bottom: 15%;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  background: -webkit-linear-gradient(left,  rgba(0,90,128,.85) 0%,rgba(148,207,185,.85) 100%);
  position: relative;
  border: none;
}
.left_circle:before {
  content: '';
  display: block;
  border-top: solid 10px transparent;
  border-right: solid 10px #FFF;
  border-bottom: solid 10px transparent;
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -10px 0 0 -6px;
}