@media only screen and (min-width:1003px) and (max-width:1024px){

}

@media only screen and (min-width:768px) and (max-width:1002px)
{
	.width{ width:100%;}
	#wrapper{ width:100%; position:relative; box-shadow:0 0 10px 10px rgba(0,0,0,.2); z-index:10; background:#edf3fa;}
	#top-menu{ display:none;}
	#main-menu{ display:none;}
	#product-menu{ display:none;}
	#mobile-menu { display:block;}
	#mobile-menu-icon { display:block;}

	#public-notice{ height:auto;}
	#notice-board{ width:100%;}
	.notice-btn{ float:none; clear:both; margin:10px 0 0 0; display:inline-block;}
	.tickercontainer .mask{ width:100%;}

	#banner .bx-wrapper .bx-pager{ width:100%;}

	#header{ height:auto;}
	#header .width{ padding-top:0; height:auto;}
	#header #logo {margin: 10px 0; width: 110px;}
	#header #logo img {height: auto; width: 100%;}
	#header div.cf{ display:none;}
	#language {clear: none;margin-top: 35px;text-align: right;}
	#language ul {margin: 0 10px 0 0;}
	#helpline {margin-right: 20px;margin-top: 20px;}
	#make-in-india {right:100px;}

	#blocks .col{ width:28%;}
	#blocks .col.two{ width:38%;}
	#blocks .col.two .png-coverage{ height:100px;}
	#blocks .col img{ width:100%;}

	#content{ width:68%;}
	#content .product-info img{margin: 0 2% 2% 0;max-width: 35%;}
	#content .product-info .info{ margin:0;}
	#sidebar{ width:27%;}

	#quick-links{ position:relative; width:100%; margin:20px 0; top:0; }
	#quick-links ul{ position:relative; width:100%; right:0;}
	#quick-links ul li{ width:32%; float:left; margin-bottom:2%; margin-right:2%; }
	#quick-links ul li:nth-child(3n){ margin-right:0;}
	#quick-links ul li a{ font-size:85%;}

	#banner {background-color: #fff;}
	#slider{ height:300px;}
	#slider li{ height:300px; background-size:cover;}


	#page #quick-links ul li{ width:100%; float:none; margin-bottom:5px; margin-right:0; }
	#page #quick-links ul li:nth-child(3n){  margin-bottom:5px; margin-right:0; }

	.state-list .listing{ width:32.6%; margin-left:1%; }

	.gallery li{ width:32%; margin:0 2% 2% 0 !important; height:auto;}
	.gallery li.last{ margin:0 0 2% 0 !important;}

	#contact-us .block{ float:none;  width:100%; margin:0 0 20px 0 !important; padding:0; border-bottom:1px solid #cdd4dc;}
	#contact-us .block h2{ border-bottom:none; }

	form .control .cust-no,form .control .app-no{ width:44.5% !important;}

	#footer {text-align: center;}
	#footer #top .width div { float: none; padding: 20px 0;}
	#footer #top #bottom-menu {float: none;padding: 0 0 20px;}
	#footer #top ul { display: inline-block; float: none;list-style-type: none; margin: 0; padding: 0;}

        /*#edb{position: absolute; width: auto; right: 210px;}*/
        #gas4india{right: 100px;}

}

