body{
	background-color: #000000;
}

@media screen and (min-width: 301px) and (max-width: 900px){
  :root{
    --landscapeWidth: calc(100vw - 60px);
    --landscapeHeight: calc((100vw - 60px)/1.5);
    --square: calc(100vw - 60px);
    --portrait: 130vw;
    --portrait25: 110vw;

    --portraitTriplewidth: calc(100vw - 60px);
    --portraitTripleHeight: 130vw;
  }
	
	div#furniturePortIntro{
    position: relative;
    display: inline-block;
		color: #ffffff;
		width:calc(100% - 60px);
		height: auto;
		padding-top: 120px;
		padding-left: 30px;
  }
	div#furniturePortIntroBG{
		position: absolute;
		width: 60vw;
		height: 80vw;
		background-size: contain;
		background-position: top right;
		background-repeat: no-repeat;
		background-attachment: absolute;
	}
	#furniturePortIntroBG.letsdine{
		top: 100px;
		right: 0px;
	}
	#furniturePortIntroBG.casaSD{
		top: 180px;
		right: 0px;
	}
	#furniturePortIntroBG.husf{
		top: 100px;
		left: 0px;
	}
	#furniturePortIntroBG.casaBP{
		top: 100px;
		right: -5px;
	}
	div#furniturePortTitle{
		display: inline-block;
    width: 100%;
    height: auto;
    font-family: aUltraLight;
    font-size: 6em;
    line-height: 0.8em;
		letter-spacing: -0.025em;
		margin-left: -0.09em;
		mix-blend-mode: difference;
	}
	#furniturePortTitle.letsdine{
		padding-top: 200px;
	}
	#furniturePortTitle.casaSD{
		height: 90vw;
	}
	#furniturePortTitle.husf{
		padding-top: 240px;
		text-align: right;
	}
	#furniturePortTitle.casaBP{
		padding-top: 250px;
	}
	div#furniturePortSubTitle{
		position: relative;
    display: inline-block;
    width: 100%;
    height: auto;
    font-family: aLight;
    font-size: 1em;
    line-height: 1.8em;
		margin-top: 5vh;
  }

	div.furnPortCon{
    display: inline-block;
    width: calc(100vw - 60px);
    height: calc(auto - 35px);
    padding: 0px 30px;
    padding-top: 10vh;
  }
	div.furnPortLinkCon{
    opacity: 0;
    position: relative;
    width: 100%;
    height: 30vh;
    vertical-align: middle;
    overflow: hidden;
		margin-top: -5vh;
    transform: translateY(35px);
    transition: transform 0.5s, opacity 0.5s;
  }
  .furnPortLinkCon.active{
    opacity: 1;
    transform: translateY(0px);
    transition: transform 0.5s, opacity 0.5s;
  }
	div.furnPortLinkImage{
		opacity: 0;
		top: 0;
		position: absolute;
		width: 30vh;
		height: 30vh;
		background-size: contain;
		background-attachment: aboslute;
		background-repeat: no-repeat;
		background-position: center;
		transform: translateX(0);
		transition: transform 0.5s, opacity 0.5s;
	}
	.furnPortLinkImage.active{
		opacity: 1;
		transform: translateX(10%);
		transition: transform 0.5s, opacity 0.5s;
	}
	.furnPortLinkImage.pf1{
		left: 2%;
	}
	.furnPortLinkImage.pf3{
		right: 2%;
	}
	.furnPortLinkImage.pf4{
		left: 5%;
	}
	a.furnPortLink{
		text-decoration: none;
	}
	div.furnPortLinkText{
		position: absolute;
		text-align: center;
		width: 100%;
		height: 15vh;
		margin-top: calc(15vh - 7.5vh);
		mix-blend-mode: difference;
	}
	div.furnPortLinkTitle{
		display: inline-block;
		color: #ffffff;
		font-family: aUltraLight;
		font-size: 4em;
		line-height: 0.65em;
		letter-spacing: -0.025em;
	}
	div.furnPortLinkSubTitle{
		display: inline-block;
		color: #ffffff;
		font-family: bBold;
		font-size: 1em;
		vertical-align: top;
	}
	div.portImageGroup{
    display: inline-block;
    width:calc(100% - 60px);
    height: calc(auto - 35px);
		margin-top: 30px;
		margin-left: 30px;
  }
  .portImageGroup.last{
    margin-bottom: 10vh;
  }
	div.portImageCon{
    display: inline-block;
    opacity: 0;
    width: 100%;
    height: auto;
    background-position: center !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-attachment: absolute !important;
    margin-bottom: 30px;
    -webkit-column-break-inside: avoid !important;
    -moz-column-break-inside: avoid !important;
    column-break-inside: avoid !important;
    transform: translateY(35px);
    transition: transform 0.5s, opacity 0.5s;
  }
	.portImageCon.active{
    opacity: 1;
    transform: translateY(0px);
    transition: transform 0.5s, opacity 0.5s;
  }
	
}

