/* Big tablets to 1200px (widths smallers than the 1140 row) */
@media only screen and (max-width: 1200px) {


	header {
		background-size: 100%;
		background-position: top;
	}

	.hero-text-box {
		width: 100%;
		padding: 0 4%;
	}

	.row {
		margin: 0 4%;
	}



}

/* Solutions item max 1279 */
@media only screen and (max-width: 1279px) {
	.solutions-item {
		min-height: auto;
		margin-bottom: 8px;
	}
}



/* Small tablets to big tablets: from 768 to 1023px */
@media only screen and (max-width: 1023px) {

	body {
		font-size: 16px;
	}


	header {
		height: 510px;
	}

	.section-wholesaler {
		background-size: 180%;
		background-position: center;
		height: auto;
		background-attachment: fixed;
	}

	.hero-text-box {
		top: 370px;
	}

	h1 {
		font-size: 170%;
	}


	.main-nav li {
		padding: 0 4px;
	}

	.main-nav li a {
		/* padding: 6px 16px 2px 16px; */
	}


	.btn-full:link,
	.btn-full:visited {
		padding: 8px 18px;
		font-size: 14px;
	}

	.btn-ghost:link,
	.btn-ghost:visited {
		padding: 8px 18px;
		font-size: 14px;
	}


	.long-copy {
		width: 90%;
		margin: 0 5%;
	}

	.padding-box {
		padding: 32px 8px 26px;
	}

	.works-step div {
		height: 44px;
		width: 44px;
	}

	.contact-form {
		width: 100%;
	}

}


/* Small phones to small tablets: from 481 to 767px */
@media only screen and (max-width: 767px) {

	body {
		font-size: 16px;
	}

	section {
		padding: 30px 0
	}



	header {
		height: 320px;
	}


	.main-nav {
		display: none;
	}


	.mobile-nav-icon {
		display: inline-block;
	}




	.main-nav {
		float: left;
		margin-top: 4px;
		margin-left: 20px;
	}

	.main-nav li {
		display: block;
	}

	.main-nav li a {
		text-align: left;
	}

	.main-nav li a:link,
	.main-nav li a:visited {
		display: block;
		border: 0;
		padding: 10px 0;
		font-size: 100%;
	}

	.main-nav li a:hover,
	.main-nav li a:active {
		background-color: unset;
		color: #fff;
		border: none;
	}

	.sticky .main-nav {
		margin-top: 12px;
		margin-left: 20px;
	}


	.sticky .main-nav li a:link,
	.sticky .main-nav li a:visited {
		padding: 10px 0;
	}

	.sticky .main-nav li a:hover,
	.sticky .main-nav li a:active {
		background-color: unset;
		color: unset;
		border: none;
	}

	.sticky .mobile-nav-icon i {
		color: #555;
	}


	.hero-text-box {
		top: 220px;
	}

	.hero-text-box h1 {
		margin-bottom: 10px;
	}



	.row {
		/* padding: 0 4% */
		margin: 0 4%;
	}

	.col {
		/* width: 100%; */
		margin: 0 0 4% 0;
	}

	.long-copy {
		width: 90%;
		margin: 4%;
	}

	.padding-box {
		padding: 16px 8px 4px;
		margin: 0;
	}


	.section-products p {
		font-size: 90%;
		line-height: 145%;
	}

	h1 {
		font-size: 100%;
	}

	h2 {
		font-size: 140%;
	}


	.steps-box:first-child {
		text-align: center;
		padding-right: 0%;
		margin-top: 0px;
		margin-bottom: 0;
	}

	.iPhone-V {
		display: none;
	}

	.iPhone-H {
		display: inline;
	}


	.steps-box:last-child {
		padding-left: 4%;
		padding-right: 4%;
		margin-top: 32px;
	}

	.steps-box p {
		font-size: 16px;
	}

	.works-step {
		margin-bottom: 24px;
		width: 100%;
	}

	.section-wholesaler {
		height: auto;
	}


	.section-cities {
		text-align: center;
	}


	.section-cities img {
		width: 60%;
		height: auto;
		margin-top: 18px;
		margin-bottom: 2px;
	}

	.section-cities h3 {
		padding-top: 0;
		padding-bottom: 2px;
	}

	.city-feature {
		display: inline;
		margin-right: 16px;
	}

	.city-feature ion-icon {
		padding-right: 0;
	}


	.plan-box {
		width: 70%;
		margin: 10px 15% 5px;
	}

	.form-empty-space {
		display: none;
	}

	.field-form {
		margin-bottom: 20px;
	}

	.button-form-container{
		text-align: center;
	}

	.captcha-form-container{
		display: grid;
		place-items: center;
	}




	/* Small phones: from 0 to 480px */
	@media only screen and (max-width: 480px) {

		header {

			background-size: cover;
			background-position: center;
			height: 320px;
			background-attachment: initial;
		}

		.row {
			margin: 0 6%;
		}

		.main-nav li a:link,
		.main-nav li a:visited {
			padding: 8px 0;
			font-size: 86%;
		}

		.hero-social-link {
			margin: 18px 4px 18px 4px;
		}

		.hero-social-links,
		.hero-social-links:hover {
			background-color: #00000026;
			width: 34px;
			padding: 0;
			border-top-left-radius: 4px;
			border-bottom-left-radius: 4px;
			transition: all 0.6s ease-in-out;
			position: absolute;
			top: 100%;
			right: 0;
			-ms-transform: translateY(-126%);
			transform: translateY(-126%);
			font-size: 120%;
		}

		.hero-social-link-facebook a:hover,
		.hero-social-link-twitter-x a:hover,
		.hero-social-link-instagram a:hover,
		.hero-social-link-youtube a:hover,
		.hero-social-link-linkedin a:hover,
		.hero-social-link-mail a:hover {
			color: #fff;
		}



		h1 {
			font-size: 78%;
			word-spacing: 2px;
		}

		h2 {
			font-size: 140%;
		}

		.btn-full:link,
		.btn-full:visited {
			margin-top: 10px;
		}

		.city-feature {
			display: block;
		}

		.steps-box p {
			font-size: 12px;
		}

		.product-step {
			font-size: 17px;
			height: 32px;
			width: 32px;
		}

		.product-1-step,
		.product-3-step,
		.product-5-step {
			margin-bottom: 0px;
		}

		.product-2-step,
		.product-4-step,
		.product-6-step {
			margin-bottom: 0px;
		}

		.back-to-products.back-to-products-right {
			text-align: right;
			margin: 16px 32px 0 0;
		}

		.back-to-products.back-to-products-left {
			margin: 16px 0 0 16px;
			text-align: left;
		}

		.product-image {
			padding: 24px;
		}



		.label-form {
			margin-bottom: 10px;
		}

		footer ul,
		footer p {
			text-align: center;
			width: 100%;
			margin-bottom: 10px;
		}


	}




}