/*******************************************************************************************************************
Responsive Design
*******************************************************************************************************************/

/************
	What are min and max?
	MIN: applies to screens which are greater than px
	MAX: applies to screens which are less than the px

************/




/***********************************/
/*  Media Size Visibility Classes  */
/***********************************/
.visible-small,
.visible-medium,
.visible-large 
{
	display: none !important;
}

.visible-small-block,
.visible-small-inline,
.visible-small-inline-block,
.visible-medium-block,
.visible-medium-inline,
.visible-medium-inline-block,
.visible-large-block,
.visible-large-inline,
.visible-large-inline-block 
{
	display: none !important;
}

.display-table-cell-medium, .display-table-cell-large
{
	display: block;
}

/********************
MAX 500px
********************/

@media (max-width:400px)
{
	.pi-input-right-margin
	{
		margin-right: 0px;
	}
}
@media (max-width:500px)
{

	*
	{
		font-size: 16px;
	}

	table.pi-banner-utility-menu > tbody > tr > td:nth-child(3)
	{
		display: none;
	}

	table.pi-banner-utility-menu > tbody > tr > td:nth-child(4)
	{
		display: none;
	}

	div.pi-open-left-nav-container
	{
		display:none;
	}

	table.pi-banner-main-menu-search
	{
		display:none;
	}
	#ph_lo_Item_1 > tbody > tr > td:nth-child(2)
	{
		display:none;
	}
}
@media (max-width: 800px) 
{
	

	div.responsive
	{
		width: auto !important;
		max-width: 100%;
	}

	/*too many people are sizing the layer itself, this turns that off in a small window*/
	table.DraggableLayer
	{
		width:auto !important;
	}



	.user-avatar-medium > img, *.user-avatar-medium > div, div.user-avatar-medium, img.user-avatar-medium {
		width: 40px !important;
		height: 40px !important;
		border-radius: 50%;
		line-height: 40px !important;
		font-size: 20px !important;
		color: #ffffff;
		text-align: center;
		margin: 0px !important;
		vertical-align: middle;
		overflow: hidden;
		cursor: pointer;
		display: inline-block;
	}



	/*-----------------------------------------------------*/
	/* Notifications Page - Table cells */
	/*-----------------------------------------------------*/

	.pi-notification-page-cell1 
	{
		vertical-align: top !important;
		width: 40px !important;
		padding-top: 30px !important;
		padding-bottom: 10px !important;
		text-align: center !important;
	}

	.pi-notification-page-cell2 
	{
		vertical-align: top !important;
		width: 100% !important;
		padding: 30px 45px 10px 20px !important;
		font-size: 1.2rem;
		word-wrap: break-word;
		overflow-wrap: break-word;
	}

	.pi-notification-page-cell2 * 
	{
		font-size: 1.2rem;
	}

	/* P tag needed because of IE11 */
	.pi-notification-page-cell2-p 
	{
		margin-top: -2px;
		word-wrap: break-word;
		overflow-wrap: break-word;
	}

	.pi-notification-page-cell3 
	{
		width: 25px !important;
		vertical-align: top !important;
	}
/*-----------------------------------------------------*/




	
}

/********************
XS size
********************/
.pi-pi-col-xs-1, .pi-pi-col-xs-2, .pi-col-xs-3, .pi-col-xs-4, .pi-col-xs-5, .pi-col-xs-6, .pi-col-xs-7, .pi-col-xs-8, .pi-col-xs-9, .pi-col-xs-10, .pi-col-xs-11, .pi-col-xs-12 {
	float: left;
}
.pi-col-xs-12 {
	width: 100%;
}

.pi-col-xs-11 {
	width: 91.66666667%;
}

.pi-col-xs-10 {
	width: 83.33333333%;
}

.pi-col-xs-9 {
	width: 75%;
}

.pi-col-xs-8 {
	width: 66.66666667%;
}

.pi-col-xs-7 {
	width: 58.33333333%;
}

.pi-col-xs-6 {
	width: 50%;
}

