@media screen and (max-width: 1289px) {
	.projectTypes li a,
	.projectTypes li a:hover,
	.projectTypes li a.current
	{
		width: auto;
		min-width: 300px;
	}
	.projectTypes li {
		margin-bottom: 20px;
	}
}
@media screen and (max-width: 991px) {

	
	footer .footergrid
	{
		grid-template-columns: 1fr;
		grid-template-areas: "col1" "col2" "col3" "col4";
	}
	 .footerCol{
		margin-bottom:40px;
	}
	
    .split {
        grid-template-columns: minmax(0, 1fr)!important;
        grid-template-areas:
        "left"
        "right";
    }
	.content-grid {
    --padding-inline: 30px !important;	
	
	} 
	
	.archiveContainer,
	.singlegrid{
		grid-template-columns:  1fr;
		grid-template-areas: "content" "sidebar";
	}
	.serviceInnerListItem.serviceItem{
		margin-bottom: 10px;
	}
	
	.contactInfo.grid{
		grid-template-columns:   1fr;
		grid-template-areas: "info" "form";
	}
	
	.footerLogo
	{
		position:relative;
		margin-top:12px;
	}
	.home section,
	section {
		margin-bottom:50px;
	}
	.circle-container{
		margin: 0 auto;
	}

} 
@media screen and (max-width: 767px) {
	.serviceInnerList {
		columns: 1;
		-webkit-columns: 1; 
		-moz-columns: 1;
	} 
	.projectTypes li:first-child{
		margin-bottom:20px;
	}
	.links{
		columns: 1;
		-webkit-columns: 1; 
		-moz-columns: 1;
	}
	.mainHeader {
		position: relative;
		grid-template-columns: 220px minmax(0, 1fr) 250px;
	}

}
  

@media screen and (max-width:576px) {

    .mainHeader {
        grid-template-columns: 1fr 1fr;
        grid-template-areas:
        "items items"
		"logo menu";

	}

	 
	.content-grid {
		--padding-inline: 15px !important;
    }
	.infoItems {
		grid-template-areas: "tel search lang";
		grid-template-columns: 1fr 1fr 1fr;
		margin-left: -20px;
		margin-right: -20px;
		width: calc(100% + 40px);
		padding: 5px 20px;
	}
	.search-click {
		
		padding: 12px;
		right: 150px;
		top: 32px;
	}
	.headerInfoContact {
		border:none;
		padding: 0px;
	}
	.infoItems ul{
		display: flex;
		flex-direction: row;
		gap: 10px;
		text-align: right;
		justify-content: flex-end;
		padding: 0;
	}

	.infoItems:after{
		display: none;
	}
	.circular_image{

		width: 300px;
		height: 300px;
	}

}
