#divArchitecture {
  /* background-image: url('images/architecture/blueprint.jpg'); */
  /* background-image: linear-gradient(rgba(0, 0, 255, 0.2), rgba(255, 255, 0, 0.2)); */

  border: solid red 1px;
  /* display: none; */
  left: 1vw;
  height: 98vh;
  pointer-events: none;
  position: absolute;
  top: 1vh;
  width: 98vw;
}

#imgBlueprint {
  left: 20vw;
  height: 60vh;
  /* height: auto; */
  position: absolute;
  /* position: relative; */
  top: 20vh;
  width: 60vw;
}
#divMask {

  background: radial-gradient(ellipse at top, #999999fe, transparent),
              radial-gradient(ellipse at bottom, #25252525, transparent);
  /* border: solid red 1px; */
  /* display: none; */
  left: 11vw;
  height: 78vh;
  /* pointer-events: none; */
  position: absolute;
  top: 11vh;
  width: 78vw;
}
.vids {
  cursor: grab;
  position: absolute;
  transition-duration: 4.7s;
  transition-timing-function: cubic-bezier(0.2, 1.7, 0.4, 0.9);
  opacity: 0;
  pointer-events: all;
}
#vid1040NY {
  position: absolute;
  border: 1px solid green;
  height: auto;
  opacity: 0;
  /* left: 56vw; */
  /* top: -30vh; */
  width: 40vw;
  /* filter: hue-rotate(180deg); */
  /* left: 1vw; */
  /* top: 1vh; */
  /* width: 96vw; */
  left: 20vw;
  /* top: 33vh; */
  top: 22vh;
}
/* #vid1040NYHighRes {
  position: absolute;
  border: 1px solid #f2f2f2f2;
  height: auto;
  left: 95vw;
  top: 76vh;
  width: 30vw;
} */


.vidLinks {
  font-size: 1.5vh;
  position: absolute;
  left: 66vw;
  opacity: 0;
  pointer-events: all;
  width: 30vw;
  transition-duration: 4.2s;
  transition-timing-function: cubic-bezier(0.2, 1.7, 0.4, 0.9);
}
/* #a1040NY18 {
  top: 40vh;
}
#a1040NY11 {
  top: 43vh;
}
#a1040NY6 {
  top: 46vh;
} */

.vidLabels {
  font-size: 22px;
  opacity: 0;
  position: absolute;
  width: 40vw;
  transition-duration: 3.2s;
  transition-timing-function: cubic-bezier(0.2, 1.7, 0.4, 0.9);
}

#p1040NY {
  left: 80vw;
  top: -15vh;
}
#pMore {
  left: 66vw;
  top: 89vh;
}

/* #aMore36 {
  top: 92vh;
}
#aMore22 {
  top: 95vh;
}
#aMore11 {
  top: 98vh;
} */


#svgArchitecture {
  /* background: lightgreen; */
  /* border: 3px solid green; */
  height: 98vh;
  left: 0vw;
  overflow: visible;
  /* pointer-events: none; */
  position: absolute;
  top: 0vh;
  transition-duration: 3s;
  transition-timing-function: cubic-bezier(0.4, -1.14, 0.52, 1.81);
  width: 98vw;
}


#gOffsiteIcon1 {
  pointer-events: all;
  transform: translate(20%, -35%) rotateY(1175deg);
  transform-origin: 92%;
  transition-duration: 3.2s;
}
#gOffsiteIcon1:hover {
  opacity: 1;
}
#cirOffsiteIcon1:hover {
  stroke: #4EB3F2f2;
  stroke-width: .3%;
}
#plyChangeResIcon1:hover {
  opacity: 1;
}
#lChangeResIcon1:hover {
  opacity: 1;
}

#gOffsiteIcon2 {
  pointer-events: all;
  /* transform: translate(20%, -35%) rotateY(1175deg); */
  transform: translate(20%, -35%) rotateY(1175deg);
  transform-origin: 96%;
  transition-duration: 3.2s;
}
.offsiteIcons {
  transition-duration: .4s;
}
#gOffsiteIcon2:hover {
  opacity: 1;
}
#cirChangeResIcon2:hover {
  stroke: #4EB3F2f2;
  stroke-width: .3%;
}
#plyChangeResIcon2:hover {
  opacity: 1;
}
#lChangeResIcon2:hover {
  opacity: 1;
}



/* dialogSVG   dialogSVG   dialogSVG */
/* dialogSVG   dialogSVG   dialogSVG */
/* dialogSVG   dialogSVG   dialogSVG */
/* dialogSVG   dialogSVG   dialogSVG */

