@media only screen and (min-width: 1920px) {
	.dark-bg{width: 38%;}
}
@media only screen and (min-width: 1440px) {
	.container {max-width: 1400px; }
}
@media only screen and (max-width: 1599px) {
	#nav li a {
		padding: 5px 12px;
		font-size: 12px;
	}


	.dashboard-boxes-content a {
		font-size:60px;
	}
	.dashboard-boxes-content span {
		font-size: 14px; min-height:auto;
	}
	.dashboard-boxes { padding:15px;
	}

	.dashboard-boxes-content a {
		font-size: 50px;
	}
}
@media only screen and (max-width: 1439px) {
	.bg-login:before{margin-left: 180px;}

	table td,
	table th {
		font-size: 14px;
	}
	.formWrapperCard {
		padding: 25px 10px;
	}

	.dashboard-boxes-content a {
		font-size:40px; margin:0px; line-height:1.2;
	}
	.my-35 {
		margin-top: 15px;
		margin-bottom: 15px;
	}
	.dashboard-title { font-size:24px;
	 }
	.dashboard-tab .nav-link { font-size:16px;
	}
	.purple .dashboard-title-2 { margin:0px;}
	.dashboard-tab .nav-link { padding-bottom:10px;
	}
	.btn-map {
		font-size:13px;
	}
	.form-group {
		margin-bottom: 10px;
	}
	.searchPanel, .profilePanel {
		padding:15px;
	}
	.dashboard-wrapper th, .dashboard-wrapper td {
		padding: 3px 10px !important;
	}
	.formWrapperCard .innerTitle h3 {
		margin:0px;
	}
	.formWrapperCard {
		padding:0px;
	}
	.dashboard-boxes-content a {
		font-size:30px;
	}
}
@media only screen and (max-width: 1279px) {
	.bg-login:before{margin-left: 160px;}
	#nav li a {
		font-size:11px;
	}
	}

@media only screen and ( max-width:1199px) {
.lg-mt-2 {
		margin-top: 2rem;
	}
}

@media only screen and (max-width: 1169px) {
    .bg-banner {background-size: cover}
    .title1{font-size: 42px;}
    .title2{font-size: 28px;}
    .dark-bg{width: 37%;}
}

@media only screen and (max-width: 1024px) {
	.titleBlock{width: 55%;margin: 90px 0;}
	#nav li a {
		padding:5px 10px;
	}
	.ppLogo {
	max-width:180px;
	}
	.dghLogo {
	max-width:220px;
	}
	.mopngLogo {
		max-width: 90px;
	}
	#nav li a {
		padding: 5px;
		font-size: 11px;
	}
	.dashboard-tab .nav-link {
	margin-right:20px;
	}
	.chart-box.purple {
	margin-bottom:20px;
	}
	.dataTables_scroll {
		padding-top: 25px;
		background: url(../images/swipeIconGray.png) top right no-repeat;
	}
	div.dataTables_wrapper div.dataTables_info {
	text-align:center;
	}
	div.dataTables_wrapper div.dataTables_paginate ul.pagination {
	justify-content:center;
	}
	.d-flex.dboxspace {
	display:block!important;
	}
	.dashboard-boxes {
	display:inline-block;
	width:47.5%;
	margin:1.5%;
	margin-right:0;
	}
}



@media only screen and (max-width: 992px) {
.dataTables_wrapper div.dt-buttons {	position:static; }

	.bg-banner {
		height: 100%;
	}
	.bg-login:before{display: none;}
	.loginBox{background: rgba(0, 0, 0, 0.5);}
	.title1{font-size: 32px;}
    .title2{font-size: 20px;}
	
	.bg-login{height: auto;}
	.loginBox{margin-bottom: 20px;}
	.captcha{padding-right: 110px;}
	.captcha .captchaImg{right: 10px;}
	.captcha .fa{right: 0;}
	.mopngLogo {
		display: none;
	}
}

@media only screen and (min-width: 801px) {
	#nav ul {
		display: block !important;
	}
}
@media only screen and (max-width: 800px) {
/*Navigation*/
#nav {
	display: none;
	position: absolute;
	left: 0;
	right: 0;
	background: #073e74;
}

#nav ul {
background: #305d93;
}

