/* large Desktops and laptops ----------- */
@media only screen and (min-width: 1400px) and (max-width: 3000px) {
	.container {
		max-width: 1320px
	}

	.bgnone {
		display: none;
	}
	.footermenu{
		display: none;
	}
}

/* Desktops and laptops  */
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
	.container {
		max-width: 95%;
	}

	.bgnone {
		display: none;
	}
	.footermenu{
		display: none;
	}
}

/* TABLETS (portrait and landscape) */
@media only screen and (min-width: 992px) and (max-width: 1199px) {
	.container {
		max-width: 95%;
	}

	.bgnone {
		display: none;
	}

	.viewCart {
		row-gap: 30px;
		flex-direction: column;
	}

	.viewCart .left {
		width: 100%;
	}

	.viewCart .right {
		width: 100%;
	}

	.products,
	.newStock .newStockProduct,
	.priceDown .priceDownProduct {
		gap: 2%;
		justify-content: flex-start;
	}

	.cars {
		justify-content: flex-start;
	}

	.cars .singleProduct {
		width: calc(24% - 20px);
	}

	.newStock .singleProduct {
		width: calc(23% - 20px);
	}

	.products .singleProduct {
		width: calc(18% - 20px);
	}

	.priceDown .singleProduct {
		width: calc(23% - 20px);
		padding: 10px;
		border-radius: 10px;
		transition: 0.5s all ease;
		border: 1px solid transparent;
	}

	.checkoutDetails {
		row-gap: 20px;
		flex-direction: column;
		
	}
	.checkoutDetails .left ,
	.checkoutDetails .right {
		width: 100%;
	}
	.footermenu{
		display: none;
	}

}

/* TABLETS - SMARTPHONES LANDSCAPE (portrait and landscape)  */
@media only screen and (min-width: 768px) and (max-width: 991px) {
	.container {
		max-width: 95%;
	}

	.column {
		flex-direction: column;
	}

	.full {
		width: 100% !important;
	}

	.viewCart {
		row-gap: 30px;
		flex-direction: column;
	}

	.viewCart .left {
		width: 100%;
	}

	.viewCart .right {
		width: 100%;
	}

	.dnone960 {
		display: none !important;
	}

	nav .logo {
		order: 2;
	}

	nav .logo a img {
		width: 60px;
	}

	nav .menu {
		position: fixed;
		background: #fff;
		width: calc(75% - 30px);
		height: calc(100vh - 30px);
		height: 100vh;
		left: 0;
		top: 0;
		z-index: 4;
		padding: 15px;
		transform: rotateY(90deg);
		transform-origin: left;
		transition: 0.3s all ease;
	}

	nav .menu.active {
		transform: rotateY(0deg);
		transform-origin: left;
		transition: 0.3s all ease;
	}

	nav .menu .bgnone {
		display: flex;
		justify-content: space-between;
		margin-bottom: 25px;
	}

	nav .menu .bgnone a {}

	nav .menu .bgnone a img {
		width: 120px;
	}

	nav .menu .bgnone i {
		background: #f1f3f5;
		color: #212529;
		font-size: 20px;
		padding: 8px 10px;
		border-radius: 5px;
		cursor: pointer;
		position: absolute;
		right: 30px;
		top: 30px;
	}

	nav .menu ul {
		flex-direction: column;
		align-items: start;
		gap: 30px;
	}

	nav .menu ul li {
		text-align: left;
		font-family: 'Rubik', sans-serif;
		font-size: 15px;
		font-weight: 500;
		text-transform: uppercase;
	}

	nav .menu ul li a {
		color: #212529;
	}

	nav .searchCart {
		order: 3;
	}


	.hero img {
		height: 215px;
		object-fit: cover;
	}

	.priceDown .priceDownProduct,
	.newStockProduct,
	.cars,
	.products {
		gap: 2%;
		justify-content: start !important;
	}

	.products .singleProduct,
	.newStockProduct .singleProduct,
	.cars .singleProduct,
	.priceDown .singleProduct {
		width: calc(23% - 20px);
	}

	.copyright p {
		margin-bottom: 15px;
	}

	.about {
		max-width: 95%;
	}

	.checkoutDetails {
		row-gap: 20px;
		flex-direction: column;
	}
	.checkoutDetails .left ,
	.checkoutDetails .right {
		width: 100%;
	}

	.purcheseDetails .sinDetails {
		flex-direction: column;
	}
	.purcheseDetails .sinDetails .left{
		width: 100%;
        padding: 10px 0px;
	}
	.purcheseDetails .sinDetails .right{
		width: calc(100% - 30px);
	}


	.productDetails{
		flex-direction: column;
		row-gap: 20px;
	}
	.productDetails .left ,
	.productDetails .right {
		width: 100%;
	}
	.vehicleInfo h2 {
		font-size: 24px;
	}

	.allStock .singleStock {
		width: 48%;
	}
	.stockFiltering .sorting .controll .flowFilter {
		max-width: 768px;
		min-width: 700px;
		width: 95%;
	}
	.footermenu{
		display: none;
	}

}

