body {
	background-color:white;
}

img {
	user-drag: none; 
	user-select: none;
	-moz-user-select: none;
	-webkit-user-drag: none;
	-webkit-user-select: none;
	-ms-user-select: none;
}

/* the side panel */

.ip3_menuarea {
	position: fixed;
	float:right;	
	right: 0px;
	top:0px;
	z-index: 10;
	width:66vmin;
	height:95vh;
	padding:0; 
	/*border:1px solid green;*/
	background-color: transparent;
}

.ip3_menuitemclosed  {
	/*float:right;*/
	/*z-index: 50;*/
	right: 0;
	/*cursor: pointer;*/
	background-color: #00483A;
	color: #FEFEFE;
	border: none;
	/*align: right;*/
	font-size: 5vmin;			
	text-align : right;			
	-webkit-transition: .25s;
	transition: .25s;	
	border-radius: 8px 0px 0px 8px;		
	margin-right:0px;
	margin-left:auto;
	margin-top: .5vmin;
	width:  6vmin;
	height: 6vmin;
	/*padding: 2vmin 0vw 3vmin 2vw;*/

}

.ip3_menuicon {
	width: 6vmin;
	max-width : 6vmin;
	float:right;
	cursor: pointer;
}

.ip3_menutitle {
	padding: 0 1vmin 0 0;
	align: left;
	color: #FEFEFE;
	/*float:left;*/
	margin-left:5px;
	font-weight: bold;
}

.ip3_menusub {
	display: none;
	color: #FEFEFE;
	/*float:left;*/
	text-align:left;
	margin-left:5px;
	height:100%;
	width:50%;
	border-right: 1px solid #FEFEFE;
	overflow-y:auto;
}

.ip3_menutext2 {
	color: #FEFEFE;
	font-size: 50%;
	font-weight: bold;
	margin: 1px;
}

.ip3_menutext3 {
	color: #FEFEFE;
	font-size: 40%;
	font-weight: bold;
	margin: 1px;
}

.ip3_menutext4 {
	color: #FEFEFE;
	font-size: 40%;
	font-weight: normal;
	line-height: normal;
	padding: 2px;
}

.ip3_addrok {
	color:#FEFEFE;
}

.ip3_addrerror {
	color:yellow;
}

#UserText:-webkit-autofill {
    background-color: #00483A !important;
}

.ip3_menutextinput,
#Menu01 input:-webkit-autofill  {
	color: #FEFEFE  !important;
    -webkit-box-shadow: 0 0 0 1000px  #00483A inset !important;
	-webkit-text-fill-color: #FEFEFE;
	font-size: 45%;
	background-color: transparent  !important;;
	border: none;
	outline: none;
	border-bottom: 1px solid #FEFEFE  !important;
	/*flex-grow: 1;*/
}

.ip3_menutextinput:focus,
#Menu01 input:-webkit-autofill:focus,
#Menu01 input:-internal-autofill-selected {
	color: khaki  !important;
	-webkit-text-fill-color: khaki;
	background-color: transparent  !important;	
	outline: none  !important;
	border-bottom: 1px solid khaki  !important;
}

.ip3_menulink,
.ip3_menulink:link,
.ip3_menulink:visited {
	color: #FEFEFE;
	text-decoration: underline;
	font-size: 75%;
}

.ip3_menulink:hover {
	color: khaki;
	text-decoration: underline;
}

.ip3_menubutton  {
	background-color:transparent;
	border:  3px solid #FEFEFE;
	border-radius:6px;
	color: #FEFEFE;
	text-align: center;
	text-decoration: none;	
	margin: 8px 8px;
	cursor: pointer;
	outline: none;
	padding: 5px 32px;
	display: inline-block;
	font-size: 70%;
}

.ip3_smallbutton {
	border:  1px solid #FEFEFE;
	border-radius:6px;
	font-size: 40%;
	padding: 3px 10px;
	margin: 2px 8px;
}

.ip3_nudgegrid {
	float:right; 
	position:absolute;
	bottom: 2px;
	right:2px;
	padding:0; 
	margin:0; 
	font-size:2px; 
	background-color: transparent;
}

.ip3_nudgesquare,
.ip3_nudgebutton
{
	display: inline-block;
	width: 3vmin;
	max-width:3vmin;
	height:3vmin;
	max-height: 3vmin;	
	margin: 0px !important;
	padding: 0px !important;
	line-height:0px;
	opacity:50%;
}

.ip3_menubutton:hover,
.ip3_menubutton:focus,
.ip3_menuicon:hover,
.ip3_nudgebutton:hover {
	background-color: #50B948;
}

.ip3_smallbutton:disabled,
.ip3_smallbutton:hover:disabled  {
	background-color: transparent;
	border:  1px solid #50B948;
	color: #50B948;
}

.ip3_addressarea {
	min-height:20vmin;
	padding-left:2vmin;
}

