@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');


:root {
    --color-portfolio-01: #808285;
    --color-portfolio-02: #CECAC7;
}
.container-fluid{
	padding: unset;
}

/* section 1 */
#sec1 .sec-01-col {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0) 60%, white 100%),
        url("fairmount-hero-section.webp");
	aspect-ratio: 21 / 9;
}

/* section 2 */
.new_portfolio #sec2 article + img{
	aspect-ratio:21 / 9;
	object-fit: cover;
}

.new_portfolio #sec2 article {
	padding:2.5rem 1.5rem;
	text-align: center;
}
.new_portfolio #sec2 article p{ max-width: 800px; margin-inline:auto;}

.new_portfolio .wrapper1{
	min-height: 40vw;
	text-align: center;
	align-content: center;
}
.new_portfolio .wrapper1 img{
	max-width:100%;
}
/* section 3 */
.sec-06-col,
.img-wrapper,
.sec-12-col,
.sec-13-col,
.sec-14-col,
.sec-15-card {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}


/* section 5 */
.sec-02-col {
    min-height: 4vw;
}

.sec-02-col:nth-child(1) { background-color: var(--color-portfolio-01);}

.sec-02-col:nth-child(2) { background: linear-gradient(to left, #C4C6C8, white, #919396);}

.sec-02-col:nth-child(3) { background-color: black;}

.sec-02-col:nth-child(4) { border: 1px solid black;}

/* section 6 */
.sec-03-col video,
.sec-03-col,
.sec-03-row {
    min-height: 40vw;
}
#sec3 .sec-03-row{
	position: relative;
}
#sec3 .sec-03-col{
	display: flex;
}
#sec3 .sec-03-col:not(:nth-of-type(1)){
	position: absolute;
}

#sec3 .sec-03-col:nth-of-type(3) article{
	padding-left: 10px;
}
.sec-03-col:nth-child(2) {
    background-color: rgba(0, 0, 0, 0.3);
    min-height: 40vw;
    width: 100%;
    height: 100%;
}

.sec-03-col:nth-child(3){
    min-height:7vw;
    bottom: 2vw;
    color:white;
}

#sec3 article p{
    font-size:  4vw; 
}
.new_portfolio #sec4 .wrapper{display: flex; justify-content: center; padding: 2rem 1.5rem;}
.new_portfolio #sec4 .wrapper img{
	width:400px;
	aspect-ratio:9 / 16;
}

/* section 5 */
.sec-05-row,
.sec-05-col1 {
    min-height: 45vw;
    background-color: var(--color-portfolio-02);

}

#sec5 .sec-05-row{
	padding:2rem;
}

#sec5 .sec-05-col1{
	align-content: flex-end;
	text-align: right;
}
#sec5 .sec-05-col1 p{
	max-width: 600px;
	margin-left:auto;
}

.sec-05-col2 {
    background-repeat: no-repeat;
    background-position: center;
    background-size: 75% 100%;

}

.sec-05-col1 p {
    text-align: right;
    align-content: end;

}

.new_portfolio .montserrat-font {
    font-family: "Montserrat";
    font-size: clamp(0.4rem, 2.28vw, 1.3rem);
}

/* section 06 */
.new_portfolio #sec6 .sec-06-row{
	position:relative;
}

.new_portfolio #sec6 .sec-06-col {
    min-height: 70vw;
}

.new_portfolio #sec6 .sec-06-row .sec-06-col:nth-of-type(2){
	display: flex;
	justify-content: center;
	align-items: center;
}

.new_portfolio #sec6 .sec-06-row .sec-06-col:nth-of-type(2) p{
	width:50%;
	text-align: center;
}

.new_portfolio .img-wrapper {
    width: 15vw;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: black;
	height:auto;
}

.sec-06-col:nth-child(3) {
    background-size: 80% 20%;
}
.new_portfolio #sec7 .wrapper{
	display: flex;
	gap:2rem;
	padding:2rem 2rem 0px;

}
.new_portfolio #sec7 .wrapper img{
	object-fit: cover;
}

.new_portfolio #sec7 .wrapper img:nth-of-type(1){
	width:55%;
	aspect-ratio:16 / 9;
}

.new_portfolio #sec7 .wrapper img:nth-of-type(2){
	width:45%;
}

.new_portfolio #sec7 .wrapper2{
	display: flex;
	gap:2rem;
	padding: 2rem;
}
.new_portfolio #sec7 .wrapper2 img{
	max-width: 595px;
	flex: 1 1 auto;
}

.new_portfolio #sec7 p{
    width: 60%;
	text-align: center;
	margin-inline: auto;
	margin-bottom:2rem;
}

/* section 15 */

/* Hide scrollbars */
.sec-15-col {
    overflow: hidden;
    /* border: 1px solid black; */
    min-height: 15vw;
}

/* Scrolling container */
.sec-15-scroll {
    white-space: nowrap;
    overflow: hidden;
    position: relative;

}

.sec-15-scroll:nth-child(2) .sec-15-track {
    /* border:1px solid black; */
    animation: scrollRight 50s linear infinite;
}

/* Scrolling content track */
.sec-15-track {
    display: flex;
    animation: scrollLeft 50s linear infinite;
    width: max-content;
}


/* Cards */
.sec-15-card {
    /* border: 1px solid black; */
    width: 25vw;
    aspect-ratio: 5 / 3;
    min-height: 15vw;
    margin-right: 1.5rem; 
    flex-shrink: 0;
}

/* Animation keyframes */
@keyframes scrollLeft {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(-50%);
    }
}

/* Animation keyframes */
@keyframes scrollRight {
    0% {
        transform: translateX(-50%);
    }

    100% {
        transform: translateX(0%);
    }
}

@media(max-width:1366px) {
	
	.new_portfolio .wrapper1 img {
    max-width: 80%;
}
.new_portfolio #sec7 .wrapper2 img{
	max-width: 414px;
}
	
	.new_portfolio #sec7 .wrapper img:nth-of-type(2) {
    width: 42.8%;
}
}


@media(max-width:1280px) {
	     .new_portfolio #sec7 .wrapper2 img {
        max-width: 385px;
    }

}

@media(max-width:1200px) {
	
	.new_portfolio #sec7 .wrapper2 img {
        max-width: 358px;
    }
    
}

@media(max-width:768px) {
	
	.new_portfolio #sec4 .wrapper img {
    width: 200px;
}
	
.new_portfolio #sec7 .wrapper img:nth-of-type(1),
.new_portfolio #sec7 .wrapper img:nth-of-type(2){
		aspect-ratio:16 / 9;
	    width:100%;
	}
	
	    .new_portfolio #sec7 .wrapper2 img {
        max-width: 213.4px;
    }
	
	.sec-15-card {
		width: 40vw;}
    
}

@media(max-width:576px) {
	.new_portfolio #sec7 .wrapper2{
		flex-wrap:wrap;
	}
	.new_portfolio #sec7 .wrapper2 img {
        max-width: 100%;
    }
	
	.new_portfolio #sec7 p {
		width: 80%;}
	.sec-15-card {
        width: 55vw;
    }
}

@media(max-width:480px) {
	
	 #sec1 .sec-01-col {aspect-ratio: 1 / 1;}
	.new_portfolio #sec2 article + img {aspect-ratio: 16 / 9;}
	.new_portfolio .wrapper1 { min-height: 50vw;}
}