/* CSS Document */
@font-face {
    font-family: "Oswald";
    src: url("fonts/Oswald-VariableFont_wght.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

.new_portfolio .home-sec-hero {
}

.new_portfolio .home-sec-hero > img {
    width: 100%;
    height: 100vh;
    object-fit: cover;
}

.new_portfolio .home-sec-hero .content-wrapper {
    background-color: #f7f7f7;
    padding-block:5rem;}

.new_portfolio .home-sec-hero .content-wrapper p {
    max-width: 80%;
    text-align: center;
    margin-inline:auto; color: #333333;
    font-size: var(--rfs-30);
    font-family: "Oswald";
}

.new_portfolio ul {
    padding-left: 0px;
    list-style: none;
    margin-bottom: 0px;
}

.new_portfolio .container-fluid {
    padding: 0px;
}

.new_portfolio .home-sec-01 .colors-wrapper {
    width: 100%;
    display: flex;
    padding-inline:4rem; gap: 2rem;
    padding-block:3rem;}

.new_portfolio .home-sec-01 .colors-wrapper li {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.new_portfolio .home-sec-01 .colors-wrapper li:not(:last-child) {
    width: 300px;
}

.new_portfolio .home-sec-01 .colors-wrapper li:last-child {
    width: 500px;
}

.new_portfolio .home-sec-01 .colors-wrapper li:nth-child(1) span:nth-child(1) {
    background-color: #ed1651;
}

.new_portfolio .home-sec-01 .colors-wrapper li:nth-child(2) span:nth-child(1) {
    background-color: #065baa;
}

.new_portfolio .home-sec-01 .colors-wrapper li:nth-child(3) span:nth-child(1) {
    background-color: #58595b;
}

.new_portfolio .home-sec-01 .colors-wrapper li:nth-child(4) span:nth-child(1) {
    background-color: #231f20;
}

.new_portfolio .home-sec-01 .colors-wrapper li:nth-child(5) span:nth-child(1) {
    background: linear-gradient(to right, #ed1651, #065baa);
    position: relative;
}

.new_portfolio .home-sec-01 .colors-wrapper li:nth-child(5) span:nth-child(1)::before {
    content: "#ed1651";
    position: absolute;
    color: #fff;
    top: 0%;
    left: 0%;
    margin: 1rem;
    font-size: var(--rfs-30);
    font-family: "Oswald";
}

.new_portfolio .home-sec-01 .colors-wrapper li:nth-child(5) span:nth-child(1)::after {
    content: "#065baa";
    position: absolute;
    color: #fff;
    bottom: 0%;
    right: 0%;
    margin: 1rem;
    font-size: var(--rfs-30);
    font-family: "Oswald";
}

.new_portfolio .home-sec-01 .colors-wrapper li span:nth-child(1) {
    width: 100%;
    height: 300px;
    /*border:1px solid black;*/
}

.new_portfolio .home-sec-01 .colors-wrapper li span:nth-child(2) {
    text-align: center;
    font-size: var(--rfs-30);
    font-family: "Oswald";
    color: #065baa;
}

.new_portfolio .home-sec-01 .box-wrapper {
    display: flex;
    gap: 2rem;
}

.new_portfolio .home-sec-01 .box-wrapper li {
    width: 50%;
    /*border:1px solid black;*/
}

.new_portfolio .home-sec-01 .box-wrapper li:nth-child(2) {
    border: 1px solid #ed1651;
    display: flex;
    align-items: center;
}

.new_portfolio .home-sec-01 .box-wrapper li img {
    width: 100%;
}

.new_portfolio .home-sec-01 .shape-boxes {
    width: 100%;
    display: flex;
    padding-inline: 4rem;border-top: 1px solid #ed1651;
    border-bottom: 1px solid #ed1651;
    margin-block: 2rem;gap: 2rem;
}

.new_portfolio .home-sec-01 .shape-boxes li {
    width: calc(100% / 5);
    /*border:1px solid black;*/
    display: flex;
    flex-direction: column;
    gap: 1rem;
    align-items: center;
    padding-block: 3rem;}

.new_portfolio .home-sec-01 .shape-boxes li img {
    width: 45%;
}

.new_portfolio .home-sec-01 .shape-boxes li span {
    font-size: var(--rfs-24);
    text-align: center;
}

.new_portfolio .home-sec-01 .img-container {
    width: 100%;
}

.new_portfolio .home-sec-01 .img-container li {
    width: 100%;
    height: 100vh;
}

.new_portfolio .home-sec-01 .img-container li:nth-of-type(3) {
    width: 60%;
    border: 1px solid black;
    margin-block: 3rem;
    background-color: #e8e8e8;
    position: relative;
}

.new_portfolio .home-sec-01 .img-container li:nth-of-type(3) img:nth-child(1) {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    object-fit: contain;
    width: 40%;
}

.new_portfolio .home-sec-01 .img-container li:nth-of-type(3) img:nth-child(2) {
    position: absolute;
    object-fit: contain;
    width: 100%;
    height: 100%;
    left: 65%;
}

.new_portfolio .home-sec-01 .img-container li:nth-of-type(3) img:nth-child(3) {
    position: absolute;
    object-fit: contain;
    width: 35%;
    height: auto;
    border-radius: 5%;
    border: 2px solid black;
    top: 40%;
    left: 49.9%;
    transform: translate(-50%, -50%);
}

.new_portfolio .home-sec-01 .img-container li img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.new_portfolio .home-sec-01 .img-container li:nth-of-type(4) {
    padding-inline: 3rem;padding-bottom: 3rem;
}

.new_portfolio .home-sec-01 .img-container li:nth-of-type(4) img {border: 1px solid black;}

.new_portfolio .home-sec-02 .main-row {
}

.new_portfolio .home-sec-02 .main-row .columns {
    height: auto;
/*    border: 1px solid black;*/
}
.new_portfolio .home-sec-02 .main-row .columns:nth-child(1){height:100vh;}
.new_portfolio .home-sec-02 .main-row .columns:nth-child(1) ul {
    height: 100%;
    width: 100%;
    display: flex;
    background: linear-gradient(to right, #ed175054, #0c5aa987);
}

.new_portfolio .home-sec-02 .main-row .columns:nth-child(1) ul li {
    /* border:1px solid black;*/
    height: 100%;
    width: 50%;
    position: relative;
}

.new_portfolio .home-sec-02 .main-row .columns:nth-child(1) ul li:nth-child(1) .vid-screen {
    position: absolute;
    border: 1px solid #ed1651;
    width: 46%;
    height: 80%;
    top: 50%;
    /* left:5%; */
    right: 5%;
    transform: translateY(-50%);
    background-color: #000;
}

.new_portfolio .home-sec-02 .main-row .columns:nth-child(1) ul li:nth-child(1) .vid-screen video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.new_portfolio .home-sec-02 .main-row .columns:nth-child(1) ul li:nth-child(2) {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    gap: 3rem;
    padding: 2rem;
    justify-content: center;
    align-items: center;
    align-content: flex-start;
}

.new_portfolio .home-sec-02 .main-row .columns:nth-child(1) ul li:nth-child(2) .tab {
    /*border:1px solid black;*/
    position: relative;
    width: 30%;
    height: 25%;
}
.new_portfolio .home-sec-02 .main-row .columns:nth-child(1) ul li:nth-child(2) .tab.active::before{
	opacity:1;
}

.new_portfolio .home-sec-02 .main-row .columns:nth-child(1) ul li:nth-child(2) .tab::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
	opacity:0;
    /*border:1px solid black;*/
    left: 5%;
    bottom: 7%;
    z-index: -1;
    background: linear-gradient(to right, #065baa, #ff0000);
    transition: all 1s ease;
}

.new_portfolio .home-sec-02 .main-row .columns:nth-child(1) ul li:nth-child(2) .tab img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.new_portfolio .home-sec-02 .main-row .columns:nth-child(2) {
    margin-block: 3rem;
}

.new_portfolio .home-sec-02 .main-row .columns:nth-child(2) ul {
    display: flex;
    gap: 3rem;
    width: 100%;
    height: 100%;
		position: relative;
}

.new_portfolio .home-sec-02 .main-row .columns:nth-child(2) ul li {
    /*border:1px solid black;*/
    width: calc(100% / 3);
    height: 100%;
}

.new_portfolio .home-sec-02 .main-row .columns:nth-child(2) ul li:nth-child(2) {
    border: 2px solid #d7d7d7;
    width: calc(100% / 3);
    height: 100%;

}

.new_portfolio .home-sec-02 .main-row .columns:nth-child(2) ul li img {
    width: 100%;
    height: 100%;
    /* object-fit: contain; */
}

.new_portfolio .home-sec-02 .main-row .columns:nth-child(2) img.stack-card-img {
    position: absolute;
    right: 0%;
    bottom: -10%;
    width: 42%;
    height: auto;
    object-fit: contain;
}

.new_portfolio .home-sec-02 .main-row .columns:nth-child(3) img{width:100%; height:100%; object-fit: cover;}
.new_portfolio .home-sec-02 .main-row .columns:nth-child(3){position: relative; height: 100vh;}
.new_portfolio .home-sec-02 .main-row .columns:nth-child(3) .vid-screen{/* border:1px solid red; */width: 32.4%;border-radius: 3px;overflow: hidden;height: 42%;position: absolute;transform: skew(
-0.3deg);top: 32.3%;left: 34.2%;}
.new_portfolio .home-sec-02 .main-row .columns:nth-child(3) .vid-screen video{width:100%; height:100%; object-fit: cover;}

@media (min-width: 1920px) {
    .new_portfolio .home-sec-01 .img-container li:nth-of-type(3) img:nth-child(3) {
        position: absolute;
        object-fit: contain;
        width: 35%;
        height: auto;
        border-radius: 5%;
        border: 2px solid black;
        top: 41%;
        left: 49.9%;
        transform: translate(-50%, -50%);
    }
}

@media (max-width: 1366px) {
	.new_portfolio .home-sec-hero .content-wrapper p { font-size: var(--rfs-24); }
	

	.new_portfolio .home-sec-01 .colors-wrapper li span:nth-child(1) {height: 200px;}
	.new_portfolio .home-sec-01 .colors-wrapper li span:nth-child(2),.new_portfolio .home-sec-01 .colors-wrapper li:nth-child(5) span:nth-child(1)::after,.new_portfolio .home-sec-01 .colors-wrapper li:nth-child(5) span:nth-child(1)::before {font-size: var(--rfs-24);}
	
	.new_portfolio .home-sec-01 .img-container li:nth-of-type(3) img:nth-child(3) { top: 42%;}
	.new_portfolio .home-sec-02 .main-row .columns:nth-child(1) ul li:nth-child(1) .vid-screen {width:55%;}
	.new_portfolio .home-sec-02 .main-row .columns:nth-child(1) ul li:nth-child(2) .tab {width:40%;}
	.new_portfolio .home-sec-02 .main-row .columns:nth-child(3) .vid-screen { top: 34.3%; left: 33%; width: 35%; height: 37.3%;}
}

@media (max-width: 1280px) {
	.new_portfolio .home-sec-hero .content-wrapper p,.new_portfolio .home-sec-01 .shape-boxes li span { font-size: var(--rfs-21); }
		.new_portfolio .home-sec-01 .colors-wrapper li span:nth-child(2),.new_portfolio .home-sec-01 .colors-wrapper li:nth-child(5) span:nth-child(1)::after,.new_portfolio .home-sec-01 .colors-wrapper li:nth-child(5) span:nth-child(1)::before {font-size: var(--rfs-21);}
	.new_portfolio .home-sec-01 .shape-boxes li img { width: 60%; }

	.new_portfolio .home-sec-02 .main-row .columns:nth-child(3) .vid-screen {top: 34.3%;left: 31.7%;width: 37.5%;height: 37.3%;}
}

@media (max-width: 768px) {
	
	.new_portfolio .home-sec-hero > img {height:auto;}
	.new_portfolio .home-sec-hero .content-wrapper p{font-size: var(--rfs-24);}
	.new_portfolio .home-sec-hero .content-wrapper p br{display: none;}
	.new_portfolio .home-sec-01 .colors-wrapper li span:nth-child(1) { height: 100px;}
	.new_portfolio .home-sec-hero .content-wrapper { padding-block: 3rem;  }
	.new_portfolio .home-sec-01 .colors-wrapper {padding:2rem;}
	.new_portfolio .home-sec-01 .shape-boxes {padding-inline:2rem;}
	.new_portfolio .home-sec-01 .shape-boxes li img { width: 70%;}
	.new_portfolio .home-sec-01 .img-container li{height: auto;}
	.new_portfolio .home-sec-01 .img-container li:nth-of-type(3) {height: 450px; margin-block: 2rem;}
	
	.new_portfolio .home-sec-02 .main-row .columns:nth-child(1) {height: 500px; }
	.new_portfolio .home-sec-02 .main-row .columns:nth-child(2) ul {gap:2rem;}
	.new_portfolio .home-sec-02 .main-row .columns:nth-child(2) { margin-block: 2rem;}
	.new_portfolio .home-sec-02 .main-row .columns:nth-child(3) {height:auto;}
	.new_portfolio .home-sec-02 .main-row .columns:nth-child(3) .vid-screen {top: 34.7%;left: 34.7%;width: 31.5%;height: 36.6%;}
	
}

@media (max-width: 576px) {
	.new_portfolio .home-sec-02 .main-row .columns:nth-child(1) { height: 400px; }
	.new_portfolio .home-sec-02 .main-row .columns:nth-child(1) ul li:nth-child(1) .vid-screen { width: 62%;}
	.new_portfolio .home-sec-02 .main-row .columns:nth-child(1) ul li:nth-child(2) {gap: 1.5rem;padding-left: 1rem;}
	.new_portfolio .home-sec-02 .main-row .columns:nth-child(1) ul li:nth-child(2) .tab { width: 45%;}
	.new_portfolio .home-sec-02 .main-row .columns:nth-child(2) ul { gap: 1rem; flex-direction: column;}
	.new_portfolio .home-sec-02 .main-row .columns:nth-child(2) { margin-block: 1.5rem;}
	
	.new_portfolio .home-sec-01 .img-container li:nth-of-type(3) img:nth-child(3) { top: 44%;}
	.new_portfolio .home-sec-01 .img-container li:nth-of-type(4) {padding-inline: 1.5rem; padding-bottom: 1.5rem; }
	.new_portfolio .home-sec-01 .img-container li:nth-of-type(3) {margin-block:1.5rem;}
	.new_portfolio .home-sec-01 .colors-wrapper {flex-wrap:wrap;}
	.new_portfolio .home-sec-01 .colors-wrapper li:not(:last-child) {width: 240px; height:240px;}
	
	.new_portfolio .home-sec-01 .colors-wrapper li:last-child {width:512px;}
	.new_portfolio .home-sec-01 .colors-wrapper li span:nth-child(1) { height:240px;}
	.new_portfolio .home-sec-01 .colors-wrapper li span:nth-child(2),.new_portfolio .home-sec-01 .colors-wrapper li:nth-child(5) span:nth-child(1)::after, .new_portfolio .home-sec-01 .colors-wrapper li:nth-child(5) span:nth-child(1)::before{font-size: var(--rfs-24); }
	.new_portfolio .home-sec-02 .main-row .columns:nth-child(2) ul li:nth-child(1),.new_portfolio .home-sec-02 .main-row .columns:nth-child(2) ul li:nth-child(2){width:100%;}
	.new_portfolio .home-sec-02 .main-row .columns:nth-child(2) img.stack-card-img{position:static; width:100%;}
}

@media (max-width: 480px) {
	.new_portfolio .home-sec-hero .content-wrapper { padding-block: 2rem;}
	.new_portfolio .home-sec-01 .colors-wrapper {flex-wrap:wrap;padding: 1.5rem;gap: 2rem;}
	.new_portfolio .home-sec-01 .colors-wrapper li:not(:last-child) {width: 120px; height: auto;}
	.new_portfolio .home-sec-01 .colors-wrapper li span:nth-child(1) { height: 120px;}
	.new_portfolio .home-sec-01 .box-wrapper {flex-direction: column; gap:1.5rem;}
	.new_portfolio .home-sec-01 .box-wrapper li { width: 100%; }
	.new_portfolio .home-sec-01 .shape-boxes {margin-block:1.5rem; padding-inline:1.5rem; flex-direction: column; gap:0rem;}
	.new_portfolio .home-sec-01 .shape-boxes li {width:100%;padding-block:1.5rem;display: flex;flex-direction: row;gap: 2rem;}
	.new_portfolio .home-sec-01 .shape-boxes li span {font-size: var(--rfs-24);width: 100%;}
	.new_portfolio .home-sec-01 .shape-boxes li img { width: 40%;}
	.new_portfolio .home-sec-01 .img-container li:nth-of-type(3) {height: 250px;}
	.new_portfolio .home-sec-01 .img-container li:nth-of-type(3) img:nth-child(1) {width:60%;}
	.new_portfolio .home-sec-01 .img-container li:nth-of-type(3) img:nth-child(3) {width:54%;}
	.new_portfolio .home-sec-01 .img-container li:nth-of-type(3) img:nth-child(2) {left:75%;}
	.new_portfolio .home-sec-02 .main-row .columns:nth-child(1) { height: 250px;}
	.new_portfolio .home-sec-02 .main-row .columns:nth-child(1) ul li:nth-child(1) .vid-screen { width: 70%; }
	.new_portfolio .home-sec-02 .main-row .columns:nth-child(1) ul li:nth-child(2) {gap: 1.2rem; }
	.new_portfolio .home-sec-02 .main-row .columns:nth-child(3) .vid-screen {top: 34.4%;left: 35.2%;width: 30.4%;height: 36.8%;border-radius: 0px;}
}