/* Smartphones (portrait and landscape) ----------- */

@media only screen and (min-width: 320px) and (max-width: 1024px) {
	body {
		overflow-y: hidden !important;
	}
	header {
		position: fixed;
		z-index: 1000;
		top: 0;
	}
	.header-height {
		height: 60px;
	}
	.navbar-nav {
		background-color: #5c0c73;
		padding: 15px;
		align-items: baseline;
	}
	.navbar {
		padding-bottom: 15px;
	}
	.navbar-light .navbar-nav .nav-link {
		color: #fff !important;
	}
	.btn-login {
		background-image: linear-gradient(#5909fb, #9426ec);
	}
	.navbar-light .navbar-toggler {
		border-color: transparent !important;
	}
	.navbar-collapse {
		margin-top: 10px;
	}
	.mb-road img {
		display: block;
		width: 100%;
		margin-top: -6px;
	}
	.banner .cars img {
		padding-bottom: 0;
		width: 100%;
	}
	.top-road {
		background-color: #4a4a5a;
		height: 28px;
	}
	.mockup {
		padding-top: 0px;
		margin-top: 0px !important;
	}
	nav {
		min-height: auto;
	}
	.cars{
		display: none;
		width: 100%;
	}
	.cars-mob{
		display: block;
		margin-top: 40px;
	}
	.cars-mob img{
		width: 100%;
	}
	.banner-img{
		height: auto;
	}
	.road {
		display: none;
	}
	.road-top {
		display: none;
	}
	.road-bottom {
		display: none;
	}
	.about h1 {
		text-align: center;
	}
	.about p {
		text-align: justify;
		padding-top: 3%;
	}
	.about .left-section {
		padding-top: 10%;
	}
	.about .tracking {
		padding-top: 5%;
	}
	.about .tracking p {
		text-align: center;
	}
	.product {
		padding-top: 40px;
	}
	.product-bg-lite {
		margin-top: 30px;
	}
	.product-bg-basic {
		margin-top: 30px;
	}
	.product-bg-standard {
		margin-top: 30px;
	}
	.product-bg-premium {
		margin-top: 30px;
	}
	.mt-5 {
		margin-top: 0rem!important;
	}
	.submit-btn {
		text-align: center;
	}
	.contact {
		margin-top: 30px;
		padding-bottom: 30px;
	}
	.contact .container {
		padding: 0 15px;
	}
	.contact h1,
	h2,
	h3 {
		text-align: center;
	}
	.input-field {
		margin-top: 30px;
	}
	footer {
		margin-top: -10px;
		padding-top: 30px;
	}
	.contact-right {
		margin-top: 0px;
	}
	.footer-logo {
		text-align: center;
	}
	.pr-0 {
		padding-right: auto!important;
	}
	footer h1 {
		text-align: center;
		padding-bottom: 10px;
	}
	footer p {
		text-align: center;
	}
	footer h3 {
		margin-top: 20px;
	}
	footer .form-control {
		width: 100%;
	}
	footer .social {
		justify-content: center;
		display: flex;
	}
	footer .social a {
		margin-right: 5px;
	}
	.slider__item-content img {
		width: 100%;
	}
	/* 
#slide-3:checked ~ .slider__holder .slider__item--2 {
  z-index: 1;
  transform: translateX(-60px) scale(0.85);
}
#slide-3:checked ~ .slider__holder .slider__item--4{
  transform: translateX(60px) scale(0.85);
}
#slide-4:checked ~ .slider__holder .slider__item--5{
  z-index: 1;
  transform: translateX(60px) scale(0.85);
}
#slide-4:checked ~ .slider__holder .slider__item--3{
  z-index: 1;
  transform: translateX(60px) scale(0.85);
}
#slide-5:checked ~ .slider__holder .slider__item--4{
  z-index: 1;
  transform: translateX(-60px) scale(0.85);
} */
	.slider__item-content {
		padding: 0;
		padding-top: 30px;
	}
	#slide-4:checked~.slider__holder .slider__item--5 {
		transform: translateX(60px) scale(0.85);
	}
	#slide-3:checked~.slider__holder .slider__item--2 {
		transform: translateX(-60px) scale(0.85);
	}
	#slide-3:checked~.slider__holder .slider__item--4 {
		transform: translateX(60px) scale(0.85);
	}
	#slide-2:checked~.slider__holder .slider__item--3 {
		transform: translateX(60px) scale(0.85);
	}
	#slide-2:checked~.slider__holder .slider__item--1 {
		transform: translateX(-60px) scale(0.85);
	}
	#slide-4:checked~.slider__holder .slider__item--3 {
		transform: translateX(-60px) scale(0.85);
	}
	#slide-5:checked~.slider__holder .slider__item--4 {
		transform: translateX(-60px) scale(0.85);
	}
	#slide-1:checked~.slider__holder .slider__item--2 {
		transform: translateX(60px) scale(0.85);
	}
	#slide-3:checked~.slider__holder .slider__item--5 {
		transform: translateX(0px) scale(0.65);
	}
	#slide-1:checked~.slider__holder .slider__item--3 {
		transform: translateX(0px) scale(0.65);
	}
	#slide-1:checked~.slider__holder .slider__item--5 {
		transform: translateX(0px) scale(0.65);
	}
	#slide-1:checked~.slider__holder .slider__item--4 {
		transform: translateX(0px) scale(0.65);
	}

	.road-mobile{
		display: block;
	}
	.road-middle-car{
		top: 15px;
	}
	.road-middle-car3{
		top: 15px;
	}


	.float{
		position:fixed;
		width:50px;
		height:50px;
		bottom:20px;
		right:20px;
		background-color:#25d366;
		color:#FFF;
		border-radius:50px;
		text-align:center;
		  font-size:30px;
		box-shadow: 2px 2px 3px #999;
		  z-index:100;
	}
	.float i{
		padding-top: 10px;
		color: #fff;
	}

}


