/*--------------------------------------*/
/* The Base/Overall Styling of Elements */
/*--------------------------------------*/

/*Styles the overall page*/
.AdvSrch {
	border: 2px solid #36758D;
	border-radius: 10px;
	padding: 12px 0px;
	/*margin: 0px 10px;*/
}

/*Spaces out the Row Divs*/
#AdvancedSearchForm>div{
	margin-top: 8px;
}

/*Overall styling of all inputs and selects*/
.AdvSrch input[type=text], input[type=number], select {
	padding: 6px;
	border: 1px solid #36758D;
	border-radius: 4px;
	box-sizing: border-box;
	resize: vertical;
}

/*Some Divs wil be hidden when the Page is opened*/
.hiddenDivs{
	display: none;
}

/*First Label on the left of a row*/
.firstLabel{
	width: 25%;
	text-align: right;
	padding-right: 5px;
}

/*Labels for required rows*/
.reqLabel{
	color: red;
}

/*Help Button*/
.btn-help {
	width: 50px;
	height: 50px;
}


/*-------------------------------------------*/
/* Styles the Checkbox for Duplicate Reports */
/*-------------------------------------------*/

#dupDiv{
	width:50%;
	text-align:center;
}

/* The Duplicate Reports Check Box */
.dupBox {
	position: relative;
	padding-left: 35px;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

/* Hide the browser's default checkbox */
.dupBox input {
	position: absolute;
	opacity: 0;
	cursor: pointer;
}

/* Create a custom checkbox */
.checkmark {
	/*position: absolute;*/
	float: right;
	margin-left: 5px;
	top: 0;
	left: 0;
	height: 25px;
	width: 25px;
	background-color: white;
	border: 1px solid #36758D;
}

/* On mouse-over, add a grey background color */
.dupBox:hover input ~ .checkmark {
	background-color: #eee;
}

/* When the checkbox is checked, add a blue background */
.dupBox input:checked ~ .checkmark {
	background-color: #36758D;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
	content: "";
	position: relative;
	display: none;
}

/* Show the checkmark when checked */
.dupBox input:checked ~ .checkmark:after {
	display: block;
}

/* Style the checkmark/indicator */
.dupBox .checkmark:after {
	left: 8px;
	top: 2px;
	width: 8px;
	height: 16px;
	border: solid white;
	border-width: 0 3px 3px 0;
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
}

/*------------------------------*/
/* Formatting DifferentMessages */
/*------------------------------*/
.textInfo{
	padding: 5px 15px;
}

.reqMsgDiv{
	padding-left: 25%;
}

#workMsgDiv{
	margin-left: 20%;
}

#PurpleReqDiv{
	padding-left: 25%;
}

/*------------*/
/* Submit Row */
/*------------*/
.submitDiv{
	display: flex;
	justify-content: center;
}

.submit-row {
	background-color: #36758D;
	border: 2px solid #36758D;
	color: white;
	text-align: center;
	text-decoration: none;
	margin: 5px 5px;
	height: 40px;
	width: 150px;
	cursor: pointer;
}

.submit-row:hover {
	font-weight: bold;
}

.ctrib_only{
    display: none;
}


/*******************************************************/
/* Resize Some things when the Container First Shrinks */
/*******************************************************/
@media (max-width: 991px){

	/*Shorten the Date Ranges*/
	#DateDiv > input{
		max-width: 105px;
	}

	/*Pull down the Flavor Text*/
	.flavorTxt{
		white-space: nowrap;
		padding-left: 25%;
	}
	
	/*Shorten the amount input box*/
	.amt{
		width: 150px;
	}
}


/***********************************/
/* Repositioning the Location Info */
/***********************************/
@media (max-width: 735px){
	#city{
		margin-right: 151px;
		margin-bottom: 10px;
	}
	
	#stateLabel{
		width: 25%;
		text-align: right;
	}
}


/****************************************/
/* Reposition the "Leave Blank" Message */
/****************************************/
@media (max-width: 600px){
	#blankMsg{
		white-space: nowrap;
		padding-left: 25%;
	}
}


/************************************************/
/* Shorten the FilerType when Container Shrinks */
/************************************************/
@media (max-width: 570px){
	#Filertype{
		width: 250px;
	}
}


/*****************************/
/* Shorten the Amount Fields */
/*****************************/
@media (max-width: 550px){
	#amtFrom{
		width: 85px;
		margin-left: calc( 25% - 85px );
	}
	
	.amt{
		width: 125px;
	}
}


/**********************************************************/
/* Maintain The Duplicate Reports Div width at this Point */
/**********************************************************/
@media (max-width: 536px){
	#dupDiv{
		width: 244px;
	}
}
	

/****************************************/
/* Reorder Labels, Fields, and Messages */
/*   -Base for Mobile View              */
/****************************************/
@media (max-width: 502px){
	.firstLabel{
		width: 350px;
		text-align: left;
		padding-left: 25px;
	}
	
	#amtFrom{
		width: 85px;
		margin-left: 0px;
	}
	
	#BegAmtID{
		margin-left: 0px;
	}
	
	.amt{
		width: 100px;
	}
	
	#stateLabel{
		width: 70px;
		text-align: left;
		padding-left: 20px;
	}
	
	#workMsgDiv{
		margin-left: 25px;
		width: 300px;
	}
	
	/*Removes padding and Centers the Required Message*/
	.reqMsgDiv{
		padding-left: 0;
		text-align: center;
	}
	
	#TransactNameDiv1 > .flavorTxt{
		padding-left: 0;
	}
	
	.firstInput{
		margin-left: 50px;
	}
	
	.nameInput{
		max-width: 250px;
	}
	
	.flavorTxt{
		white-space: nowrap;
		padding-left: 45px;
		text-align: center;
	}
	
	#PurpleReqDiv{
		padding-left: 0px;
		margin-left: 25px;
	}
	
	#sort{
		margin-left: 50px;
		margin-bottom: 10px;
	}
	
	#orderLabel{
		width: 325px;
		padding-left: 25px;
	}
	
	#order{
		margin-left: 50px;
	}
	
	#blankMsg{
		white-space: nowrap;
		padding-left: 45px;
		text-align: center;
	}
	
	/*Bring in the Submit Div Buttons*/
	#submitDiv{
		display: block;
		margin-left: 5%;
		width: 300px;
	}
}


/*********************************************************/
/* Reposition the Locations and resize the Amount fields */
/*********************************************************/
@media (max-width: 400px){
	
	.amt{
		width: 85px;
	}
	
	#stateLabel{
		width: 325px;
	}
	
	#state{
		margin-right: 140px;
		margin-bottom: 10px;
		margin-left: 50px;
	}
	
	#zipLabel{
		margin-left: 25px;
		width: 325px;
	}
	
	#zip{
		margin-left: 50px;
	}
}




/*----------*/
/* Not Used */
/*----------*/

/*
.ui-widget-header{
	background-color: #36758D !important;
}
.ui-datepicker-header{
	color: white !important;
}
.ui-widget-header .ui-icon{
	background-image: url('/assets/images/ui-icons-white.png') !important;
}
.ui-corner-all:focus{
	background-color: red !important;
}
*/

/*.tab-content .tab-pane > h2 {
	color: black;
	font-weight: bold;
	text-align: center;
}*/