/**************************************
*************projects HOME************
***************************************
1.projects HOME TITLE
2.projects HOME DESCRIPTION
3.projects HOME POSTS
**************************************/



@media (min-width: 1024px) {

	.projects {
		padding: 120px 0 0 0;
	}

	.projects-section-text {
		max-width: 1540px;
		margin: 0 auto;
		padding: 80px 20px;
	}

	.projects-section-title {
		margin: 0;
		padding: 0;
	}

	.projects-section-title-part {
		height: 100px;
		display: flex;
 		align-items: center;
		overflow: hidden;
		gap:20px;
	}
	
	.projects-section-title-part span {
		font-family: 'Gotham Pro';
		font-size: 70px;
		color: rgba(75, 75, 75, .2);
		letter-spacing: 0px;
		font-weight: 900;
		line-height: 1;
	}


	.projects-section-title .__green {
		color: rgba(0, 167, 157, 1);
	}

	.projects-section-title .__dark {
		color: rgba(75, 75, 75, 1);
		font-weight: 300;
	}





	
	.projects-list {
		list-style: none;
		margin: 0;
		padding: 0;
		overflow: hidden;
	}

	.projects-item a {
		position: relative;
		min-height: 200px;
		display: block;
		text-decoration: none;
		overflow: hidden;
	}

	.projects-item a::after {
		content:"";
		position: absolute;
		top:0;
		bottom:0;
		left:0;
		right: 0;
		border-bottom:1px solid rgba(215, 215, 215, 1);
		z-index: 1;
	}

	.projects-item:first-child a::after {
		content:"";
		position: absolute;
		border-top:1px solid rgba(215, 215, 215, 1);
		z-index: 1;
	}


	.projects-item-line {
		position: relative;
		padding: 30px 0 0 0;
		display: flex;
		align-items: center;
		white-space: nowrap;
	}



	.projects-item-img {
		display: none;
	}

	.projects-item-title {
		position: relative;
		margin: 0;
		font-family: 'Gotham Pro';
		font-size: 180px;
		color: #4B4B4B;
		letter-spacing: -2px;
		font-weight: 600;
		text-transform: uppercase;
		opacity: 0.2;
	}

	.projects-item-title span {
		padding-right: 60px;
	}

	.projects-item-title span::before {
		content:"• ";
		position: relative;
	}

	.projects-item-title span::after {
		content:" •";
		position: relative;
	}










	.projects-list-image {
		width: 0;
		z-index: 25;
		position: fixed;
		pointer-events: none;
		transform: translate(-50%, -52%);
		display: block;
		overflow: hidden;
		transition: width .4s cubic-bezier(0.36, 0, 0.66, 0);
		will-change: transform, width;

	}

	.projects-list-image.active {
		border-radius: 0;
		width: 528px;
		transition: width .4s cubic-bezier(0.34, 1, 0.64, 1);
	}

	.projects-list-image-bounce {
		overflow: hidden;
		transform: scale(1) rotate(.001deg);
		transition: all .5s cubic-bezier(0.65, 0, 0.35, 1);
		will-change: transform;
	}

	.projects-list-image-bounce.active {
		transform: scale(1) rotate(.001deg);
	}

	.projects-list-image::before {
		display: block;
		content: "";
		padding-top: 100%;
	}

	.projects-list-image .projects-list-image-item {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}



	.projects-list-image .projects-list-image-wrap {
		width: 100%;
		position: absolute;
		left: 0;
		top: 0;
		display: block;
		will-change: transform;
		margin: 0;
		padding: 0;
	}

	.projects-list-image .projects-list-image-wrap .projects-list-image-item {
		position: relative;
		width: 100%;
		display: block;
		overflow: hidden;
	}

	.projects-list-image .projects-list-image-wrap .projects-list-image-item:before {
		display: block;
		content: "";
		padding-top: 100%;
		z-index: -1;
		background-color:rgba(214, 215, 219, 1);
	} 

	.projects-list-image .projects-list-image-wrap .projects-list-image-item {
		width: 0;
	}

	.projects-list-image .projects-list-image-wrap .projects-list-image-item {
		width: 100%;
	}
 
	.overlay {
		position: absolute;
		top: 0;
		left: 0;
		height: 100%;
		width: 100%;
	}

	.overlay-image {
		position: absolute;
		top: 5%;
		bottom: 5%;
		left: 5%;
		right: 5%;
		background-position: center center;
		background-repeat: no-repeat;
		background-size: cover;
	}

	.projects-list-image-cursor {
		width: 105.6px;
		height: 105.6px;
		border-radius: 50%;
		border: 0;
		background: #00A79D;
		position: fixed;
		z-index: 26;
		pointer-events: none;
		transform: translate(-50%, -60%) scale(0);
		overflow: hidden;
		transition: transform .4s cubic-bezier(0.36, 0, 0.66, 0);
		left: 50.5%;
		top: -10%;
		left: -10%;
		left: 0%;
		top: 0%;
		will-change: transform;
		display: flex;
		flex-flow: column nowrap;
		justify-content: center;
		align-items: center;
		align-content: center;
	}

	.projects-list-image-cursor span {
		color: #FFF;
		font-size: 14px;
		font-family: 'Gotham Pro';
		letter-spacing: 1px;
		line-height: 1.4;
		text-align: center;
		font-weight: 700;
	}

	.projects-list-image-cursor.active {
		transform: translate(-50%, -60%) scale(1);
		transition: transform .4s cubic-bezier(0.34, 1, 0.64, 1);
	}

	.projects-btn-conteiner {
		display: flex;
		justify-content: center;
		align-items: center;
		padding: 60px 0 0 0;
	}


}


