/* Normal desktop :992px. */

@media (max-width: 1920px) {

	.custom.tp-bullets {position:absolute; left:9% !important;}

}

@media (max-width: 1280px) {

	#manu:before{width: 39%;}

	.slider .text33:after{height:80px; top: -16%;}

	.frm-single1 .inside{padding: 90px 20px; z-index: 0;}

	.frm-single1{margin: 80px auto 80px;}

}

@media (min-width: 992px) and (max-width: 1200px) {

    .bg-why ul li{border-right:none; width:50%;}

	.navbar ul li{border-right: none;

    box-shadow: none; margin-bottom:5px;}

	.img-custom-1{margin-left: -79px;}

	#welcome .wel-img .wel01{width: 65%;}

	#welcome .wel-img .wel02{width: 65%;}

	.navbar-brand>img {margin-top: 15px !important; margin-bottom: 15px;}

	.navbar-default .navbar-nav>li>a{text-align: left;}

	.navbar-brand{float:none;}

	/*.main_manu{padding-top: 25px;}*/

	.main_manu{top:0;}

	#manu:before {width: 45%;}

	.dropdown-menu {position:static; float:none; border:none;}

	.dropdown-menu>li>a {padding:14px 53px;}

	.dropdown-submenu>.dropdown-menu li {padding:16px 0 0 15px; border-bottom:0;}



}

/* Tablet desktop :768px. */

@media (min-width: 768px) and (max-width: 991px) {   

	#copy .copy {text-align: center;}

	#copy .copy-left {float: none; text-align: center;}

	#copy .copy-right {float: none; text-align:center;}

	#header{ text-align:center;}

	.bg-why ul li{border-right:none; width:50%;}

	.navbar ul li{border-right: none;

    box-shadow: none; margin-bottom:5px;}

	.img-custom-1{margin-left: -117px;}

	#welcome .wel-img .wel01{width: 57%;}

	#welcome .wel-img .wel02{width: 57%;}

	.navbar-brand>img {margin-top: 15px !important; margin-bottom: 15px;}

	.navbar-default .navbar-nav>li>a{text-align: left;}

	.navbar-brand{float:none;}

	/*.main_manu{padding-top: 25px;}*/

	.main_manu{top:0;}

	div.tab img{display:none;}

	#manu:before {width: 54%;}

}

/* small mobile :320px. */

@media (max-width: 767px) {  

	#copy .copy {text-align: center;}

	#copy .copy-left {float: none; text-align: center;}

	#copy .copy-right {float: none; text-align:center;}

	#header{ text-align:center;} 

    .bg-why ul li{border-right:none; width:50%;}

	.navbar ul li{border-right: none;

    box-shadow: none;}

	#welcome .wel-img .wel01{width: 57%;}

	#welcome .wel-img .wel02{width: 57%;}

	.navbar-brand>img {margin-top: 15px !important; margin-bottom: 15px;}

	.navbar-default .navbar-nav>li>a{text-align: left;}

	.navbar-brand{float:none;}

	/*.main_manu{padding-top: 25px;}*/

	.main_manu{top:0;}

	div.tab img{display:none;}

	.material-purchase .modal01{left:0;}

	/*.table-purchase img{display:none;}	*/

	.vertical-left-right{display:block;width:100%;height:100%;}

	.manu-left li{display:none !important;}

}

/* Large Mobile :480px. */

@media only screen and (min-width: 480px) and (max-width: 767px) {

	#copy .copy {text-align: center;}

	#copy .copy-left {float: none; text-align: center;}

	#copy .copy-right {float: none; text-align:center;}

	#header{ text-align:center;}

	.bg-why ul li{border-right:none; width:100%;}

	.navbar ul li{border-right: none;

    box-shadow: none;margin-bottom: 5px;}

	#welcome .wel-img .wel01{width: 57%;}

	#welcome .wel-img .wel02{width: 57%;}

	#welcome .wel-img{margin-bottom: 56px;}

	.navbar-brand>img {margin-top: 15px !important; margin-bottom: 15px;}

	.navbar-default .navbar-nav>li>a{text-align: left;}

	.navbar-brand{float:none;}

	/*.main_manu{padding-top: 25px;}*/

	#manu:before{width:100%; border:none;}

	.main_manu{top:0;}

	div.tab img{display:none;}

	.manu-left{}

}

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

	#footer .social ul {padding: 10px 0px 40px 0px;}

	#copy .copy { text-align: center;}

	#copy .copy-left {float: none; text-align: center;}

	#copy .copy-right {float: none; text-align:center;}

	.bg-why ul li{border-right:none; width:100%;}

	.navbar ul li{border-right: none;

    box-shadow: none; margin-bottom: 5px;}

	#welcome .wel-img .wel01{width: 65%;}

	#welcome .wel-img .wel02{width: 65%;}

	#welcome .wel-img{margin-bottom: 56px;}

	.navbar-brand>img {margin-top: 15px !important;	max-width: 75%;margin-bottom: 15px;}

	.navbar-default .navbar-nav>li>a{text-align: left;}

	.navbar-brand{float:none;}

	/*.main_manu{padding-top: 25px;}*/

	#manu:before{width:100%; border:none;}

	.main_manu{top:0;}

	div.tab img{display:none;}





	.social{

		display: none;

	}

	

}





/*NEW*/









/*

	Max width before this PARTICULAR table gets nasty. This query will take effect for any screen smaller than 760px and also iPads specifically.

	*/

	@media

	  only screen 

    and (max-width: 760px), (min-device-width: 768px) 

    and (max-device-width: 1024px)  {



		/* Force table to not be like tables anymore */

		.table-purchase table, .table-purchase thead, .table-purchase tbody, .table-purchase th, .table-purchase td, .table-purchase tr {

			display: block;

		}



		/* Hide table headers (but not display: none;, for accessibility) */

		.table-purchase thead tr {

			position: absolute;

			top: -9999px;

			left: -9999px;

		}



    .table-purchase tr {

      margin: 10px 5px;

      box-shadow: 0px 0px 10px 1px #0003;

    }

      

    

    

		.table-purchase td {

			/* Behave  like a "row" */

			border: none;

			border-bottom: 1px solid #eee;

			position: relative;

			padding-left: 50%;

		}



		.table-purchase td:before {

			/* Now like a table header */

			position: absolute;

			/* Top/left values mimic padding */

			top: 15px;

			text-align: left;

			left: 10px;

			width: 45%;

			padding-right: 10px;

			white-space: nowrap;

		}

		.table-purchase .table>tbody>tr>td{text-align:right;}

		.table-purchase .center-block{margin-right: 0;}

		.table-purchase input {  max-width: 30px;}

		/*

		Label the data

    You could also use a data-* attribute and content for this. That way "bloats" the HTML, this way means you need to keep HTML and CSS in sync. Lea Verou has a clever way to handle with text-shadow.

		*/

		.table-purchase td:nth-of-type(1):before { content: "PRODUCT ID"; }

		.table-purchase td:nth-of-type(2):before { content: "PRODUCT IMAGE"; }

		.table-purchase td:nth-of-type(3):before { content: "PRODUCTS NAME"; }

		.table-purchase td:nth-of-type(4):before { content: "UNIT"; }

		.table-purchase td:nth-of-type(5):before { content: "RATE"; }

		.table-purchase td:nth-of-type(6):before { content: "QTY"; }

		.table-purchase td:nth-of-type(7):before { content: "TOTAL AMOUNT"; }

		.table-purchase td:nth-of-type(8):before { content: ""; }

	}