.ip3_addresstext {
	width:80%;
	display:inline-block;
	color: black;
	background-color:#FEFEFE;
	border-radius:6px;
	font-size: 45%;
	padding:1vmin;
	min-height:16vmin;
	vertical-align: top;
}

.ip3_listheader {
  background-color:transparent;
  color: #FEFEFE;
  padding: 2px;
  text-align: left;
  text-decoration: none;
  font-size: 50%;
  font-weight: bold;
  /*margin: 18px 8px;*/
  cursor: pointer;
}

.ip3_listsummary {
	float:right;
	font-size: 80%;
	color: LemonChiffon;
	text-align: right;
	padding-top:.3em;
	padding-right:.2em;
	font-weight: normal;
	overflow:hidden;
}

.ip3_expandarea {
	border-top:1px solid #FEFEFE; 	
	margin-top:3px;
}

.ip3_list {
	/*border:1px solid cyan;*/
	font-size:40%;
	overflow:auto;
	height:0em;
	max-height:8em;
	/*list-style-position: inside;*/
	padding-left: 2px;
	white-space:nowrap;
	margin:2px;
	-webkit-transition: height .25s;
	transition: height .25s;
	cursor: pointer;
	background-size: contain;
}

.ip3_list li {
  white-space: nowrap; 
}

.ip3_list_selected  {
  font-weight; bold; 
}

.ip3_divlist {
	overflow:auto;
	height:0em; 
	padding-left: 2px;
	margin:2px;
	-webkit-transition: height .25s;
	transition: height .25s;
}

.ip3_switchlist {
	font-size:80%;
	max-height:1.2em;
	height:1.2em; 
	line-height:1em;
	overflow:hidden;
	margin-top:0px;
	padding-bottom:3px;
}

.ip3_dropframe {
	width:6vmin;
	height:6vmin;
	border:none;
	display:inline-block;		
}

.ip3_nothoverframe {
	/*background-color: #50B948;*/
	border:3px solid transparent;
}

.ip3_hoverframe {
	/*background-color: #50B948;*/
	border:3px solid orange !important;
}

.ip3_frame {
	border: 2px solid yellow !important;
}

.ip3_listheader:hover,
.ip3_list li:hover {
	background-color: #50B948;
}

.ip3_postarea {
	display:none;
	float:right; 
	min-height:20vmin;
	padding-left:2vmin;
	bottom:0px; 
}

/* letter frame */
.ip3_letterarea {
	position: fixed;
	float: left;
	z-index:20;	
	left: 0px;
	top: 0px;
	width: 66vh;
	height: 95vh;
	min-height: 600px; 
	min-width: 420px; 
	padding: 0; 
	border: 3px solid #00483A;
	border-radius: 6px;


}

/* address box in drop area */
.ip3_addressbox
{
	border: 2px solid;
	border-color: #F28E9A; 
	z-index: 30; 
	position:absolute; 
	left: 5%; 
	top: 15%;  
	width: 25%; 
	height: 12%;
	padding: 0;
	margin: 0;
	text-align:left;
	border-radius: 8px;
	background-color: transparent;
}

.ip3_greyborder {
	border-color: #C0C0C0 !important; 
}

/* the LetterFrame file upload control */
		
#LetterFrame .LetterFrameposterr {
	color:#00483A !important;
}

#LetterFrame .ajax__fileupload {
	margin:0 !important;
	padding:0 !important;			
	width:99% !important;
	height:99% !important;
	overflow:hidden !important;
}

#LetterFrame .ajax__fileupload_dropzone { 
	margin:0 !important;
	padding:0 !important;	
	margin-left:2px !important;	
	width:99% !important;
	height:96%;
	min-height:96%;
	text-align:center;
	text-transform:uppercase;
	font-weight:bold;
	border:1px dashed gray;
	background-image:url("DragDrop0.jpg");
	background-size: contain;
	background-repeat:no-repeat;
	background-color:#FEFEFE;
	background-position:center;
	color:#FEFEFE;
} 

#LetterFrame .ajax__fileupload_selectFileButton {
	background-color:#00483A !important;
	font-weight:bold;
}	


/* SCROLLBARS */
::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

::-webkit-scrollbar-track {
  background: #FEFEFE; 
}
 
::-webkit-scrollbar-thumb {
  background: #888; 
}

::-webkit-scrollbar-thumb:hover {
  background: #50B948; 
}	

/* LOADER */

.ip3_loader {
	display:none;
	height:94%;
	width:94%;
	background: rgba(128, 128, 128, 0.6);
	border-radius: 20px;
	z-index: 200;
	position:fixed;
	top:2%;
	left:2%;
}

.ip3_loader_inner {
	height:30vmin;
	width:30vmin;
	background-color:#FEFEFE;
	margin: auto;	
	position: relative;
	top:30%;	
	border-radius:5vmin;	
	text-align: center;
}