.pi-col-xs-5 {
	width: 41.66666667%;
}

.pi-col-xs-4 {
	width: 33.33333333%;
}

.pi-col-xs-3 {
	width: 25%;
}

.pi-col-xs-2 {
	width: 16.66666667%;
}

.pi-col-xs-1 {
	width: 8.33333333%;
}

/********************
MIN 768px
********************/
/*@media (max-width: 990px) and (min-width:450px)*/ /** Less than 450px we drop out to standard divs */
@media (min-width:768px) 
{
	.pi-col-sm-1, .pi-col-sm-2, .pi-col-sm-3, .pi-col-sm-4, .pi-col-sm-5, .pi-col-sm-6, .pi-col-sm-7, .pi-col-sm-8, .pi-col-sm-9, .pi-col-sm-10, .pi-col-sm-11, .pi-col-sm-12
	{
		float: left;
	}
	
	.pi-col-sm-1 {width: 8.33%;}
	.pi-col-sm-2 {width: 16.66%;}
	.pi-col-sm-3 {width: 25%;}
	.pi-col-sm-4 {width: 33.33%;}
	.pi-col-sm-5 {width: 41.66%;}
	.pi-col-sm-6 {width: 50%;}
	.pi-col-sm-7 {width: 58.33%;}
	.pi-col-sm-8 {width: 66.66%;}
	.pi-col-sm-9 {width: 75%;}
	.pi-col-sm-10 {width: 83.33%;}
	.pi-col-sm-11 {width: 91.66%;}
	.pi-col-sm-12 {width: 100%;}

	.pi-col-sm-offset-0 {margin-left: 0;}
	.pi-col-sm-offset-1 {margin-left: 8.33333333%;}
	.pi-col-sm-offset-2 {margin-left: 16.66666667%;}
	.pi-col-sm-offset-3 {margin-left: 25%;}
	.pi-col-sm-offset-4 {margin-left: 33.33333333%;}
	.pi-col-sm-offset-5 {margin-left: 41.66666667%;}
	.pi-col-sm-offset-6 {margin-left: 50%;}
	.pi-col-sm-offset-7 {margin-left: 58.33333333%;}
	.pi-col-sm-offset-8 {margin-left: 66.66666667%;}
	.pi-col-sm-offset-9 {margin-left: 75%;}
	.pi-col-sm-offset-10 {margin-left: 83.33333333%;}
	.pi-col-sm-offset-11 {margin-left: 91.66666667%;}
	.pi-col-sm-offset-12 {margin-left: 100%;}





}


/********************
MAX 768px
********************/
@media (max-width: 760px) 
{
	div.pi-input-label-left 
	{
		margin-bottom: 5px;
	}

	.visible-small 
	{
		display: block !important;
	}

	table.visible-small 
	{
		display: table !important;
	}

	tr.visible-small 
	{
		display: table-row !important;
	}

	th.visible-small,
	td.visible-small 
	{
		display: table-cell !important;
	}

	.visible-small-block 
	{
		display: block !important;
	}

	.visible-small-inline 
	{
		display: inline !important;
	}

	.visible-small-inline-block 
	{
		display: inline-block !important;
	}

	td.DraggableLayer 
	{
		min-width: 0px; /* Took this out the layers work at responsive levels */
	}

	.hidden-small 
	{
		display: none !important;
	}


	div.pi-input-right-W100 
	{
		width: 100%;
	}

	div.pi-page 
	{
		padding-bottom: 100px !important;
	}


	/*hide top menu items that no longer apply*/
	table.pi-banner-main-menu-top > tbody > tr > td:nth-last-of-type(2) 
	{
		display: none;
	}

	/*hide the display edit buttons on small screens*/
	div.display-edit 
	{
		display: none;
	}

	.hidden-pi-menu-small
	{
		display: none !important;
	}

	/*classic PI enterprise reponsive page level hamburger menu*/
	div.pi-page-menu-classic 
	{
		display: table-cell;
	}
	/*classic PI enterprise reponsive hamburger menu*/
	div.pi-menu-classic 
	{
		display: inline-block;
	}

	
	/*hide the page menu*/
	div.pi-page-view-menu-wrap
	{
		display: none;
	}

	div.pi-page-tool-menu-wrap 
	{
		display: none;
	}

	div.pi-back
	{
		padding-top:10px;
	}
	

	div.pi-path
	{
		padding-top:15px;
	}

	img.pi-comment-img
	{
		max-width:100%;
	}

}