@media only screen and (max-width:767px)
{
	#wrapper{ width:100%; position:relative; box-shadow:0 0 10px 10px rgba(0,0,0,.2); z-index:10; background:#edf3fa;}
	#top-menu{ display:none;}
	#main-menu{ display:none;}
	#product-menu{ display:none;}
	#mobile-menu { display:block;}
	#mobile-menu-icon { display:block; margin-top:15px;}
	#notice-board{ width:100%; margin-bottom:20px;}

	.width{ width:100%;}
	#header{ height:auto;}
	#header .width{ padding-top:0; height:auto; }
	#header div.cf{ display:none;}
	#header #logo{ margin:10px 0; width:140px;}
	#header #logo img{ width:auto; height:60px;}

	#helpline .number span.title { margin-bottom: 0; }
	#helpline .number a.tel { font-size: 90%; }

	#language{ clear: none; text-align:right; margin-top:35px;}
	#language ul{ margin:0 10px 0 0;}

	#banner { background-color:#fff;}
	#banner #slider,.bx-wrapper .bx-viewport{display:none;}
	#banner .bx-wrapper .bx-pager{ display:none;}

	#quick-links{ position:relative; width:100%; margin:20px 0; top:0; }
	#quick-links ul{ position:relative; width:100%; right:0;}


	#public-notice{ height:auto; padding:20px 0;}
	#public-notice .notice{ padding:0;}
	.notice-btn{ float:none; clear:both; margin:0 auto; display:block; max-width:260px; }
	#public-notice .notice marquee{ float:none; width:100%; }

	#blocks{ text-align:center; padding-bottom:0;}
	#blocks .col{ width:280px; overflow:hidden; margin:0 0 20px 0; float:none; display:inline-block; vertical-align:top;}
	#blocks .col.one { margin:0 0 20px 0;}
	#blocks .col.two{ margin:0 0 20px 0;}
	#blocks .col.two .png-coverage{ margin:0 0 20px 0; background-size:cover; height:137px; }
	#blocks .col img{ width:100%;}
	#blocks .col.two .png-coverage form{ width:280px; margin:0 auto;}

	#content{ width:100%; overflow-x:scroll; }
	#content .product-info img{margin: 0 2% 2% 0;max-width: 35%; float:left;}
	#content .product-info .info{ margin:0; float:none;}
	#sidebar{ display:none;}

	.state-list .listing{ width:100%; float:none; margin:0 0 20px 0;}

	.circle{ margin:20px;}

	.gallery li,.gallery li.last{ margin:0 20px 20px 0 !important}

	#page{ padding:0;}

	#contact-us .block{ float:none;  width:100%; margin:0 0 20px 0 !important; padding:0; border-bottom:1px solid #cdd4dc;}
	#contact-us .block h2{ border-bottom:none; }

	#sitemap .block{ float:none; width:100%; margin:0;}

	form .control .cust-no{ width:100% !important;}
	form .control .app-no{ width:100% !important; margin-top:10px;}

	#footer #top,footer #bottom{ text-align:center;}
	#footer #top .width div{ padding:20px 0; float:none;}
	#footer #top #bottom-menu{ float:none; padding:0 0 20px 0;}
	#footer #top ul{ float:none;}
	#footer #top ul li{ float:none; display:inline-block; vertical-align:top;}
	#footer #bottom #copyright{ float:none;}
	#footer #bottom #credits{ float:none; padding:10px 0 0 0;}

	#form-outer .left{ float:none; width:100%; border:none;}
	#form-outer .right{ float:none; width:100%; }
        #gas4india{right: 90px;}

}

@media only screen and (min-width:320px) and (max-width:639px)
{
	#helpline{ float: none; background-color:#fff; border-bottom:1px solid #eee;}
	#helpline .number { padding: 5px 15px; background:none;}
	#helpline .number span.title { display: inline-block; margin-right:10px; }
	#helpline .number a.tel { display: inline-block; }

	#footer #top .width div #last-updated{ border:none; padding:0; margin:10px 0 0 0; }
	#footer #top .width div span label{ display:block; margin:0;}
	#footer #bottom #copyright #rights{ margin-left:0;}
	#footer #bottom #copyright span{ display:block; margin:0;}
}


@media only screen and (min-width:480px) and (max-width:639px)
{
	#quick-links ul li{ width:49%; float:left; margin-bottom:2%; margin-right:2%; }
	#quick-links ul li:nth-child(2n){ margin-right:0;}

	#footer #top .width div #last-updated{ border:none; padding:0; margin:10px 0 0 0; display:block;}
}

@media only screen and (min-width:640px) and (max-width:767px)
{
	#make-in-india {right:90px;}
	#helpline { margin-top: 20px; margin-right: 20px; }

	#quick-links ul li{ width:32%; float:left; margin-bottom:2%; margin-right:2%; }
	#quick-links ul li:nth-child(3n){ margin-right:0;}
}

@media only screen and (min-width:320px) and (max-width:480px)
{
	#make-in-india {right:90px;}
	.msg { width: 100%; height: auto; background-size: cover; }
	#content .product-info{ text-align:center;}
	#content .product-info img{margin: 0 2% 2% 0;max-width: 100%; float:none;}
	#content .product-info .info{ margin:0; float:none; text-align:left;}

	.tabs li{ margin-right:4px; width:30%;}
	.tabs li a{ font-size:80%; padding:8px 0; text-align:center; font-weight:400;}

	#content .news{ text-align:center;}
	#content .news .image{ float:none; display:inline-block; margin-bottom:10px;}
	#content .news .details{ margin:0; text-align:left;}

	.gallery{ text-align:center;}
	.gallery li{ margin:0 0 20px 0 !important; height:100px; width:200px; float:none; display:inline-block; vertical-align:top;}

	.pic-left,.pic-right{ float:none; display:block; margin:0 auto 10px;}

	#public-notice{ padding:0;}
	#public-notice .notice{ padding:15px 0; }

	form .control{ margin-bottom:0;}
	form .row .cell.first{ display:block; width:100%; text-align:left; padding:0; }
	form .row .cell.last{ display:block; width:100%;}

	.table.style1{ margin-bottom:10px;}
	.table.style1 .row .cell{ width:100%; display:block; margin-bottom:10px;}
	.table.style1 .row .cell.sep{ display:none;}

        #cng-stations, #route-detail-container {height: 220px; overflow: auto;}
}