.toggleMenu, #nav .menuIcon {
display: block;
}

#nav li {
float: none;
display: block;
border: none;
}

#nav li a {
	border-top: 1px solid #002d63
}

#nav li.parent {
	position: relative;
}

#nav li .menuIcon, #nav li li .menuIcon {
	width: 46px;
	height: auto;
	background-color: #002d63;
	background-color: rgba(0, 45, 99, 0.5);
	background-image: url(../images/down-arrow.gif);
	background-repeat: no-repeat;
	background-position: center 15px;
	position: absolute;
	right: 0;
	top: 0;
	bottom: 0;
	cursor: pointer;
}

	#nav li .menuIcon.active, #nav li li .menuIcon.active {
		background-color: #002d63;
		background-color: rgba(1, 36, 78, 0.5);
	}

#nav li > a:hover, #nav li.hover > a, #nav li.active > a, #nav li ul li a:hover, #nav li ul li > a.selected, #nav ul a:hover, .noJS #nav ul a:focus, #nav ul a.selected, #nav > li > a:hover, #nav > li.hover > a, #nav > li.focus > a {
	background-color: #002d63;
	color: #fff;
}

#nav ul {
width: 100%;
display: none;
position: static;
transition: none;
-webkit-transition: none;
}

.hasJS #nav ul {
	opacity: 1;
}

#nav li ul li, #nav ul a {
	width: 100%
}

#nav > li:hover > ul, #nav li li:hover > ul, #nav li li li:hover > ul {
	display: none;
}

#nav ul, #nav *:hover ul ul, #nav .hover ul ul, #nav .focus ul ul {
	margin-left: 0;
}

#nav li a {
	padding-left: 15px;
	padding-right: 15px;
	display: block;
	line-height: 30px;
	font-size: 14px;
}

#nav li ul li a {
	padding: 7px 55px 7px 25px;
	display: block;
	line-height: 21px;
	background: url(../images/right-arrow.gif) no-repeat 15px 15px;
	color: #fff;
	border: none
}

#nav li ul li ul li a {
	padding-left: 45px;
	background-position: 33px center
}

#nav li ul li ul li ul li a {
	padding-left: 60px;
	background-position: 45px center
}

#nav > li > a:hover, #nav > li.hover > a, #nav > li.focus > a, #nav > .highlight > a {
	background-color: #305d93;
	color: #fff;
}

