@import url("masthead.css");
/*-- content wrapper ---- */

.red{
	color:red;
}

.container
{
	width:100% !important;
	margin:0 auto;
}

body
{
	max-width:2000px;
	margin:0 auto !important;
}
.panel
{
	padding:0px;
}
.panelHead{
	font-size:26px !important;
	font-weight:bold;
}
.panel.adjust
{
	/*
	background:#fafafa;
	padding:10px;
	-webkit-border-top-left-radius:0px;
	-moz-border-radius-topLeft:0px;
	border-top-left-radius:0px;
	
	-webkit-border-top-right-radius:0px;
	-moz-border-radius-topRight:0px;
	border-top-right-radius:0px;
	
	border:1px solid #dddddd;
	border-top:0;
	*/
}

.tabs-left > .tab-content
{
	min-height:230px;
	margin-bottom:20px;
	padding:20px;
	background: #ffffff;
	border: 1px solid #dddddd;
	
	overflow:auto;
}

.tabs-left > .nav-tabs
{
	margin-right:0px;
	border-right:none;
}
.grid-header
{
	padding:5px;
	height:60px;
	border-bottom:2px solid #dddddd;
	margin-top:10px;
}

.grid-header h1, .grid-header h2, .grid-header h3, .grid-header h4, .grid-header h5, .grid-header h6
{
	padding:0px;
	margin:0px;
	line-height: 30px;
}

.grid-header h1 img, .grid-header h2 img, .grid-header h3 img, .grid-header h4 img, .grid-header h5 img, .grid-header h6 img
{
	margin-right:10px;
}

.whiteGrid
{
	background-color:#ffffff;
}

.actionMenu
{
	text-align:center;
}
body.modal-open .datepicker {
    z-index: 1200 !important;
}
div.white > table 
{
	background:white;
}

input.search-field
{
	background-color:#fafafa;
	border-color:#4B5754;
	padding:6px !important;
	-webkit-transition:background-color ease-out .50s;
	-moz-transition:background-color ease-out .50s;
	transition:background-color ease-out .50s
}

input.search-field:focus
{
	background-color:#ffffff;
	color:#111111;
	-webkit-transition:background-color ease-in .50s;
	-moz-transition:background-color ease-in .50s;
	transition:background-color ease-in .50s
}

.topover
{
	margin-top:-100px;
}

span.sub-header
{
	display:block;
	font-size:70%;
	color:#888888;
	text-transform:none;
}

span.sub-header.bigger
{
	font-size:80%;
	color:#333333;
	font-weight:bold;
}

.tile, .tile-important
{
	display:inline-block;
	width:49%;
	vertical-align: top;
	padding:5px;
}

.tile-important h4
{
	margin-top:0px !important;
}

.tile-important *
{
	text-align: center;
	clear:both;
	float:none !important;
}

.tile-important #anchor
{
	text-align: center;
}

.tile-tri
{
	display:inline-block;
	width:32%;
	vertical-align: top;
	padding:5px;
}


@media (max-width: 1000px) {
	.tile{
	display:block !important;
	width:100% !important;
	margin:0 auto !important;
	}
}

.modal.small .modal-content
{
	width:500px;
	margin-left:50px;
	margin-top:0px;
}
.modal.medium .modal-content
{
	width:800px;
	margin-left:-100px;
	margin-top:0px;
}
.modal.mediumRare .modal-content
{
	width:950px;
	margin-left:-190px;
	margin-top:0px;
}
.modal.xmedium .modal-content
{
	width:1100px;
	margin-left:-250px;
	margin-top:0px;
}

.modal.large .modal-content
{
	width:100%;
	margin-top:0px;
}

@media (min-width: 375px)
{
	.modal-dialog {
		width: 300px;
		margin: 10px auto;
	}
}

@media (min-width: 767px)
{
	.modal-dialog {
		width: 600px;
		margin: 10px auto;
	}
}

@media (min-width: 992px)
{
	.modal-lg {
    	width: 900px !important;
	}
}