/********************
MAX 991px
********************/
@media (max-width: 991px) 
{

	div.AccordionDivContainer
	{
		min-width:95%;
		max-width:95%;
	}

	.hidden-medium 
	{
		display: none !important;
	}
	
	
}

/********************
MIN 991px
********************/
@media (min-width: 991px) {
	.pi-col, .pi-col-1, .pi-col-2, .pi-col-3, .pi-col-4, .pi-col-5, .pi-col-6, .pi-col-7, .pi-col-8, .pi-col-9, .pi-col-10, .pi-col-11, .pi-col-12,
	.pi-col-md-1, .pi-col-md-2, .pi-col-md-3, .pi-col-md-4, .pi-col-md-5, .pi-col-md-6, .pi-col-md-7, .pi-col-md-8, .pi-col-md-9, .pi-col-md-10, .pi-col-md-11, .pi-col-md-12 {
		float: left;
	}

	.pi-col {
		-ms-flex-preferred-size: 0;
		flex-basis: 0;
		-webkit-box-flex: 1;
		-ms-flex-positive: 1;
		flex-grow: 1;
		max-width: 100%;
	}
	.pi-col-1, .pi-col-md-1 {width: 8.33333333%;}
	.pi-col-2, .pi-col-md-2 {width: 16.66666667%;}
	.pi-col-3, .pi-col-md-3 {width: 25%;}
	.pi-col-4, .pi-col-md-4 {width: 33.33333333%;}
	.pi-col-5, .pi-col-md-5 {width: 41.66666667%;}
	.pi-col-6, .pi-col-md-6 {width: 50%;}
	.pi-col-7, .pi-col-md-7 {width: 58.33333333%;}
	.pi-col-8, .pi-col-md-8 {width: 66.66666667%;}
	.pi-col-9, .pi-col-md-9 {width: 75%;}
	.pi-col-10, .pi-col-md-10 {width: 83.33333333%;}
	.pi-col-11, .pi-col-md-11 {width: 91.66666667%;}
	.pi-col-12, .pi-col-md-12 {width: 100%;}

	.pi-col-offset-0, .pi-col-md-offset-0 { margin-left: 0; }
	.pi-col-offset-1, .pi-col-md-offset-1 { margin-left: 8.33333333%; }
	.pi-col-offset-2, .pi-col-md-offset-2 { margin-left: 16.66666667%; }
	.pi-col-offset-3, .pi-col-md-offset-3 { margin-left: 25%; }
	.pi-col-offset-4, .pi-col-md-offset-4 { margin-left: 33.33333333%; }
	.pi-col-offset-5, .pi-col-md-offset-5 { margin-left: 41.66666667%; }
	.pi-col-offset-6, .pi-col-md-offset-6 { margin-left: 50%; }
	.pi-col-offset-7, .pi-col-md-offset-7 { margin-left: 58.33333333%; }
	.pi-col-offset-8, .pi-col-md-offset-8 { margin-left: 66.66666667%; }
	.pi-col-offset-9, .pi-col-md-offset-9 { margin-left: 75%; }
	.pi-col-offset-10, .pi-col-md-offset-10 { margin-left: 83.33333333%; }
	.pi-col-offset-11, .pi-col-md-offset-11 { margin-left: 91.66666667%; }
	.pi-col-offset-12, .pi-col-md-offset-12 { margin-left: 100%; }
}



/********************
MAX 1000px
********************/
@media (max-width: 1000px)
{
	#ph_logoLink,
	#A_ph_mo_Item_0,
	#A_ph_lo_Item_0
	{
		display: none !important;
	}

}

