@media (max-width: 1280px) {

	/** {
		border: solid 1px #000;
	}*/

	.nav-item {
		padding: 5px;
		text-align: center;
	}

	.hero-image {
		background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("../material/hero-image-1280.jpg");
	}

	.contact-hero-image {
		background-image: url("../material/location_map/location_map.png");
	}

	.hero-text {
	  	width: 50%;
	  	top: 45%;
	  	left: 30%;
		font-size: 32px;
		line-height: 1.1;
	}

	.container-1 {
		padding: 50px 50px 50px 50px;
	}

	.icon-title-1 {
		font-size: 16px;
		margin: 20px 15px 0 0;
	}

	.icon-title-2 {
		font-size: 16px;
		margin: 20px 15px 0 0;
	}

	.icon-title-3 {
		font-size: 16px;
		margin: 20px 15px 0 0;
	}

	.icon-desc-1 {
		font-size: 14px;
		margin: 0px 15px 0px 0px;
	}

	.icon-desc-2 {
		font-size: 14px;
		margin: 0px 15px 0px 15px;
	}

	.icon-desc-3 {
		font-size: 14px;
		margin: 0px 0px 0px 15px;
	}

	.container-2 {
		padding: 40px 50px;
	}

	.wrapper-2 {
		display: grid;
		grid-template-areas: 
		"logo-1 logo-1"
		"photo-1 desc-1"
		"photo-1 btn-1";

		grid-template-columns: 450px minmax(350px, 600px);
		justify-content: center;
}

	.sam-logo {
		margin-bottom: 40px;
	}

	.sam-desc {
		font-size: 14.5px;
	}

	.container-3 {
		padding: 50px 50px;
	}

	.wrapper-3 {
		display: grid;
		grid-template-areas: 
		"logo-2 logo-2"
		"desc-2 photo-2"
		"btn-2 photo-2";

		grid-template-columns: minmax(350px, 600px) 450px;
		justify-content: center;
	}

	.xc-logo {
		margin-bottom: 40px;
	}

	.xc-desc {
		font-size: 14.5px;
	}

	.contact-container-1 {
		padding: 40px 170px 40px 170px;
	}
}





@media (max-width: 900px) {

	/** {
		border: solid 1px #000;
	}*/

	.hero-image {
		background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("../material/hero-image-900.jpg");
		height: 50vh;
		background-position: right;
	}

	.hero-text {
	  	text-align: center;
	  	position: absolute;
	  	width: 85%;
	  	top: 50%;
	  	left: 50%;
		font-size: 28px;
		line-height: 1.1;
	}

	.container-1 {
		display: grid;
		grid-template-columns: 1fr ;
		padding: 40px;
		margin: 0px;
	}

	.wrapper-1 {
		display: grid;
		grid-template-areas: 
		"service-title"
		"icon-1"
		"icon-title-1"
		"icon-desc-1"
		"icon-2"
		"icon-title-2"
		"icon-desc-2"
		"icon-3"
		"icon-title-3"
		"icon-desc-3";

		grid-template-columns: 1fr;
		grid-template-rows: auto;
	}

	.service {
		font-size: 26px;
		margin: 20px;
	}

	.icon-2 {
		margin: 30px 0 0 0;
	}

	.icon-3 {
		margin: 30px 0 0 0;
	}

	.icon-title-1 {
		font-size: 18px;
		margin: 20px 0 0 0;
	}

	.icon-title-2 {
		font-size: 18px;
		margin: 20px 0 0 0;
	}

	.icon-title-3 {
		font-size: 18px;
		margin: 20px 0 0 0;
	}

	.icon-desc-1 {
		margin: 0px 0px 10px 0px;
	}

	.icon-desc-2 {
		margin: 0px 0px 10px 0px;
	}

	.icon-desc-3 {
		margin: 0px 0px 10px 0px;
	}

	.wrapper-2 {
		display: grid;
		justify-content: center;
		grid-template-areas: 
		"logo-1"
		"photo-1"
		"desc-1"
		"btn-1";

		grid-template-columns: 1fr;
		grid-template-rows: auto;
	}

	.sam-logo {
		margin: 0px 0 40px 0;
	}

	.sam-photo {
		justify-self: center;
		max-width: 100%;
		margin-bottom: 20px;
	}

	.sam-desc {
		padding: 0px;
	}

	.btn-vs-1 {
		grid-area: btn-1;
		justify-self: center;
		margin: 20px 0px 0px 0px;
	}

	.btn-red {
		font-size: 14px;
		padding: 6px 14px;
	}

	.wrapper-3 {
		display: grid;
		justify-content: center;
		grid-template-areas: 
		"logo-2"
		"photo-2"
		"desc-2"
		"btn-2";

		grid-template-columns: 1fr;
		grid-template-rows: auto;
	}

	.xc-logo {
		margin: 0px 0 40px 0;
	}

	.xc-photo {
		justify-self: center;
		max-width: 100%;
		margin-bottom: 20px;
	}	

	.xc-desc {
		padding: 0px;
	}

	.btn-vs-2 {
		grid-area: btn-2;
		justify-self: center;
		margin: 20px 0px 0px 0px;
	}

	.btn-black {
		font-size: 14px;
		padding: 6px 14px;
	}

	.contact-wrapper-1 {
		display: grid;
		grid-template-areas: 
		"left-info"
		"right-info";
		grid-template-columns: 1fr;
		grid-template-rows: auto;
	}

	.contact-form-box {
		background-color: #fff;
		width: 500px;
		height: 515px;
		border-radius: 5px;
	}
}