

.text_3d {
    /*position: absolute;*/
    /*top: 50%; */
    /*right: 50%;*/
    /*transform: translate(50%,-50%);*/
    /*text-transform: uppercase;*/
    /*font-family: verdana;*/
    /*font-size: 12em;*/
    /*font-weight: 700;*/
    /*color: #000;*/
    text-shadow: 1px 1px 1px #919191,
        1px 2px 1px #919191,
        1px 3px 1px #919191,
        1px 4px 1px #919191,
        1px 5px 1px #919191,
        1px 6px 1px #919191,
        1px 7px 1px #919191,
        1px 8px 1px #919191,
        1px 9px 1px #919191,
        1px 10px 1px #919191,
    1px 18px 6px rgba(16,16,16,0.4),
    1px 22px 10px rgba(16,16,16,0.2),
    1px 25px 35px rgba(16,16,16,0.2),
    1px 30px 60px rgba(16,16,16,0.4);
}


.copy-box 
{
  /*position: relative;*/
  height:  200px;
  top: 0;
  right: 0;
  font-family: sans-serif;
  /*transform: rotate(-45deg);*/
  /*transform: perspective(30px) rotateY(10deg) rotateZ(40deg);*/
  z-index: -1;
}
.copy-box .line
{
  position: absolute;
  background-color: #202c46;
  box-shadow: 0px 0px 12px #202c46;
  width: 4px;
  height: calc(100% - 20px);
  top: 10px;
  left: 22px;
  /*border-radius: 50%;*/
  overflow: hidden;

}

.copy-box .line .scanner 
{
  transform: translateZ(0);

  position: absolute;
  top: 0;
  left: 0;
  background: #ffff;
  width: 100%;
  align-content: center;
  transform: translate(-50%, -50%)
  height: 50px;
  /*border-radius: 50%;*/

    box-shadow:
    0 0 60px 30px #fff,  /* inner white */
    0 0 100px 60px #60bbea, /* middle magenta */
    0 0 140px 90px #fff; /* outer cyan */

/*    box-shadow:
    0 0 60px 30px #ffff,
    0 0 100px 60px #ffff,
    0 0 140px 90% #ffff;
*/


  animation: scanner-loop 3s ease-in-out infinite;
}


@keyframes scanner-loop
{
  0% 
  {
    top: 0;
  }
  50%
  {
    top: 100%;
  }
  100%
  {
    top: 0;
  }
}



















.shadow {
  filter: drop-shadow(3px 5px 2px rgb(0 0 0 / 0.4));
  /* Similar syntax to box-shadow */
}

























#fiber_network_content{
  position:relative;
}
.mydiv{
  /*border:1px solid #368ABB;*/
  /*background-color:#43A4DC;*/
  position:absolute;
  z-index: -1;
}
.mydiv:after{
  /*content:no-close-quote;*/
  position:absolute;
/*  top:50%;
  left:50%;
*/  /*background-color:black;*/
  width:4px;
  height:4px;
  /*border-radius:50%;*/
  /*margin-left:-2px;*/
  /*margin-top:-2px;*/
}
#node1{
  left:1%;
  top:10vh;
  width:50px;
  height:40px;
}

#node2{
  left:1%;
  top:90vh;
  width:50px;
  height:50px;
}
#node3{
  left:15%;
  top:70vh;
  width:50px;
  height:50px;
}
#node4{
  left:30%;
  top:80vh;
  width:50px;
  height:50px;
}
#node5{
  left:40%;
  top:60vh;
  width:50px;
  height:50px;
}
#node6{
  left:50%;
  top:75vh;
  width:50px;
  height:50px;
}
#node7{
  left:60%;
  top:30vh;
  width:50px;
  height:50px;
}
#node8{
  left:70%;
  top:45vh;
  width:50px;
  height:50px;
}
#node9{
  left:70%;
  top:45vh;
  width:50px;
  height:50px;
}
#node10{
  left:75%;
  top:45vh;
  width:50px;
  height:50px;
}
#node11{
  left:75%;
  top:55vh;
  width:50px;
  height:50px;
}
#node12{
  left:85%;
  top:55vh;
  width:50px;
  height:50px;
}
#node13{
  left:85%;
  top:10vh;
  width:50px;
  height:50px;
}
#line{
  /*position:absolute;*/
  /*width:4px;*/
  /*background-color:red;*/

    /*background-color: #202c46;*/
  /*box-shadow: 0px 0px 12px #202c46;*/
  /*width: 4px;*/
  /*height: calc(100% - 20px);*/
  /*top: 10px;*/
  /*left: 22px;*/

}  


