/********************
MAX 1199px
********************/
@media (max-width: 1199px)
{
	.hidden-medium
	{
		display: none !important;
	}

	table.pi-page-menu-top > tbody > tr > td:nth-child(2)
	{
		display: none;
	}
}

	/********************
MIN 1200px
********************/
@media (min-width: 1200px)
{
	.pi-col-lg-1, .pi-col-lg-2, .pi-col-lg-3, .pi-col-lg-4, .pi-col-lg-5, .pi-col-lg-6, .pi-col-lg-7, .pi-col-lg-8, .pi-col-lg-9, .pi-col-lg-10, .pi-col-lg-11, .pi-col-lg-12
	{
		float: left;
	}

	.pi-col-lg-1
	{
		width: 8.33%;
	}

	.pi-col-lg-2
	{
		width: 16.66%;
	}

	.pi-col-lg-3
	{
		width: 25%;
	}

	.pi-col-lg-4
	{
		width: 33.33%;
	}

	.pi-col-lg-5
	{
		width: 41.66%;
	}

	.pi-col-lg-6
	{
		width: 50%;
	}

	.pi-col-lg-7
	{
		width: 58.33%;
	}

	.pi-col-lg-8
	{
		width: 66.66%;
	}

	.pi-col-lg-9
	{
		width: 75%;
	}

	.pi-col-lg-10
	{
		width: 83.33%;
	}

	.pi-col-lg-11
	{
		width: 91.66%;
	}

	.pi-col-lg-12
	{
		width: 100%;
	}

	.pi-col-lg-offset-0
	{
		margin-left: 0;
	}

	.pi-col-lg-offset-1
	{
		margin-left: 8.33333333%;
	}

	.pi-col-lg-offset-2
	{
		margin-left: 16.66666667%;
	}

	.pi-col-lg-offset-3
	{
		margin-left: 25%;
	}

	.pi-col-lg-offset-4
	{
		margin-left: 33.33333333%;
	}

	.pi-col-lg-offset-5
	{
		margin-left: 41.66666667%;
	}

	.pi-col-lg-offset-6
	{
		margin-left: 50%;
	}

	.pi-col-lg-offset-7
	{
		margin-left: 58.33333333%;
	}

	.pi-col-lg-offset-8
	{
		margin-left: 66.66666667%;
	}

	.pi-col-lg-offset-9
	{
		margin-left: 75%;
	}

	.pi-col-lg-offset-10
	{
		margin-left: 83.33333333%;
	}

	.pi-col-lg-offset-11
	{
		margin-left: 91.66666667%;
	}

	.pi-col-lg-offset-12
	{
		margin-left: 100%;
	}

	.visible-large
	{
		display: block !important;
	}

	table.visible-large
	{
		display: table !important;
	}

	tr.visible-large
	{
		display: table-row !important;
	}

	th.visible-large,
	td.visible- tr.visible-large
	{
		display: table-cell !important;
	}

	.visible-large-block
	{
		display: block !important;
	}

	.visible-large-inline
	{
		display: inline !important;
	}

	.visible-large-inline-block
	{
		display: inline-block !important;
	}

	.hidden-large
	{
		display: none !important;
	}

	.display-table-cell-large
	{
		display: table-cell;
	}

}

/********************
MIN 769px <--> MAX 1199px
********************/
@media (min-width: 761px) and (max-width: 1199px)
{
	.visible-medium
	{
		display: block !important;
	}

	table.visible-medium
	{
		display: table !important;
	}

	tr.visible-medium
	{
		display: table-row !important;
	}

	th.visible-medium,
	td.visible-medium
	{
		display: table-cell !important;
	}

	.visible-medium-block
	{
		display: block !important;
	}

	.visible-medium-inline
	{
		display: inline !important;
	}

	.visible-medium-inline-block
	{
		display: inline-block !important;
	}

	.display-table-cell-medium
	{
		display: table-cell;
	}

	
}