.dialogSVG {
  /* background-color: pink; */
  height: 100vh;
  /* height: 50vh; */
  left: 0vw;
  /* opacity: 0; */
  overflow: visible;
  pointer-events: all;
  position: absolute;
  top: 0vh;
  transform: scale(.4);
  transition-duration: 1.2s;
  width: 100vw;
}
#svgOffsite {
  transform: translate(20%, -30%) scale(.5);
}
.dialogRect { /* rectOffsite */
  /* fill: #525252fe; */
  fill: #C0D0F0;
  /* fill: cyan; */
  height: 100%;
  position: absolute;
  /* stroke: #525252f2; */
  stroke: #4EB3F2a2;
  stroke-width: 0.5%;
  width: 100%;
}
.dialogLbl{  /*lblOffsite*/
  /* fill: #f2f2f2f2; */
  fill: #2f2f2ff2;
  font-size: 80px;
  font-family:'Helvetica Neue';
  transition-duration: 1.2s;
  word-spacing:0px;
}
.dialogTxt {
  fill: #f2f2f2f2;
  font-size: 30px;
  font-family:'Helvetica Neue';
  transition-duration: 1.2s;
  word-spacing:0px;
}
.dialogPrevProj {
  fill: #2f2f2ff2;
  font-size: 40px;
  font-family:'Helvetica Neue';
  stroke: black;
  transition-duration: 1.2s;
}
.dialogMedRes {
  fill: #f2f2f2f2;
  font-size: 40px;
  font-family:'Helvetica Neue';
  transition-duration: 1.2s;
}
.dialogLowRes {
  fill: #f2f2f2f2;
  font-size: 40px;
  font-family:'Helvetica Neue';
  transition-duration: 1.2s;
}

.gCloseOffsiteX {
  /* transform: scale(.5); */
  /* transform: scale(.5) translate(5%, 7%); */
  transform: scale(.5) translate(5%, 17%);
}

.closeXc:hover {
  stroke-width: 5;
}
.closeXl:hover {
  stroke-width: 4;
}





/*
  border: 1px solid black;
  height: auto;
  width: 40vw;
  left: 20vw;
  top: 33vh;
 */




#svgTxt1040NY {
  /* background: pink; */
  /* border: solid red 1px; */
  fill: red;
  /* height: 20vh; */
  height: auto;
  left: 20vw;
  overflow: visible;
  position: absolute;
  transition-duration: 2s;
  stroke: green;
  stroke-width: .3%;
  top: 20vh;
  width: auto;
  width: 40vw;
}

#txt1040NewYork {
    /* fill: #f2f2f2f2; */
    fill: pink;
    font-size: 7.7px;
    font-family:'PlayfairDisplay';
    /* font-family:'Times'; */
    text-anchor: start;
    /* text-align: end; */
    transition-duration: 1.2s;
    transition-duration: 4s;
    transition-timing-function: cubic-bezier(0.2, 0.9, 0.1, 1.3);
    stroke: #2f2f2fff;
    stroke-width: .2%;
    /* word-spacing:0px; */
}




#divThoughts {
  position: absolute;
  top: 80vh; left: 80vw;
  height: 35px; width: 8em;

  background-origin: border-box;
  background-clip: padding-box, border-box;

  background-image: linear-gradient(135deg, #2f2f2f2f, #f2f2f2f2),
                    linear-gradient(135deg, #f2f2f2f2, #2f2f2f2f);

  border: solid .3vmin transparent;
  border-radius: 30px;
  box-shadow: 2px 3px 2px 0px black, inset 1px 1px 1px white;

  /* display: none; */
  font-family:  PlayfairDisplay, Times New Roman, radleyregular, Times, Georgia, serif;
  font-size: 18px;
  /* font-style: italic; */
  padding: .3vmin 0 0 1.7vmin;
  /* padding top/right/bottom/left */
  overflow: clip;
  transition-duration: 1.2s;
}
#pThoughts {
  color: black;
  color: #2f2f2ff2;
  /* mix-blend-mode: difference; */
  /* mix-blend-mode: exclusion; */
  /* mix-blend-mode: lighten; */
  isolation: isolate;
}

/* background: cyan; */
/* border: 1px solid blue; */
/* display: none; */
/* opacity: 0; */
/* transition-duration: 3.2s; */
/* #svgDesEvoXtoClose {
  height: 96vh;
  left: 2vw;
  pointer-events: none;
  position: absolute;
  stroke-linecap: round;
  stroke-linejoin: round;
  top: 2vh;
  transition-duration: 1.2s;
  width: 96vw;
} */












/*  */