/* ##Device = Low Resolution Tablets, Mobiles (Landscape) -------------- */

@media (min-width: 768px) and (max-width: 1024px) {
	.about .left-section {
		padding-top: 5%;
	}
	.product-bg-standard {
		margin-top: 80px;
	}
	.contact-right {
		padding-top: 37px;
	}
	#slide-4:checked~.slider__holder .slider__item--5 {
		transform: translateX(100px) scale(0.85);
	}
	#slide-3:checked~.slider__holder .slider__item--2 {
		transform: translateX(-100px) scale(0.85);
	}
	#slide-3:checked~.slider__holder .slider__item--4 {
		transform: translateX(100px) scale(0.85);
	}
	#slide-2:checked~.slider__holder .slider__item--3 {
		transform: translateX(100px) scale(0.85);
	}
	#slide-2:checked~.slider__holder .slider__item--1 {
		transform: translateX(-100px) scale(0.85);
	}
	#slide-4:checked~.slider__holder .slider__item--3 {
		transform: translateX(-100px) scale(0.85);
	}
	#slide-5:checked~.slider__holder .slider__item--4 {
		transform: translateX(-100px) scale(0.85);
	}
	#slide-1:checked~.slider__holder .slider__item--2 {
		transform: translateX(100px) scale(0.85);
	}
	#slide-3:checked~.slider__holder .slider__item--5 {
		transform: translateX(0px) scale(0.65);
	}
	#slide-1:checked~.slider__holder .slider__item--3 {
		transform: translateX(0px) scale(0.65);
	}
	#slide-1:checked~.slider__holder .slider__item--5 {
		transform: translateX(0px) scale(0.65);
	}
	#slide-1:checked~.slider__holder .slider__item--4 {
		transform: translateX(0px) scale(0.65);
	}
}


/* ##Device = Tablets, Ipads (portrait) ----------------- */

@media (min-width: 1024px) and (max-width: 1280px) {
	#slide-3:checked~.slider__holder .slider__item--1 {
		transform: translateX(-100px) scale(0.65);
	}
	.navbar-nav {
		background-color: transparent;
	}
	.navbar-light .navbar-nav .nav-link {
		color: rgba(0, 0, 0, .5) !important;
	}
	.ipa-top {
		padding-top: 46px;
	}
	.product-main .col-12 {
		flex: 0 0 100%;
		max-width: 100%;
	}
}


@media (min-width: 320px) and (max-width: 600px) {
	.mockup {
		padding-top: 0px;
		margin-top: -60px !important;
	}
}