﻿



/* Buit-in Automation
=================================================*/

/* screen css start */
.cec-canvas {
  position: relative;
  display: block;
  width: 100%;
  overflow:  hidden;
  background-color: #fff;
}

.large-tv {
  width: 27%;
  max-width: 619px; /* optional */
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}

.hidden {
	display: none;
}

.large-tv > .screen, .graphic {
  position: relative; /* so its over the wire */
}

.screen .overlay-img {
  position: absolute;
  left: 4.2%; /* 26px / 619px * 100 */
  right: 4.2%; /* 26px / 619px * 100 */
  top: 6.12%; /* 24px / 392px * 100 */
}

.large-tv > .wire  {
  margin-top: -4.5%;
  margin-bottom: -4.5%;
}

.large-tv > .product {
  position: relative; /* so its over the wire */
}

.bottom-elements {
  position: relative;
  margin-top: 8.5em;
}

.sm-laptop {
  width: 24%;
  max-width: 836px;
  position: absolute;
  top: 40%;
}

.sm-laptop.left { 
  left: 5%;
  transform: translateX(-5%);
}

.sm-laptop.right {
  right: 3%;
  transform: translateX(-3%);
}

.sm-laptop .overlay-img {
  position: absolute;
  left:  21%; /* 176px / 836px * 100 */
  right: 18.8%; /* 157px / 836px * 100 */
  top: 14.3%; /* 80px / 558px * 100 */
}

.cable-graphic {
  width: 11%;
  max-width: 145px;
  position: absolute;
  margin-top: 7.5%;
  z-index: 100
}

.cable-graphic.left {
  position: absolute;
  left: 29%;
  transform: translateX(-29%);
}

.cable-graphic.right {
  position: absolute;
  right: 23%;
  transform: translateX(-23%);
}

button.pulse-btn.left,
button.pulse-btn.right {
    width: 25px;
    height: 25px;
    background-color: #2185D0;
    border: none;
    cursor: pointer;
    position: absolute;
}
button.pulse-btn.left {
    left: 50%;
    top: 0px;
}

button.pulse-btn.right {
    left: 27%;
    top: 0px;
}

button.pulse-btn .bg {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  border-radius: 50% !important;
  border: #2185D0 solid 2px;
  opacity: 0.2;
  animation: pulse 1s infinite alternate;
}

@keyframes pulse {
  0% {
    transform: scale(1,1);
    opacity: 0.2;
  }
  100% {
    transform: scale(1.5, 1.5);
    opacity: 0.5;
  }
}

p.support-text {
  margin-top: 20em;
}
/* End of Buit-in Automation
=================================================*/






/* Embed/De-embed
================================================================ */
/* screen css start */
.embedding-canvas {
  position: relative;
  display: block;
  width: 100%;
  overflow:  hidden;
  background-color: #fff;
}

.embedding-canvas img.embedding-diagram {
  width: 80%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.embedding-canvas figcaption:first-of-type {
  position: absolute;
  left: 12%;
  top: 26%;
  transform: translateY(-26%);
  color: #fff;
}

.embedding-canvas figcaption:nth-of-type(2) {
  position: absolute;
  left: 12%;
  top: 46%;
  transform: translateY(-46%);
}

.embedding-canvas figcaption:nth-of-type(3) {
  position: absolute;
  left: 12%;
  top: 100%;
  transform: translateY(-100%);
}

.embedding-canvas figcaption:nth-of-type(4) {
  position: absolute;
  left: 52%;
  top: 100%;
  transform: translateY(-100%);
}
/* End of Enbed/De-embed
=================================================*/


/* LAN Port
================================================================ */
#lan-port figure {
  display: relative;
}

#lan-port figure figcaption {
  position: absolute;
  top: 8%;
  left: 50%;
  transform: translateX(-50%);
}

#lan-port figure figcaption:nth-of-type(2) {
  top: 94%;
}

img.centralized-monitoring {
  width: 35%;
}

.boardroom img, .meetingroom img, .auditorium img {
  width: 100%;
}

.arrow-left {
  left: 5%;
  margin-top: -10%;
}

.arrow-right {
  right: 5%;
  margin-top: -10%;
}
/* End of LAN Port
=================================================*/




/* IPCP Pro Control Processor
=================================================*/
#iplink-pro .container img {
  width: 100%;
}

figure.ipcp-pro_rear-panel_diagram,
figure.global-configulator-pro {
  position: relative;
}

.ipcp-pro_rear-panel_diagram figcaption {
  position: absolute;
	font-size: 80%;
	line-height: 1.2
}

.ipcp-pro_rear-panel_diagram figcaption:first-of-type {
  margin-top: 8%;
  margin-left: 39%;
}

.ipcp-pro_rear-panel_diagram figcaption:nth-of-type(2) {
  margin-top: 58%;
  margin-left: 52%;
}

.global-configulator-pro figcaption {
  position: absolute;
  margin-top: 1%;
  margin-left: 33%;
}

/*Large devices (desktops, less than 1200px)*/
@media (max-width: 1199.98px) {
  .ipcp-pro_rear-panel_diagram figcaption:first-of-type {
    margin-top: 7%;
    margin-left: 39%;
  }

  .ipcp-pro_rear-panel_diagram figcaption:nth-of-type(2) {
    margin-top: 57%;
    margin-left: 49%;
  }
}
/* End of IPCP Pro Control Processor
=================================================*/