#nav li ul li a:hover, #nav li ul li > a.selected, #nav ul a:hover, .noJS #nav ul a:focus, #nav ul a.selected, #nav ul > .highlight > a {
	background-color: #305d93;
	color: #fff;
}


	.logo {
	width:100%; text-align:center;
	}
	.top-header .topMenu {
		flex-direction:inherit;
	}
	.top-header .topMenu.d-flex, .d-flex {
		display: inherit !important;
	}
		.top-header .topMenu .topMenuitem.user .nav-link, .top-header .img-profile, .top-header .topMenu .topMenuitem.user .nav-link span, .top-header .topMenu .topMenuitem.user .nav-link i {
			display: inline-block;
		}
		.top-header .topMenu li, .top-header .topMenu li .nav-link {
			display: inline-block;
		}
	.mainMenu ul li a {
		text-align: left;
	}
	.dashboard-boxes {
		margin-right: 0;
		margin-bottom: 20px;
	}
	.topMenu {
	float:right;	
	}
	.top-header .img-profile {
		margin-bottom: 10px;
	}
	.col-md-9, .col-md-3 {
	width:100%; flex:inherit; max-width:100%; text-align:center!important;
	}
	.secondaryBtn {
		/*height:35px;*/
		display: inline-block;
	}
	.dropdown-toggle::after {
	display:none;
	}


	/*Responsive Table*/
	.responsiveTable, .responsiveTable tr, .responsiveTable td, .responsiveTable td:before {
		display: block;
		text-align: left;
		border: none; /* Converts a table, table row, table column and table column:before into a block element */
	}

		.responsiveTable, .responsiveTable tr, .responsiveTable td:last-child {
			border-bottom: none;
		}

			.responsiveTable thead, .responsiveTable tr th {
				position: absolute; /* Hides table head but not using display none */
				top: -1000em;
				left: -1000em;
			}

			.responsiveTable tr {
				border: 1px solid #eeeeee;
				border-bottom: 2px solid #eeeeee;
				margin: 0 0 20px;
			}

				.responsiveTable tr td:nth-child(1) { /* first column of the row */
					border-left: none;
				}

				.responsiveTable tr td:last-child { /* last column of the row */
					border-right: none;
				}

				.responsiveTable tr:last-child .td, .responsiveTable td { /* Column in the last row and column */
					border-bottom: 1px solid #eeeeee;
				}

					.responsiveTable td:before { /* prints the value of data-label attribute before the column data */
						font-weight: bold;
						padding-right: 20px;
						line-height: 27px;
						color: #174471;
						content: " "attr(data-label)""; /* call the attribute value of data-label and adds a string // */
					}

			.responsiveTable tbody {
				display: block;
			}

			.responsiveTable tr td {
				padding: 5px 15px;
				width: auto !important;
			}
}


	@media only screen and (device-width : 768px) {
		.titleBlock {
			width: 70%;
			margin: 50px 0;
		}
	}

	@media only screen and (max-width: 767px) {
		.sm-mt-2 { margin-top:2rem;
		}
		.dataTables_wrapper div.dt-buttons {
			text-align: center
		}
		.bg-banner:before {
			background: rgba(0,0,0,0.3);
			position: absolute;
			content: "";
			bottom: 0;
			height: 100%;
			width: 100%;
		}

		.titleBlock {
			width: 100%;
			margin: 50px 0;
		}

		.interPlatform {
			padding: 10px 10px 20px 10px;
		}

			.interPlatform h2 {
				font-size: 15px;
			}

			.interPlatform img {
				margin-top: 10px;
			}

		.innerLogo {
			display: block;
			text-align: center;
		}

			.innerLogo h2 {
				font-size: 15px;
			}

			.innerLogo .petroLogo {
				margin-bottom: 20px;
			}

			.innerLogo .dghInnerLogo {
				margin-top: 20px;
				margin-bottom: 10px;
			}

		.title1 {
			font-size: 22px;
		}

		.title2 {
			font-size: 16px;
		}
	}

	@media only screen and (max-width: 576px) {
		.xs-m-0 { margin:0px!important;
		}
		.searchBtns { width:100%;
		}
		.btnsGroup .primaryBtn {
			margin: 2px 0;
		}
		.titleBlock {
			margin: 30px 0;
		}

		.innerLogo h2 {
			font-size: 16px;
		}
		.dghLogo, .mopngLogo {
		padding-left:0; margin-left:0; border:none;
		}
		
		.statusBtn {
		overflow-y:hidden;
		overflow-x:scroll;
		}
		.chart-box {
			margin-bottom:20px;
		}
		.dghLogo, .mopngLogo, .ppLogo {
			max-width: 100%;
			margin-bottom: 5px;
		}
		.page-item.active .page-link {
		z-index:0;
		}
		.loginFormWrapMain, .formWrapperCard {
			width: 100%;
			max-width: 100%;
		}
	   .LoginPageformSection {
			padding: 0;
		}
		.loginLogo {
		padding:10px;
		}
		.loginPage a {
		text-align:center;
		}
		.dashboard-boxes {
			width: 100%;
			margin-left: 0;
			margin-right: 0;
		}
		.secondaryBtn, .primaryBtns, .blueBtn, .greyBtn, button.dt-button, div.dt-button, a.dt-button, .form-group table input[value="Add New"], .primaryBtn {
			width: 100%;
			text-align: center;
			margin: 5px 0;
		}
		.secondaryBtn {
			display:block;
		}
		.spaceTL5 {
			margin-left: 0;
		}
		body {
		margin-bottom:10px;
		}
		.searchForm .searchBtns, .formWrapperCard input {
			width: 100%;
		}
		.scrollGrid {
			padding-top: 25px;
			background: url(../images/swipeIconGray.png) top right no-repeat;
			overflow-x:scroll;
			overflow-y:hidden;
			width:100%;
			max-width:350px;
		}
		.primaryBtn.ml-3 {
		margin-left:0!important;
		}
	}

	@media only screen and (max-width: 360px) {
	}