@media screen and (min-width: 901px){
  :root{
    --landscapeWidth: calc(100% - 5vw);
    --landscapeHeight: calc((100vw - 30vh - 8.7em - 90px - 5vw)/1.5);
    --square: calc((100vw - 30vh - 8.7em - 90px - 10vw)/2);
    --portrait: calc(((100vw - 30vh - 8.7em - 90px - 10vw) / 2) * 1.5);
    --portrait25: calc(((100vw - 30vh - 8.7em - 90px - 10vw) / 2) * 1.25);

    --portraitTriplewidth: calc(((100vw - 30vh - 8.7em - 90px - 14.5vw) / 3));
    --portraitTripleHeight: calc(((100vw - 30vh - 8.7em - 90px - 14.5vw) / 3) * 1.5);
  }
	
	div#furniturePortIntro{
    position: relative;
    display: inline-block;
		color: #ffffff;
    width: calc(100% - 7.5vh);
		height: auto;
		padding-top: calc(10vh + 80px);
		padding-left: 7.5vh;
  }
	#furniturePortIntro.casaSD{
		height: calc(100vh - 15vh);
	}
	div#furniturePortIntroBG{
		position: absolute;
		width: 30vw;
		height: 40vw;
		background-size: contain;
		background-position: top right;
		background-repeat: no-repeat;
		background-attachment: absolute;
	}
	#furniturePortIntroBG.letsdine{
		top: 0;
		right: calc(13vh + 80px);
	}
	#furniturePortIntroBG.casaSD{
		top: 13vw;
		right: calc(11vh + 80px);
	}
	#furniturePortIntroBG.husf{
		top: 0;
		right: calc(13vh + 80px);
	}
	#furniturePortIntroBG.casaBP{
		top: 13vw;
		right: calc(11vh + 80px);
	}
	div#furniturePortTitle{
		display: inline-block;
    width: 100%;
    height: auto;
    font-family: aUltraLight;
    font-size: 20em;
    line-height: 0.8em;
		letter-spacing: -0.025em;
		margin-left: -0.09em;
		mix-blend-mode: difference;
	}	
	div#furniturePortSubTitle{
		position: relative;
    display: inline-block;
    width: 50vw;
    height: auto;
    font-family: aLight;
    font-size: 1em;
    line-height: 1.5em;
		margin-top: 5vh;
  }

	div.furnPortCon{
    display: inline-block;
    width: calc(100vw - 30vh - 8.7em - 80px);
    max-width: calc(100vw - 30vh - 8.7em - 80px);
    height: calc(auto - 35px);
    padding: 15vh 0;
    padding-top: 15vh;
    margin-left: calc(15vh + 8.7em);
  }
	div.furnPortLinkCon{
    opacity: 0;
    position: relative;
    width: 100%;
    height: 30vw;
    vertical-align: middle;
    overflow: hidden;
		margin-top: -10vh;
    transform: translateY(35px);
    transition: transform 0.5s, opacity 0.5s;
  }
  .furnPortLinkCon.active{
    opacity: 1;
    transform: translateY(0px);
    transition: transform 0.5s, opacity 0.5s;
  }
	div.furnPortLinkImage{
		opacity: 0;
		position: absolute;
		bottom: 0;
		width: 30vw;
		height: 30vw;
		background-size: contain;
		background-attachment: aboslute;
		background-repeat: no-repeat;
		background-position: center;
		transform: translateX(0);
		transition: transform 0.5s, opacity 0.5s;
	}
	.furnPortLinkImage.active{
		opacity: 1;
		transform: translateX(10%);
		transition: transform 0.5s, opacity 0.5s;
	}
	.furnPortLinkImage.pf1{
		right: calc(50% - 15vw);
	}
	.furnPortLinkImage.pf2{
		left: 10%;
	}
	.furnPortLinkImage.pf3{
		left: 36%;
	}
	a.furnPortLink{
		text-decoration: none;
	}
	div.furnPortLinkText{
		position: absolute;
		text-align: center;
		width: 100%;
		height: 6vw;
		margin-top: calc(15vw - 3vw);
		mix-blend-mode: difference;
	}
	div.furnPortLinkTitle{
		display: inline-block;
		color: #ffffff;
		font-family: aUltraLight;
		font-size: 8em;
		line-height: 0.65em;
		letter-spacing: -0.025em;
	}
	div.furnPortLinkSubTitle{
		display: inline-block;
		color: #ffffff;
		font-family: bBold;
		font-size: 1.5em;
		vertical-align: top;
	}
	div.portImageGroup{
    display: inline-block;
    width: calc(100vw - 30vh - 8.7em - 80px);
    max-width: calc(100vw - 30vh - 8.7em - 80px);
    height: calc(auto - 35px);
		margin-top: 10vh;
    margin-left: calc(15vh + 8.7em);
  }
  .portImageGroup.last{
    margin-bottom: 10vh;
  }
	div.portImageCon{
    opacity: 0;
    width: calc(50% - 5vw);
    float: left;
    height: auto;
    background-position: center !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-attachment: absolute !important;
    margin-bottom: 5vw;
		margin-right: 5vw;
    transform: translateY(35px);
    transition: transform 0.5s, opacity 0.5s;
  }
	.portImageCon.active{
    opacity: 1;
    transform: translateY(0px);
    transition: transform 0.5s, opacity 0.5s;
  }
}