@media only screen and (min-width: 480px) and (max-width: 767px) {
	.container {
		max-width: 95%;
	}

	.dnone960 {
		display: none !important;
	}

	.column {
		flex-direction: column;
	}

	.full {
		width: 100% !important;
	}



	.viewCart {
		row-gap: 30px;
		flex-direction: column;
	}

	.viewCart .left {
		width: 100%;
	}

	.viewCart .right {
		width: 100%;
	}

	nav .logo {
		order: 2;
	}

	nav .logo a img {
		width: 60px;
	}

	nav .menu {
		position: fixed;
		background: #fff;
		width: calc(75% - 30px);
		height: calc(100vh - 30px);
		height: 100vh;
		left: 0;
		top: 0;
		z-index: 4;
		padding: 15px;
		transform: rotateY(90deg);
		transform-origin: left;
		transition: 0.3s all ease;
	}

	nav .menu.active {
		transform: rotateY(0deg);
		transform-origin: left;
		transition: 0.3s all ease;
	}

	nav .menu .bgnone {
		display: flex;
		justify-content: space-between;
		margin-bottom: 25px;
	}

	nav .menu .bgnone a {}

	nav .menu .bgnone a img {
		width: 120px;
	}

	nav .menu .bgnone i {
		background: #f1f3f5;
		color: #212529;
		font-size: 20px;
		padding: 8px 10px;
		border-radius: 5px;
		cursor: pointer;
		position: absolute;
		right: 30px;
		top: 30px;
	}

	nav .menu ul {
		flex-direction: column;
		align-items: start;
		gap: 30px;
	}

	nav .menu ul li {
		text-align: left;
		font-family: 'Rubik', sans-serif;
		font-size: 15px;
		font-weight: 500;
		text-transform: uppercase;
	}

	nav .menu ul li a {
		color: #212529;
	}

	nav .searchCart {
		order: 3;
	}


	.hero img {
		height: 215px;
		object-fit: cover;
	}

	.priceDown .priceDownProduct,
	.newStockProduct,
	.cars,
	.products {
		gap: 2%;
		justify-content: start !important;
	}

	.cars {
		row-gap: 15px;
	}

	.products .singleProduct,
	.newStockProduct .singleProduct,
	.cars .singleProduct,
	.priceDown .singleProduct {
		width: calc(48% - 20px);
	}

	.hero .heroContent h2 {
		font-size: 22px;
	}

	.copyright p {
		margin-bottom: 15px;
	}


	.about {
		max-width: 95%;
	}

	.myProfile .formgroup {
		grid-template-columns: repeat(2, 1fr);
		grid-gap: 15px;
	}

	.srchfilter p {
		font-size: 12px;
	}

	.purcheseDetails .sinDetails .left {
		width: 100%;
		padding: 10px 0px;
		border-radius: 5px 5px 0 0px;
	}

	.purcheseDetails .sinDetails .right {
		width: calc(100% - 30px);
	}

	.purcheseDetails .sinDetails .right .body {
		grid-template-columns: repeat(2, 1fr);
	}

	.shipOthersBar {
		flex-wrap: wrap;
	}

	.safe {
		width: 50%;
		margin-bottom: 15px;
	}


	.protable {
		max-width: 700px;
		min-width: 500px;
		width: 100%;
		overflow-x: scroll;
		margin-bottom: 20px;
	}
	.viewCart table {
		width: 720px;
		width: 100%;
	}

	.checkoutDetails {
		row-gap: 20px;
		flex-direction: column;
	}
	.checkoutDetails .left ,
	.checkoutDetails .right {
		width: 100%;
	}

	.checkoutDetails .left form .d-flex{
		flex-direction: column;
	}
	.checkoutDetails .left form .d-flex .controll{
		width: 100%;
	}

	.productDetails{
		flex-direction: column;
		row-gap: 20px;
	}
	.productDetails .left ,
	.productDetails .right {
		width: 100%;
	}
	.vehicleInfo h2 {
		font-size: 22px;
	}
	.stockFiltering .sorting .controll .flowFilter {
		max-width: 420px;
		width: 95%;
	}

	.allStock .singleStock {
		width: 48%;
	}

	.stockFiltering ,
	.stockFiltering .sorting {
		flex-direction: column;
		row-gap: 20px;
	}
	.stockFiltering .sorting {
		width: 100%;
	}
	.stockFiltering .sorting .controll {
		width: 100%;
	}


}