.ip3_loader_spinner {
	background-color:#FEFEFE;
	border: 16px solid #f3f3f3;
	border-radius: 50%;
	border-top: 16px solid #00483A;
	width: 60%;
	height: 60%;
	-webkit-animation: spin 2s linear infinite; /* Safari */
	animation: spin 2s linear infinite;
	margin: auto;
	position: relative;	
	text-align: center;
	top: 12%;
}

/* Safari */
@-webkit-keyframes spin {
	0% { -webkit-transform: rotate(0deg); }
	100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
	0% { transform: rotate(0deg); }
	100% { transform: rotate(360deg); }
}

/**** slider checkbox ****/
.ip3_switch {
  position: relative;
  display: inline-block;
  width: 1.0em;
  height: .6em;
  vertical-align: middle;
  margin-top:6px;
}

.ip3_switch input { 
  opacity: 0;
  width: 0;
  height: 0;
}

.ip3_slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border-radius: .5em;
  background-color: gray;
  -webkit-transition: .15s;
  transition: .15s;
  padding: .1em;

}

.ip3_slider:before {
  position: absolute;
  content: "";
  height: .4em;
  width: .4em;
  border-radius: 50%;
  background-color: #00483A;
  -webkit-transition: .15s;
  transition: .15s;
}

input:checked + .ip3_slider {
  background-color: #FEFEFE;
}

input:checked + .ip3_slider:before {
  -webkit-transform: translateX(.4em);
  -ms-transform: translateX(.4em);
  transform: translateX(.4em);
}

/* help and prompts */
/*.ip3_prompter{
	display:none;
	height:50%;
	width:80%;
	position:absolute;
	margin: 5%;	
	padding: 5%;
	bottom:0px;
	background-color:#00483A;
	color:#FEFEFE;
	border-radius: 4vmin;
}*/

.ip3_statusarea,
.ip3_costarea {
	color:#00483A;
	font-size:large;
	z-index:40;	
	position:fixed;
	bottom:0px;
	height:60px;
	margin-bottom:.5vmin;
}

.ip3_statusarea {
	/*border: 1px solid green;*/
	left:0px;
	height: 1.1em;
	width: 80vw;
	min-width: 66vh; 
	margin-left:1vmin;
	margin-top:.5vmin;
	overflow:hidden;
}

.ip3_costarea {
	/*border: 1px solid red;*/
	right:0px;
	width:200px;
	margin-right:8vmin;
	text-align:right;
}

.ip3_logo {
	z-index:5;
	background-image: url('banner.png');
	background-size: contain; 
	background-repeat:no-repeat;
	position:fixed;
	/*bottom:60px;*/
	top:0px;
	right:0px;
	height:7vmin;
	width:28vmin;
	margin-right:8vmin;
	/*margin-bottom:1vmin;*/
	margin-top: 6px;
	text-align:right;
}




/* the AttachFrame file upload control */
		

		
#AttachFrame .LetterFrameposterr {
	color:red !important;
}

#AttachFrame .ajax__fileupload {
	margin:0 !important;
	padding:0 !important;			
	width:100 !important;
	height:100% !important;
	overflow:hidden;
	border:none !important;
}

#AttachFrame .ajax__fileupload_dropzone { 
	margin:0 !important;
	padding:0 !important;		
	width:100 !important;
	height:100% !important;
	font-size:0;
	border:none;
	background-image:url('../../ip3/attch.png');
	background-size: contain;
	background-repeat:no-repeat;
	background-color: #00483A;
	background-position:center;
	color:#00483A;
} 


#AttachFrame .ajax__fileupload_selectFileButton {
	position: relative !important;
	float: right !important;
	right: 0px !important; 
	background-color:blue !important;
	visibility:hidden !important;
}	
	
#AttachFrame .ajax__fileupload_selectFileContainer,
#AttachFrame .ajax__fileupload_topFileStatus
{
	display:none  !important;
	visibility:hidden !important;
	max-height:0  !important;
}

.ip3_modalalert {
	display:none;
	height:94%;
	width:94%;
	background: rgba(192, 192, 192, 0.6);
	border-radius: 10px;
	z-index: 200;
	position:fixed;
	top:2%;
	left:2%;
}

.ip3_modalinner {
	width:60vmin;
	background-color:#00483A;
	margin: auto;	
	position: relative;
	top:60%;	
	border-radius:10px;	
	text-align: center;
	padding:3vmin;
	font-size:3vmin;
}

.ip3_modalwarninginner {
	width:60vmin;
	background-color:orangered;
	margin: auto;	
	position: relative;
	top:40%;	
	border-radius:10px;	
	text-align: center;
	padding:3vmin;
	font-size:3vmin;
}

.ip_warningstatustext {
	color:orangered !important;
}

.ip_success {
	background-color:forestgreen !important;
}
.ip_warning {
	background-color:orangered !important;
}
.ip_error {
	background-color:red !important;
}

#QueuedStatus a {
	font-size:60%;
}

#CostCodeList input {
	color:lightgray;
	background-color: transparent  !important;
	border: none;
	outline: none;
	border-bottom: 1px solid #FEFEFE  !important;
	
}