.furnPortLinkImage.pf1{
	background-image: url("../sources/furniture/portfolio/pf1/cover.jpg");
}
.furnPortLinkImage.pf2{
	background-image: url("../sources/furniture/portfolio/pf2/pf2-6.jpg");
}
.furnPortLinkImage.pf3{
	background-image: url("../sources/furniture/portfolio/pf3/pf3-1.jpg");
}
.furnPortLinkImage.pf4{
	background-image: url("../sources/furniture/portfolio/pf4/cover.jpg");
}

#furniturePortIntroBG.letsdine{
	background-image: url("../sources/furniture/portfolio/pf1/cover.jpg");
}
#furniturePortIntroBG.casaSD{
	background-image: url("../sources/furniture/portfolio/pf2/cover.jpg");
}
#furniturePortIntroBG.husf{
	background-image: url("../sources/furniture/portfolio/pf3/pf3-2.jpg");
}
#furniturePortIntroBG.casaBP{
	background-image: url("../sources/furniture/portfolio/pf4/cover.jpg");
}

div#pf1_1{
	background: url("../sources/furniture/portfolio/pf1/pf1-1.jpg");
  height: var(--portrait25);
}
div#pf1_2{
	background: url("../sources/furniture/portfolio/pf1/pf1-2.jpg");
  height: var(--portrait25);
}
div#pf1_3{
	background: url("../sources/furniture/portfolio/pf1/pf1-3.jpg");
  height: var(--portrait25);
}
div#pf1_4{
	background: url("../sources/furniture/portfolio/pf1/pf1-4.jpg");
  height: var(--portrait25);
}
div#pf1_5{
	background: url("../sources/furniture/portfolio/pf1/pf1-5.jpg");
  height: var(--portrait25);
}
div#pf1_6{
	background: url("../sources/furniture/portfolio/pf1/pf1-6.jpg");
  height: var(--portrait25);
}
div#pf1_7{
	background: url("../sources/furniture/portfolio/pf1/pf1-7.jpg");
  height: var(--portrait25);
}
div#pf1_8{
	background: url("../sources/furniture/portfolio/pf1/pf1-8.jpg");
  height: var(--portrait25);
}

div#pf2_1{
	background: url("../sources/furniture/portfolio/pf2/pf2-1.jpg");
  height: var(--portrait);
}
div#pf2_2{
	background: url("../sources/furniture/portfolio/pf2/pf2-2.jpg");
  height: var(--portrait);
}
div#pf2_3{
	background: url("../sources/furniture/portfolio/pf2/pf2-3.jpg");
  height: var(--portrait);
}
div#pf2_4{
	background: url("../sources/furniture/portfolio/pf2/pf2-4.jpg");
  height: var(--portrait);
}
div#pf2_5{
	background: url("../sources/furniture/portfolio/pf2/pf2-5.jpg");
  height: var(--portrait);
}
div#pf2_6{
	background: url("../sources/furniture/portfolio/pf2/pf2-6.jpg");
  height: var(--portrait);
}