/* Smartphones (portrait and landscape)  */
@media only screen and (min-width: 320px) and (max-width: 479px) {
	.container {
		max-width: 95%;
		padding: 0 0 !important;
	}

	.flex-wrap {
		flex-wrap: wrap;
	}

	.dnone960 {
		display: none !important;
	}

	.column {
		flex-direction: column;
	}

	.full {
		width: 100% !important;
	}

	nav .logo {
		width: 25%;
		order: 2;
	}

	nav .logo a img {
		width: 85px;
	}

	nav .menu {
		position: fixed;
		background: #fff;
		width: calc(75% - 30px);
		height: calc(100vh - 30px);
		height: 100vh;
		left: 0;
		top: 0;
		z-index: 4;
		padding: 15px;
		transform: rotateY(90deg);
		transform-origin: left;
		transition: 0.3s all ease;
	}

	nav .menu.active {
		transform: rotateY(0deg);
		transform-origin: left;
		transition: 0.3s all ease;
	}

	nav .menu .bgnone {
		display: flex;
		justify-content: space-between;
		margin-bottom: 25px;
	}

	nav .menu .bgnone a {}

	nav .menu .bgnone a img {
		width: 120px;
	}

	nav .menu .bgnone i {
		background: #f1f3f5;
		color: #212529;
		font-size: 20px;
		padding: 8px 10px;
		border-radius: 5px;
		cursor: pointer;
		position: absolute;
		right: 30px;
		top: 30px;
	}

	nav .menu ul {
		flex-direction: column;
		align-items: start;
		gap: 30px;
	}

	nav .menu ul li {
		text-align: left;
		font-family: 'Rubik', sans-serif;
		font-size: 15px;
		font-weight: 500;
		text-transform: uppercase;
	}

	nav .menu ul li a {
		color: #212529;
	}

	nav .searchCart {
		order: 3;
	}



	.viewCart {
		row-gap: 30px;
		flex-direction: column;
	}

	.viewCart .left {
		width: 100%;
	}

	.viewCart .right {
		width: 100%;
	}

	.hero img {
		height: 190px;
		object-fit: cover;
	}

	.hero .heroContent h2 {
		font-size: 17px;
		line-height: 30px;
	}

	.priceDown .priceDownProduct,
	.newStockProduct,
	.cars,
	.products {
		gap: 2%;
		justify-content: start !important;
	}

	.products .singleProduct,
	.newStockProduct .singleProduct,
	.cars .singleProduct {
		width: calc(48% - 20px);
	}

	.cars {
		row-gap: 15px;
	}

	.priceDown .singleProduct {
		width: calc(100% - 20px);
	}

	.copyright p {
		margin-bottom: 15px;
	}





	.about {
		max-width: 95%;
	}

	main {
		padding: 30px 0;
	}

	.userDasMenu ul {
		grid-template-columns: repeat(2, 1fr);
		grid-gap: 15px;
	}

	.myProfile .formgroup {
		grid-template-columns: repeat(1, 1fr);
		grid-gap: 0px;
	}


	.srchfilter form {
		grid-template-columns: repeat(1, 1fr);
		grid-gap: 10px;
		width: 100%;
	}


	.purcheseDetails .sinDetails .left {
		width: 100%;
		padding: 10px 0px;
		border-radius: 5px 5px 0 0px;
	}

	.purcheseDetails .sinDetails .right {
		width: calc(100% - 30px);
	}

	.purcheseDetails .sinDetails .right .body {
		grid-template-columns: repeat(1, 1fr);
	}

	.purcheseDetails .sinDetails .right .foot h4 {
		margin-bottom: 5px;
	}

	.filter form {
		grid-template-columns: repeat(1, 1fr);
		grid-gap: 10px;
	}

	.safe {
		border-radius: 5px;
		margin-bottom: 10px;
	}

	.shipOthersBar {
		flex-wrap: wrap;
	}

	.safe {
		width: 100%;
		margin-bottom: 15px;
	}


	.protable {
		max-width: 480px;
		min-width: 360px;
		width: 100%;
		overflow-x: scroll;
		margin-bottom: 20px;
	}
	.viewCart table {
		width: 720px;
		width: 100%;
	}

	.coupon {
		align-items: end;
		flex-direction: column;
	}

	.coupon form {
		width: 70%;
	}

	.coupon form input[type="text"] {
		width: calc(95% - 22px);
	}


	.signUpLogin {
		width: 300px;
		border: none;
	}

	.coupon form {
		width: 100%;
		display: flex;
		margin-bottom: 10px;
		gap: 10px;
	}

	.remove {
		width: 100%;
	}

	.coupon .remove button {
		display: block;
		width: 100%;
		text-align: center;
	}
	.checkoutDetails {
		row-gap: 20px;
		flex-direction: column;
	}
	.checkoutDetails .left ,
	.checkoutDetails .right {
		width: 100%;
	}
	.checkoutDetails .left form .d-flex{
		flex-direction: column;
	}
	.checkoutDetails .left form .d-flex .controll{
		width: 100%;
	}

	.productDetails{
		flex-direction: column;
		row-gap: 20px;
	}
	.productDetails .left ,
	.productDetails .right {
		width: 100%;
	}
	.vehicleInfo h2 {
		font-size: 20px;
	}


	.stockFiltering .sorting .controll .flowFilter {
		max-width: 300px;
		width: 95%;
	}
	.allStock .singleStock {
		width: 48%;
	}
	.stockFiltering ,
	.stockFiltering .sorting {
		flex-direction: column;
		row-gap: 20px;
	}
	.stockFiltering .sorting {
		width: 100%;
	}
	.stockFiltering .sorting .controll {
		width: 100%;
	}
}