/**************************************
*************PORTFOLIO POST************
***************************************

3.PORTFOLIO POST CONTENT
4.PORTFOLIO POST IMAGES
5.PORTFOLIO POST RATING
6.PORTFOLIO POST OTHER PROJECTS
**************************************/




/**************************************
3.PORTFOLIO POST CONTENT***************
**************************************/


@media (min-width: 768px) {

	.projects-content-desc-list {
		max-width:1540px;
		margin: 0 auto;
		padding:40px 20px;
		display:grid;
		grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
		grid-gap:20px;
	}

	.projects-content-desc-row strong {
		display:block;
		font-family: 'Gotham Pro';
		font-size: 18px;
		line-height: 1.6;
		letter-spacing: 1px;
		font-weight: 700;
		color:#4B4B4B;
	}

	.projects-content-desc-row span {
		font-family: 'Gotham Pro';
		font-size: 18px;
		line-height: 1.6;
		letter-spacing: 1px;
		font-weight: 300;
		color:#C1C1CE;
		cursor: pointer;
	}

	.projects-content-desc-row a {
		font-family: 'Gotham Pro';
		font-size: 18px;
		line-height: 1.6;
		letter-spacing: 1px;
		font-weight: 300;
		color:#C1C1CE;
		text-decoration:none;
	}



	.projects-content-desc {
		max-width:1540px;
		margin:0 auto;
		padding:30px 20px;
	}

	.projects-content-desc .projects-content-desc-text {
		font-family: 'Gotham Pro';
		font-size: 18px;
		line-height: 1.8;
		letter-spacing: 1px;
		font-weight: 300;
		color:#4B4B4B;
		max-width:780px
	}

}


@media (max-width: 767px) {

	.projects-content-desc-list {
		max-width:1540px;
		margin:  0 auto ;
		padding: 20px;
		display:grid;
		grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
		grid-gap:20px;
	}

	.projects-content-desc-row strong {
		display:block;
		font-family: 'Gotham Pro';
		font-size: 18px;
		line-height: 1.6;
		letter-spacing: 1px;
		font-weight: 700;
		color:#4B4B4B;
	}

	.projects-content-desc-row span {
		font-family: 'Gotham Pro';
		font-size: 16px;
		line-height: 1.8;
		letter-spacing: 1px;
		font-weight: 300;
		color:#C1C1CE;
		cursor: pointer;
	}

	.projects-content-desc-row a {
		font-family: 'Gotham Pro';
		font-size: 16px;
		line-height: 1.8;
		letter-spacing: 1px;
		font-weight: 300;
		color:#C1C1CE;
		text-decoration:none;
	}



	.projects-content-desc {
		max-width:1540px;
		margin:0 auto;
		padding: 10px 20px;
	}

	.projects-content-desc .projects-content-desc-text {
		font-family: 'Gotham Pro';
		font-size: 16px;
		line-height: 1.8;
		letter-spacing: 1px;
		font-weight: 300;
		color:#4B4B4B;
		max-width:780px
	}

}

/**************************************
4.PORTFOLIO POST IMAGES****************
**************************************/



.projects-swiper-navigations {
	max-width: 1540px;
	margin: 0 auto;
	position:relative;
	padding:0 20px;
}


.projects-scrollbar {
	height: 3px;
	background-color: #F1F1F3;
	margin:60px 40px 20px 40px;
	position:relative;
	z-index:1;
}

.projects-scrollbar .swiper-scrollbar-drag {
	background: rgba(0,0,0,.1);
}

.projects-swiper-next {
	position:absolute;
	width:60px;
	height:60px;
	top:calc(50% - 30px);
	right:20px;
	z-index:3;
}

.projects-swiper-next::before {
	content:"";
	position:absolute;
	width:30px;
	height:30px;
	top:calc(50% - 15px);
	right:0;
	border-radius:50%;
	background-color:  #00A79D;
	z-index:2;
}

.projects-swiper-next::after {
	content:"";
	position:absolute;
	width:8px;
	height:8px;
	top:calc(50% - 6px);
	right:12px;
	border-top:3px solid #fff;
	border-right:3px solid #fff;
	transform:rotate(45deg);
	z-index:2;
}



.projects-swiper-prev {
	position:absolute;
	width:60px;
	height:60px;
	top:calc(50% - 30px);
	left:20px;
	z-index:3;
}