@media (min-width:1200px)
{
	.modal-xl {
    width: 1200px !important;
}
}
.logo-div{
	margin-top:-10px;
	padding-left: 10px;
	padding-right: 10px;
	/* background-color: #ffffff; */
}
.logo[name="ebpls"]
{
	background:url('../images/logo/4 eLGU-IBPLS light 2.png') center no-repeat;
	background-size:contain;
	width:100px;
	height:40px;
	
}
.logo[name="icto"]
{
	background:url('../images/logo/icto-white.png') left top no-repeat;
	background-size:contain;
	margin-right:-70px;
	width:100px;
	height:40px;
	margin-top:-10px;
	
	
}
.logo.colored 
{
	background:url('../images/logo/EBPLS-colored.png') center no-repeat;
	background-size:contain;
	width:100px;
	height:40px;
	margin-top:-10px;
	
}
#page.adjust
{
	margin-top:210px;
}
/*
.grid-view table.items tr.selected td
{
	background: #CCE6FF;
	font-weight:bold;
	border-top:3px solid #8AB8E6;
	border-bottom:3px solid #8AB8E6;
	-webkit-transition:background 1s; 
	-moz-transition:background 1s;
	transition:background 1s;
}
*/

.modal-backdrop
{
	z-index:1030;
}

.right+ul.dropdown-menu,.navbar .right>.dropdown>ul.dropdown-menu
{
	left:auto !important;
	right:0 !important;
}


/* Footer
-------------------------------------------------- */

.footer {
	bottom:0;
    padding: 10px 15px;
    margin-top: 20px;
    border-top: 1px solid #e5e5e5;
    background-color: #555555;
	opacity:0.8;
}
.footer p {
    margin: 0;
	margin-left:5px;
	padding:1px;
    color: #ffffff;
	font-size:12px;
}
.footer-links {
    margin: 10px 0;
}
.footer-links li {
    display: inline;
    margin-right: 10px;
}

/* TILE CHECKBOX
------------------------------------------------- */
.tile-checkbox
{
	margin-top:20px;
	display:block;
	margin-bottom:50px;
}

.tile-checkbox > label
{
	float:left;
	margin:0px;
	margin-right:5px;
	width:25%;
	cursor:pointer;
	font-weight:normal !important;
	margin-bottom:10px;
}

.tile-checkbox > label:first-child
{
	margin-top:-5px;
}

/*--------------------- TRANSPARENT NAVBAR -----------------------*/


.bannerContainer
{
	position:absolute;
	height:200px;
	width:100%;
	top:0;
	left:0;
	display:block;
	overflow:hidden;
}

@media (max-width: 700px){
	.bannerContainer
	{
		display:none;
	}
	#page.adjust
	{
		margin-top:50px
	}
}
@media (min-width: 768px){
.navbar.navbar-transparent 
{
	background:transparent;
	border-color:transparent;
}

.navbar-transparent .navbar-nav > .active > a, .navbar-inverse .navbar-nav > .active > a:hover, .navbar-inverse .navbar-nav > .active > a:focus {
  color: #ffffff;
  background-color: rgba(0,0,0,0.3) !important;
  box-shadow:inset 0px 0px 30px rgba(0,0,0,0.3);
}


.navbar-inverse
{
	-webkit-transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
}
}

/* TB COLLAPSE TWEAK */

.panel-heading-mod {

	color: #fff;
	background-color: #2780e3;
	border-color: #2780e3;
	padding: 10px 15px;
}

@media print {
* {-webkit-print-color-adjust: exact !important;}
}



/*strike*/
.strike {
    display: block;
    text-align: left;
	margin-left: 20px;
    overflow: hidden;
    white-space: nowrap;
    font-weight: bold;
	margin: -10px 0 10px 0;
}

.strike > span {
    position: relative;
    display: inline-block;
}

.strike > span:before,
.strike > span:after {
    content: "";
    position: absolute;
    top: 50%;
    width: 9999px;
    height: 1px;
    background: #e6e6e6;
}

.strike > span:before {
    right: 100%;
    margin-right: 15px;
}

.strike > span:after {
    left: 100%;
    margin-left: 15px;
}

/* tabs placement */
.tabs-below > .nav-tabs,
.tabs-right > .nav-tabs,
.tabs-left > .nav-tabs {
  border-bottom: 0;
}

.tab-content > .tab-pane,
.pill-content > .pill-pane {
  display: none;
}

.tab-content > .active,
.pill-content > .active {
  display: block;
}

.tabs-below > .nav-tabs {
  border-top: 1px solid #ddd;
}

