@media only screen and (min-width: 0px) {
    .portfolio-item.col-md-3 {
        max-width: 24%;
        margin-bottom: 2.1em;
    }
    .portfolio-item.col-md-3 .portf-item-bg {
        width: 11.36em;
        height: 8.8em;
    }
    .portfolio-item.col-md-4 {}
    .portfolio-item.col-md-4 .portf-item-bg {
        width: 16.25em;
        height: 12.21em;
    }
    .portfolio-item.col-md-6 {
        margin-bottom: 2em;
    }
    .portfolio-item.col-md-6 .portf-item-bg {
        width: 26em;
        height: 19.5em;
    }
    .portfolio-item.col-md-8 {
        margin-bottom: 2em;
    }
    .portfolio-item.col-md-8 .portf-item-bg {
        width: 35.8em;
        height: 26.85em;
    }
		.forerunner-header h1 {
			font-size: 4.5em;
		}
}

@media only screen and (min-width: 768px) {
	#header.desktop-no-bg {
		background: none !important;
		border-color: transparent !important;
	}
  	.portfolio-grid {
		font-size: 1.5vw;
  	}
	.forerunner-header h1 {
		font-size: 4em;
  	}
  	html {
    	font-size: 16px;
  	}
  	.single-project-section-3 .text-wrap {
    	padding-left: 2em;
  	}
  	.portfolio-item.col-md-3 .portf-item-title,
  	.portfolio-item.col-md-3 .portf-item-desc {
		display: block;
		margin: 0;
	}
	.portf-item-text {
		max-height: 2em;
	}
	.home-section-5 form {
		width: 55%;
    	min-width: 30em;
    	margin: 0 auto 2em;
	}
}

@media only screen and (min-width: 900px) {
    .portfolio-grid {
        font-size: 0.7em;
    }
		.forerunner-header h1 {
        font-size: 5em;
    }
    html {
      font-size: 16px;
    }
}

@media only screen and (min-width: 1000px) {
    .portfolio-grid {
        font-size: 0.9em;
    }
    .forerunner-header h1 {
        font-size: 5em;
    }
    html {
      font-size: 16px;
    }
    .news-item-small .rotated-text p {
		width: 11em;
    	height: 1em;
    	overflow: hidden;
    	text-overflow: ellipsis;
    	white-space: nowrap;
    }
}
@media only screen and (min-width: 1000px) and (max-width: 1400px) {
	.news-item-small .rotated-text .divider,
	.news-item-small .rotated-text .publication-name {
		/* display: none; */
	}
}

@media only screen and (min-width: 1200px) {
    .portfolio-grid {
        font-size: 1.1em;
    }
		.forerunner-header h1 {
        font-size: 5em;
    }
}

@media only screen and (min-width: 1400px) {
    .portfolio-grid {
        font-size: 1.2em;
    }
}


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

@media only screen and (max-width: 768px) {
    .portfolio-grid {
        width: 100%;
    }
    .portfolio-item.col-md-3, .portfolio-item.col-md-4, .portfolio-item.col-md-6, .portfolio-item.col-md-8 {
        width: 100%;
        max-width: 100%;
        height: auto;
        position: relative;
    }
    .portfolio-item.col-md-3 .portf-item-bg, .portfolio-item.col-md-4 .portf-item-bg, .portfolio-item.col-md-6 .portf-item-bg, .portfolio-item.col-md-8 .portf-item-bg {
        width: 100%;
        height: 20em;
    }
		html {
		  font-size: 14px;
		}
		.header-inner {
		  margin: 0 1em;
		  height: 4em;
		}
		.home-section-1 p.hb-part1 {
			display: none;
		}
		.home-section-2 h1, .single-project-section-2 h1 {
		  max-width: 100%;
		}
    .col-md-6:nth-of-type(2n) .news-item,
    .col-md-6:nth-of-type(2n + 1) .news-item {
        margin-left: 0;
        margin-right: 0;
    }
		.push-left, .push-right {
			/* margin-left: 0; */
			/* margin-right: 0; */
		}
		.manifesto-content {
		  max-width: 100%;
		}
		.team-content .team-detail .team-text {
		  padding: 2em 1em;
		}
		.team-content .team-detail .close-btn {
		  display: none;
		}
		.portfolio-item {
		  margin-bottom: 1em !important;
		}
		.portfolio-item.col-md-8 .portf-item-title,
		.portfolio-item.col-md-8 .portf-item-desc,
		.portfolio-item.col-md-6 .portf-item-title,
		.portfolio-item.col-md-6 .portf-item-desc,
		.portfolio-item.col-md-4 .portf-item-title,
		.portfolio-item.col-md-4 .portf-item-desc,
		.portfolio-item.col-md-3 .portf-item-title,
		.portfolio-item.col-md-3 .portf-item-desc {
			font-size: 1.8em !important;
			line-height: 1.4em !important;
		}
		.single-project-section-3 .text-wrap {
		  padding: 2em 0em;
		}
		.single-project-section-4 .single-project-item-title,
		.single-project-section-4 .single-project-item-desc {
		  font-size: 1em;
		}
		.news-item .description {
			font-family: 'TimesNRMTPro Medium';
			font-size: 2em;
			line-height: 1.2em;
		}
		.portf-grid-type {
			width: auto;
			display: inline;
		}
		.forerunner-header{
			padding-top: 2em;
		}
    .portfolio-grid.animate-entry {
      opacity: 1;
      top: 0;
    }
    .single-project-section-3 img {
    	padding-right: 0;
    }
}

@media only screen and (max-width: 576px) {
  html {
    font-size: 13px;
  }
  #footer .copyright span {
    display: block;
  }
  #footer .copyright .divider {
    display: none;
  }
	.home-section-1 .hero-banner-container {
		max-height: 90vh;
	}
	.home-section-2 {
		margin-top: 90vh;
	}
	#header .sidebar .sidebar-contact {
		bottom: 10vh;
	}

}
@media only screen and (max-width: 420px) {
  	html {
    	font-size: 12px;
  	}
	.portfolio-item .portf-item-title,
	.portfolio-item .portf-item-desc {
		/* display: block; */
		margin: 0;
	}
  .single-project-section-1-inner h2 {
    font-size: 4em;
  }
}