/* =============================================================================

	RESPONSIVE ( 767px - 0 )

============================================================================= */

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

	.anchor {
		display: block;
		top: -50px;
	}

	body {
		font-size: 16px;
	}

	.container,
	.about .about-block,
	.about .google,
	.testimonials .testimonials-block,
	.contact form {
		width: 100%;
	}

	.container {
		padding: 0 20px;
	}

	.section {
		padding: 20px 0;
	}

	.header,
	.header .hero {
		height: 400px;
	}

	.header .hero {
		object-position: center !important;
	}

	.header .nav {
		position: fixed;
		top: 0;
		left: 0;
		height: 55px;
		background-color: #fff;
		padding: 10px 20px;
		z-index: 999;
		box-shadow: 0 2px 20px -10px rgba(0,0,0,.4);
	}

	.header .nav .logo img {
		width: 160px;
	}

	.header .nav .menu {
		position: absolute;
		top: 55px;
		left: 0;
		max-height: 0;
		opacity: 0;
		background-color: #fff;
		overflow: hidden;
		flex-wrap: wrap;
		transition: .3s ease-in-out;
	}

	.header .nav .menu li {
		width: 100%;
	}

	.header .nav .menu li a {
		color: #333 !important;
		text-align: right;
		padding: 30px 40px;
		border-bottom: 1px solid #e4e4e4;
	}

	.header .nav .menu li a.button {
		background-color: #333;
		color: #fff !important;
		padding: 30px 40px;
		border-radius: 0;
	}

	.header .nav .menu.active {
		max-height: 500px;
		opacity: 1;
		border-top: 1px solid #e4e4e4;
	}

	.mobile-menu {
		display: block;
		margin-top: 0;
	}

	.header .content {
		margin-left: -50%;
	}

	.title,
	.header .content h1 {
		font-size: 24px;
	}

	.header .buttons-container {
		flex-wrap: wrap;
		width: 300px;
		margin-bottom: 20px;
	}

	.header .buttons-container .button {
		width: 300px;
		margin: 10px;
		text-align: center;
	}

	.header .content .text,
	.advantages .advantages-container img {
		display: none;
	}

	.advantages .features-container {
		width: 100%;
	}

	.advantages .feature-block{
		padding: 10px 20px;
	}

	.about .about-container {
		justify-content: space-between;
	}

	.about .about-block {
		margin: 10px 0;
	}

	.about .google {
		flex-wrap: wrap;
		justify-content: center;
		text-align: center;
		padding: 30px 20px;
		margin: 40px auto 20px auto;
	}

	.about .google .text-orange {
		margin: 10px 0;
	}

	.about .google-contact span { 
		display: block;
		margin-top: 10px;
	}

	.about .contact-separator {
		display: none !important;
	}

	.calculator .calculator-container {
		flex-wrap: wrap;
	}

	.calculator .column {
		width: 100%;
		order: 2;
	}

	.calculator .column.text-center {
		order: 1;
	}

	.calculator .calculator-feature {
		text-align: center;
	}

	.calculator .tag {
		background: transparent;
		box-shadow: unset;
	}

	.calculator .tag-icon {
		font-size: 28px;
		padding: 14px 18px;
		border-radius: 60px;
		box-shadow: 0 2px 20px -5px rgba(81, 140, 249, .4);
	}

	.calculator .tag p,
	.calculator .tag-bar {
		display: none;
	}

	.testimonials .testimonials-wrap {
		padding: 0 2px;
	}

	.testimonials .testimonials-block img {
		width: 100%;
		max-width: 300px;
		padding: 0 20px;
	}

	.testimonials .testimonials-block .text {
		font-size: 14px;
	}

	.tns-controls {
		display: none;
	}

	.brands .brands-container {
		justify-content: center;
	}

	.brands .brands-container img {
		width: 142px;
		margin: 0 12px 20px;
	}

	.contact .columns-container {
		flex-wrap: wrap;
	}

	.contact .column {
		width: 100%;
	}

	.contact .input,
	.contact textarea {
		padding: 20px 15px;
	}

	.contact label {
		width: 40px;
		height: 40px;
	}

	.contact label:before,
	.contact label:hover:before {
		width: 32px;
		height: 32px;
	}

	#tick-mark {
		top: 0;
		width: 20px;
		height: 25px;
		margin-left: 6px;
	}

	#tick-mark:before {
		width: 5px;
		height: 13px;
		transform: translateY(-10px);
	}

	#tick-mark:after {
		height: 5px;
		transform: translateX(10px);
	}

	.checkbox label .text {
		top: -5px;
		left: 60px;
		width: 240px;
		white-space: unset;
	}

	.footer .subscribe-container {
		position: relative;
		flex-wrap: wrap;
		padding: 30px 20px;
		background-position-x: center;
	}

	.footer .subscribe-container h3,
	.footer .subscribe-container h4 {
		text-align: center;
	}

	.footer .subscribe-container .content,
	.footer .subscribe-container form {
		width: 100%;
	}

	.footer .subscribe-container input {
		margin-top: 20px;
	}

	.footer .subscribe-button {
		font-size: 20px;
		padding: 15px 30px;
		margin: 5px auto;
	}

	.footer .columns-container {
		flex-wrap: wrap;
	}

	.footer .columns-container .left, 
	.footer .columns-container .right {
		width: 100%;
	}

	.footer .columns-container .left h2.text-white {
		text-align: center;
	}

	.footer .columns-container .left .bar-footer {
		margin: 0 auto 40px auto;
	}

	.footer .columns-container .menu ul li a {
		margin: 0 auto;
	}

	.footer .columns-container .logo {
    	width: 240px;
		margin-top: 40px;
	}

	.footer .columns-container .text-contact {
		display: block;
		width: max-content;
		margin: 10px auto;
	}

	#back-to-top {
		bottom: 80px;
		font-size: 24px;
		padding: 6px 10px;
	}

	#modal-content {
		flex-wrap: wrap;
		width: 98%;
		height: max-content;
		max-height: 90%;
		top: 60px;
    	left: 1%;
    	transform: unset;
    	overflow-y: scroll;
	}

	.modal-left {
		display: none;
	}

	.modal-right {
		width: 100%;
		padding: 10px 20px;
	}

	#modal #mc_embed_signup form {
		padding: 0 20px 10px;
	}

	#modal #mc_embed_signup h2 {
		font-size: 20px;
	}

	#modal #mc_embed_signup .mc-field-group.input-group ul {
		justify-content: space-between;
	}

	#modal #mc_embed_signup .mc-field-group.input-group ul li {
		width: 49%;
	}

}