.projects-swiper-prev::before {
	content:"";
	position:absolute;
	width:30px;
	height:30px;
	top:calc(50% - 15px);
	left:0;
	border-radius:50%;
	background-color:  #00A79D;
	z-index:2;
}

.projects-swiper-prev::after {
	content:"";
	position:absolute;
	width:8px;
	height:8px;
	top:calc(50% - 6px);
	left:12px;
	border-top:3px solid #fff;
	border-right:3px solid #fff;
	transform:rotate(-135deg);
	z-index:2;
}



@media (min-width:1541px) {

	.projects-content-slider {
		position:relative;
		margin-left:calc((100vw - 1560px) / 2);
		padding:30px 0 60px 20px;
		overflow:hidden;

	}

	.project-slide img {
		outline: 1px solid rgba(21,21,21,.1);
		width: 100%;
		height: auto;
	}

}

@media (min-width:481px) and (max-width:1540px) {

	.projects-content-slider {
		position:relative;
		padding:30px 0 40px 20px;
		overflow:hidden;
		margin-top:20px;
	}

	.project-slide img {
		outline: 1px solid rgba(21,21,21,.1);
		width: 100%;
		height: auto;
	}

}

@media (max-width:480px) {

	.projects-content-slider {
		position:relative;
		padding:30px 20px 40px 20px;
		overflow:hidden;
		margin-bottom:60px;
		margin-top:10px;
	}

	.project-slide img {
		outline: 1px solid rgba(21,21,21,.1);
		width: 100%;
		height: auto;
	}

}









/**************************************
6.PORTFOLIO POST OTHER PROJECTS********
**************************************/



@media (min-width:768px) {


	.other-projects-conteiner {
		max-width:1540px;
		margin:60px auto 0 auto;
		padding:40px 20px 90px 20px;
		position:relative;
	}

	.other-projects-conteiner::before {
		content:"";
		position: absolute;
		width: calc(100% - 40px);
		max-width: 1540px;
		height: 1px;
		top:0;
		left: 50%;
		transform: translateX(-50%);
		background-color: #ddd;
	}

		
	.otherprojects-swiper-prev {
		position: absolute;
		width: 80px;
		height: 80px;
		top: 50%;
		left: 5px;
		transform: translateY(-50%) scale(1);
		border-radius: 50%;
		background-color: #00A79D;
		z-index: 5;
		transition-duration: 0.3s;
	}

	.otherprojects-swiper-prev:active {
		position: absolute;
		width: 80px;
		height: 80px;
		top: 50%;
		left: 5px;
		transform: translateY(-50%) scale(0.96);
		border-radius: 50%;
		background-color: #00A79D;
		z-index: 5;
		transition-duration: 0.3s;
	}

	.otherprojects-swiper-prev::before {
		content: "";
		position: absolute;
		width: 16px;
		height: 16px;
		top: 50%;
		left: 50%;
		transform: rotate(-45deg) translateX(10%) translateY(-60%);
		border-top: 3px solid #fff;
		border-left: 3px solid #fff;
		z-index: 4;
	}

	.otherprojects-swiper-next {
		position: absolute;
		width: 80px;
		height: 80px;
		top: 50%;
		right: 5px;
		transform: translateY(-50%) scale(1);
		border-radius: 50%;
		background-color: #00A79D;
		z-index: 5;
		transition-duration: 0.3s;
	}

	.otherprojects-swiper-next:active {
		position: absolute;
		width: 80px;
		height: 80px;
		top: 50%;
		right: 5px;
		transform: translateY(-50%) scale(0.96);
		border-radius: 50%;
		background-color: #00A79D;
		z-index: 5;
		transition-duration: 0.3s;
	}

	.otherprojects-swiper-next::before {
		content: "";
		position: absolute;
		width: 16px;
		height: 16px;
		top: 50%;
		right: 50%;
		transform: rotate(45deg) translateX(-10%) translateY(-60%);
		border-top: 3px solid #fff;
		border-right: 3px solid #fff;
		z-index: 4;
	}



	.other-project {
		overflow:hidden;
		position:relative;
		counter-reset: item;
	}

	.other-project .swiper-wrapper{
		counter-reset: item;
	}

	.other-projects-item {
		position: relative;
		display: flex;
		flex-flow: column nowrap;
		grid-row-gap: 10px;
	}

	.other-projects-item-img {
		position: relative;
		background-color: rgba(214, 215, 219, 0.5);
		padding: 5%;
	}

	.other-projects-item-img img {
		display: block;
		margin: 0;
		padding: 0;
		width: 100%;
		height: auto;
	}


	.other-projects-item-title {
		margin: 0;
		padding: 0 10px;
		color: rgba(35, 55, 72, .9);
		font-family: 'Gotham Pro';
		font-weight: 900;
		font-size: 36px;
		letter-spacing: 1px;
		line-height: 1.2;
	}


	.other-projects-item-category {
		padding: 0 10px;
		margin-top: 10px;
		font-family: 'Gotham Pro';
		font-weight: 300;
		font-size: 18px;
		line-height: 1.6;
		letter-spacing: 1px;
	}


	.other-projects-item a {
		position: absolute;
		top:0;
		bottom:0;
		left:0;
		right: 0;
		z-index: 3;
	}

	.projects-navigations-item a {
		position: absolute;
		top:0;
		bottom:0;
		left:0;
		right: 0;
		z-index: 3;
	}

}