@media (min-width: 640px) and (max-width:1023px) {

	.projects {
		padding: 120px 0 0 0;
	}

	.projects-section-text {
		max-width: 1540px;
		margin: 0 auto;
		padding: 0 20px 40px 20px;
	}

	.projects-section-title {
		margin: 0;
		padding: 0;
	}

	.projects-section-title-part {
		height: 80px;
		display: inline-flex;
 		align-items: center;
		overflow: hidden;
		gap:20px
	}
	
	.projects-section-title-part span {
		font-family: 'Gotham Pro';
		font-size: 60px;
		color: rgba(75, 75, 75, 0.2);
		letter-spacing: -2px;
		font-weight: 900;
		line-height: 1;
	}


	.projects-section-title .__green {
		color: rgba(0, 167, 157, 1);
		font-weight: 900;
	}

	.projects-section-title .__dark {
		color: rgba(75, 75, 75, 1);
		font-weight: 300;
	}

	.projects-list {
		list-style: none;
		margin: auto;
		margin: 0;
		padding: 0 20px 60px 20px;
		overflow: hidden;
		column-count: 2;
  		column-gap: 20px;
	}



	.projects-item a {
		position: relative;
		min-height: 100px;
		text-decoration: none;
		overflow: hidden;

		display: flex;
		flex-flow: column nowrap;
		gap:10px;
		margin-bottom: 15%;
	}

	.projects-item:nth-child(1) a {
		margin-top: 30%;
	}




	.projects-item-img {
		background-color: rgba(214, 215, 219, 0.8);
		position: relative;
	}

	.projects-item-img::before {
		display:block;
		content:"";
		padding-top: 100%;
	}

	.projects-item-img img {
		position: absolute;
		width: 90%;
		height: 90%;
		top:5%;
		bottom:5%;
		left:5%;
		right: 5%;
	}

	.projects-item-line {
		position: relative;
		padding: 5px 0 3px 0;
		display: flex;
	}

	.projects-item-title:last-child {
		display: none;
	}

	.projects-item-title {
		position: relative;
		padding: 0;
		margin: 0;
		font-family: 'Gotham Pro';
		font-weight: 300;
		font-size: 18px;
		line-height: 1.8;
		color: #4B4B4B;
		letter-spacing: 1px;
		text-decoration: none;

		display: flex;
		flex-flow: column-reverse nowrap;
	}


	.projects-item-title span {
		margin: 0;
		padding: 5px 0 0 0 ;
		display: block;
		font-family: 'Gotham Pro';
		font-weight: 900;
		font-size: 22px;
		line-height: 1.2;
		color: #233748;
		letter-spacing: 1.5px;
		text-transform: uppercase;
		order:1;
	}


	.projects-list-image {
		display: none;
		overflow: hidden;
	}


	.projects-list-image-cursor {
		display:none;
		position: relative;
	}


	.projects-btn-conteiner {
		display: flex;
		justify-content: center;
		align-items: center;
	}

}






@media (max-width:639px) {

	.projects {
		padding: 120px 0 0 0;
	}

	.projects-section-text {
		max-width: 1540px;
		margin: 0 auto;
		padding: 0 20px 40px 20px;
	}

	.projects-section-title {
		margin: 0;
		padding: 0;
	}

	.projects-section-title-part {
	
	}
	
	.projects-section-title-part span {
		font-family: 'Gotham Pro';
		font-size: 44px;
		color: rgba(75, 75, 75, 0.2);
		letter-spacing: .2px;
		font-weight: 900;
		line-height: 1.3;
	}


	.projects-section-title .__green {
		color: rgba(0, 167, 157, 1);
		font-weight: 900;
	}

	.projects-section-title .__dark {
		color: rgba(75, 75, 75, 1);
		font-weight: 300;
	}

	.projects-list {
		list-style: none;
		margin: auto;
		margin: 0;
		padding: 0 20px 60px 20px;
		overflow: hidden;
		display: flex;
		flex-flow: column nowrap;
		gap:60px;
	}



	.projects-item a {
		position: relative;
		min-height: 100px;
		text-decoration: none;
		overflow: hidden;

		display: flex;
		flex-flow: column nowrap;
		gap:10px;
	}





	.projects-item-img {
		background-color: rgba(214, 215, 219, 0.8);
		position: relative;
	}

	.projects-item-img::before {
		display:block;
		content:"";
		padding-top: 100%;
	}

	.projects-item-img img {
		position: absolute;
		width: 90%;
		height: 90%;
		top:5%;
		bottom:5%;
		left:5%;
		right: 5%;
	}

	.projects-item-line {
		position: relative;
		padding: 5px 0 3px 0;
		display: flex;
	}

	.projects-item-title:last-child {
		display: none;
	}

	.projects-item-title {
		position: relative;
		padding: 0;
		margin: 0;
		font-family: 'Gotham Pro';
		font-weight: 300;
		font-size: 16px;
		line-height: 1.8;
		color: #4B4B4B;
		letter-spacing: 1px;
		text-decoration: none;

		display: flex;
		flex-flow: column-reverse nowrap;
	}


	.projects-item-title span {
		margin: 0;
		padding: 5px 0 0 0 ;
		display: block;
		font-family: 'Gotham Pro';
		font-weight: 900;
		font-size: 20px;
		line-height: 1.2;
		color: #233748;
		letter-spacing: 1.5px;
		text-transform: uppercase;
		order:1;
	}


	.projects-list-image {
		display: none;
		overflow: hidden;
	}


	.projects-list-image-cursor {
		display:none;
		position: relative;
	}


	.projects-btn-conteiner {
		display: flex;
		justify-content: center;
		align-items: center;
	}

}