.tabs-below > .nav-tabs > li {
  margin-top: -1px;
  margin-bottom: 0;
}

.tabs-below > .nav-tabs > li > a {
  -webkit-border-radius: 0 0 4px 4px;
     -moz-border-radius: 0 0 4px 4px;
          border-radius: 0 0 4px 4px;
}

.tabs-below > .nav-tabs > li > a:hover,
.tabs-below > .nav-tabs > li > a:focus {
  border-top-color: #ddd;
  border-bottom-color: transparent;
}

.tabs-below > .nav-tabs > .active > a,
.tabs-below > .nav-tabs > .active > a:hover,
.tabs-below > .nav-tabs > .active > a:focus {
  border-color: transparent #ddd #ddd #ddd;
}

.tabs-left > .nav-tabs > li,
.tabs-right > .nav-tabs > li {
  float: none;
}

.tabs-left > .nav-tabs > li > a,
.tabs-right > .nav-tabs > li > a {
  min-width: 74px;
  margin-right: 0;
  margin-bottom: 3px;
}

.tabs-left > .nav-tabs {
  float: left;
  margin-right: -1px;
  border-right: 1px solid #ddd;
}

.tabs-left > .nav-tabs > li > a {
  margin-right: -1px;
  -webkit-border-radius: 4px 0 0 4px;
     -moz-border-radius: 4px 0 0 4px;
          border-radius: 4px 0 0 4px;
}

.tabs-left > .nav-tabs > li > a:hover,
.tabs-left > .nav-tabs > li > a:focus {
  border-color: #eeeeee #dddddd #eeeeee #eeeeee;
}

.tabs-left > .nav-tabs .active > a,
.tabs-left > .nav-tabs .active > a:hover,
.tabs-left > .nav-tabs .active > a:focus {
  border-color: #ddd transparent #ddd #ddd;
  *border-right-color: #ffffff;
}

.tabs-right > .nav-tabs {
  float: right;
  margin-left: 19px;
  border-left: 1px solid #ddd;
}

.tabs-right > .nav-tabs > li > a {
  margin-left: -1px;
  -webkit-border-radius: 0 4px 4px 0;
     -moz-border-radius: 0 4px 4px 0;
          border-radius: 0 4px 4px 0;
}

.tabs-right > .nav-tabs > li > a:hover,
.tabs-right > .nav-tabs > li > a:focus {
  border-color: #eeeeee #eeeeee #eeeeee #dddddd;
}

.tabs-right > .nav-tabs .active > a,
.tabs-right > .nav-tabs .active > a:hover,
.tabs-right > .nav-tabs .active > a:focus {
  border-color: #ddd #ddd #ddd transparent;
  *border-left-color: #ffffff;
}


/** Additional CSS: Boostrap4 **/
.w-100 { width: 100% !important; }
.w-50 { width: 50% !important; }
/** FLEXBOX **/
.d-flex { display: flex !important; }
.d-none { display: none !important; }
.flex-nowrap { flex-wrap: nowrap !important; }
.flex-wrap { flex-wrap: wrap !important; }
.flex-column { flex-direction: column !important; }
.flex-row-reverse { flex-direction: row-reverse !important; }
.justify-content-between { justify-content: space-between !important; }
.justify-content-around { justify-content: space-around !important; }
.justify-content-start { justify-content: flex-start !important; }
.justify-content-end { justify-content: flex-end !important; }
.align-items-center { align-items: center !important; }
.align-items-end { align-items: flex-end !important; }
.align-items-start { align-items: flex-start !important; }

/** Borders and Margins **/
.border { border: 1pt solid windowtext !important; }
.border-none { border: none !important; }
.border-top { border-top: 1pt solid windowtext !important; }
.border-right { border-right: 1pt solid windowtext !important; }
.border-bottom { border-bottom: 1pt solid windowtext !important; }
.border-left { border-left: 1pt solid windowtext !important; }

.border-top-0 { border-top: 0pt !important; }
.border-bottom-0 { border-bottom: 0pt !important; }
.border-right-0 { border-right: 0pt !important; }
.border-left-0 { border-left: 0pt !important; }

.m-0 { margin: 0 !important; }

/** Text Wrap and Styles **/
.font-weight-bold { font-weight: bold !important; }