@media (max-width:767px) {


	.other-projects-conteiner {
		max-width:1540px;
		margin:60px auto 0 auto;
		padding:40px 20px 90px 20px;
		position:relative;
	}

	.other-projects-conteiner::before {
		content:"";
		position: absolute;
		width: calc(100% - 40px);
		max-width: 1540px;
		height: 1px;
		top:0;
		left: 50%;
		transform: translateX(-50%);
		background-color: #ddd;
	}


	.otherprojects-swiper-prev {
		position: absolute;
		width: 70px;
		height: 70px;
		top: 50%;
		left: 5px;
		transform: translateY(-50%) scale(1);
		border-radius: 50%;
		background-color: #00A79D;
		z-index: 5;
		transition-duration: 0.3s;
	}

	.otherprojects-swiper-prev:active {
		position: absolute;
		width: 70px;
		height: 70px;
		top: 50%;
		left: 5px;
		transform: translateY(-50%) scale(0.96);
		border-radius: 50%;
		background-color: #00A79D;
		z-index: 5;
		transition-duration: 0.3s;
	}

	.otherprojects-swiper-prev::before {
		content: "";
		position: absolute;
		width: 16px;
		height: 16px;
		top: 50%;
		left: 50%;
		transform: rotate(-45deg) translateX(10%) translateY(-60%);
		border-top: 3px solid #fff;
		border-left: 3px solid #fff;
		z-index: 4;
	}

	.otherprojects-swiper-next {
		position: absolute;
		width: 70px;
		height: 70px;
		top: 50%;
		right: 5px;
		transform: translateY(-50%) scale(1);
		border-radius: 50%;
		background-color: #00A79D;
		z-index: 5;
		transition-duration: 0.3s;
	}

	.otherprojects-swiper-next:active {
		position: absolute;
		width: 70px;
		height: 70px;
		top: 50%;
		right: 5px;
		transform: translateY(-50%) scale(0.96);
		border-radius: 50%;
		background-color: #00A79D;
		z-index: 5;
		transition-duration: 0.3s;
	}

	.otherprojects-swiper-next::before {
		content: "";
		position: absolute;
		width: 16px;
		height: 16px;
		top: 50%;
		right: 50%;
		transform: rotate(45deg) translateX(-10%) translateY(-60%);
		border-top: 3px solid #fff;
		border-right: 3px solid #fff;
		z-index: 4;
	}


	.other-project {
		overflow:hidden;
		position:relative;
		counter-reset: item;
	}

	.other-project .swiper-wrapper{
		counter-reset: item;
	}

	.other-projects-item {
		position: relative;
		display: flex;
		flex-flow: column nowrap;
		grid-row-gap: 10px;
	}

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

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

	.other-projects-item-category {
		padding: 0 10px;
		margin-top: 10px;
		font-family: 'Gotham Pro';
		font-weight: 300;
		font-size: 16px;
		line-height: 1.8;
		letter-spacing: 1px;
	}

	.other-projects-item-title {
		margin: 0;
		padding: 0 10px;
		color: rgba(35, 55, 72, .9);
		font-family: 'Gotham Pro';
		font-weight: 900;
		font-size: 36px;
		letter-spacing: 1px;
		line-height: 1.2;
	}


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


	.other-projects-item a {
		position: absolute;
		top:0;
		bottom:0;
		left:0;
		right: 0;
		z-index: 3;
	}

	.projects-navigations-item a {
		position: absolute;
		top:0;
		bottom:0;
		left:0;
		right: 0;
		z-index: 3;
	}

}