div#pf3_1{
	background: url("../sources/furniture/portfolio/pf3/pf3-1.jpg");
  height: var(--portrait25);
}
div#pf3_3{
	background: url("../sources/furniture/portfolio/pf3/pf3-3.jpg");
  height: var(--portrait25);
}
div#pf3_4{
	background: url("../sources/furniture/portfolio/pf3/pf3-4.jpg");
  height: var(--portrait25);
}

div#pf4_1{
	background: url("../sources/furniture/portfolio/pf4/pf4-1.jpg");
  height: var(--portrait);
}
div#pf4_2{
	background: url("../sources/furniture/portfolio/pf4/pf4-2.jpg");
  height: var(--portrait);
}
div#pf4_3{
	background: url("../sources/furniture/portfolio/pf4/pf4-3.jpg");
  height: var(--portrait);
}
div#pf4_4{
	background: url("../sources/furniture/portfolio/pf4/pf4-4.jpg");
  height: var(--portrait);
}
div#pf4_5{
	background: url("../sources/furniture/portfolio/pf4/pf4-5.jpg");
  height: var(--portrait);
}
div#pf4_6{
	background: url("../sources/furniture/portfolio/pf4/pf4-6.jpg");
  height: var(--portrait);
}
div#pf4_7{
	background: url("../sources/furniture/portfolio/pf4/pf4-7.jpg");
  height: var(--portrait);
}
div#pf4_8{
	background: url("../sources/furniture/portfolio/pf4/pf4-8.jpg");
  height: var(--portrait);
}
div#pf4_9{
	background: url("../sources/furniture/portfolio/pf4/pf4-9.jpg");
  height: var(--portrait);
}
div#pf4_10{
	background: url("../sources/furniture/portfolio/pf4/pf4-10.jpg");
  height: var(--portrait);
}
div#pf4_11{
	background: url("../sources/furniture/portfolio/pf4/pf4-11.jpg");
  height: var(--portrait);
}
div#pf4_12{
	background: url("../sources/furniture/portfolio/pf4/pf4-12.jpg");
  height: var(--portrait);
}
div#pf4_13{
	background: url("../sources/furniture/portfolio/pf4/pf4-13.jpg");
  height: var(--portrait);
}
div#pf4_14{
	background: url("../sources/furniture/portfolio/pf4/pf4-14.jpg");
  height: var(--portrait);
}
div#pf4_15{
	background: url("../sources/furniture/portfolio/pf4/pf4-15.jpg");
  height: var(--portrait);
}
div#pf4_16{
	background: url("../sources/furniture/portfolio/pf4/pf4-16.jpg");
  height: var(--portrait);
}
div#pf4_17{
	background: url("../sources/furniture/portfolio/pf4/pf4-17.jpg");
  height: var(--portrait);
}
div#pf4_18{
	background: url("../sources/furniture/portfolio/pf4/pf4-18.jpg");
  height: var(--portrait);
}
div#pf4_19{
	background: url("../sources/furniture/portfolio/pf4/pf4-19.jpg");
  height: var(--portrait);
}
div#pf4_20{
	background: url("../sources/furniture/portfolio/pf4/pf4-20.jpg");
  height: var(--portrait);
}
div#pf4_21{
	background: url("../sources/furniture/portfolio/pf4/pf4-21.jpg");
  height: var(--portrait);
}
div#pf4_22{
	background: url("../sources/furniture/portfolio/pf4/pf4-22.jpg");
  height: var(--portrait);
}
div#pf4_23{
	background: url("../sources/furniture/portfolio/pf4/pf4-23.jpg");
  height: var(--portrait);
}
div#pf4_24{
	background: url("../sources/furniture/portfolio/pf4/pf4-24.jpg");
  height: var(--portrait);
}
div#pf4_25{
	background: url("../sources/furniture/portfolio/pf4/pf4-25.jpg");
  height: var(--portrait);
}
div#pf4_26{
	background: url("../sources/furniture/portfolio/pf4/pf4-26.jpg");
  height: var(--portrait);
}
div#pf4_27{
	background: url("../sources/furniture/portfolio/pf4/pf4-27.jpg");
  height: var(--portrait);
}
