.video-slim-holder {
	position: relative;
	background-color: #222737;
	height: calc(100vh - 52px);
	min-height: 30rem;
	height: 40%;
	width: 100%;
	overflow: hidden;
  }
  
  .video-slim-holder video {
	position: absolute;
	top: 50%;
	left: 50%;
	min-width: 100%;
	min-height: auto;
	width: auto;
	height: auto;
	z-index: 0;
	-ms-transform: translateX(-50%) translateY(-50%);
	-moz-transform: translateX(-50%) translateY(-50%);
	-webkit-transform: translateX(-50%) translateY(-50%);
	transform: translateX(-50%) translateY(-50%);
  }
  
  .video-slim-content {
	position: relative;
	z-index: 2;
  }
  
  .video-slim-overlay {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	background-color: black;
	opacity: 0.5;
	z-index: 1;
  }


@media (min-width: 1024px) {
    #tabPanel .device.deviceHardwareLaptop {
        width: 632px;
        height: 398px;
        padding: 0
    }
    #tabPanel .device.deviceHardwareLaptop>.controls,
    #tabPanel .device.deviceHardwareLaptop>.deviceScreen {
        -moz-transform: translate(70px, 40px);
        -o-transform: translate(70px, 40px);
        -ms-transform: translate(70px, 40px);
        -webkit-transform: translate(70px, 40px);
        transform: translate(70px, 40px);
        width: 493px;
        height: 308px;
        padding: 0
    }
    #tabPanel .device.deviceHardwareTablet {
        width: 431px;
        height: 281px;
        padding: 0
    }
    #tabPanel .device.deviceHardwareTablet>.controls,
    #tabPanel .device.deviceHardwareTablet>.deviceScreen {
        -moz-transform: translate(18px, 20px);
        -o-transform: translate(18px, 20px);
        -ms-transform: translate(18px, 20px);
        -webkit-transform: translate(18px, 20px);
        transform: translate(18px, 20px);
        width: 388px;
        height: 242px;
        padding: 0
    }
    #tabPanel .device.iPadDevice {
        width: 382px;
        height: 270px;
        padding: 0
    }
    #tabPanel .device.iPadDevice>.controls,
    #tabPanel .device.iPadDevice>.deviceScreen {
        -moz-transform: translate(32px, 18px);
        -o-transform: translate(32px, 18px);
        -ms-transform: translate(32px, 18px);
        -webkit-transform: translate(32px, 18px);
        transform: translate(32px, 18px);
        width: 316px;
        height: 237px;
        padding: 0
    }
}

@media (min-width: 1400px) {
    #tabPanel .device.deviceHardwareLaptop {
        width: 813px;
        height: 512px
    }
    #tabPanel .device.deviceHardwareLaptop>.controls,
    #tabPanel .device.deviceHardwareLaptop>.deviceScreen {
        -moz-transform: translate(90px, 45px);
        -o-transform: translate(90px, 45px);
        -ms-transform: translate(90px, 45px);
        -webkit-transform: translate(90px, 45px);
        transform: translate(90px, 45px);
        width: 634px;
        height: 396px
    }
    #tabPanel .device.deviceHardwarePhone {
        padding: 0;
        max-width: none;
        width: 258px;
        height: 499px
    }
    #tabPanel .device.deviceHardwarePhone>.controls,
    #tabPanel .device.deviceHardwarePhone>.deviceScreen {
        -moz-transform: translate(9px, 33px);
        -o-transform: translate(9px, 33px);
        -ms-transform: translate(9px, 33px);
        -webkit-transform: translate(9px, 33px);
        transform: translate(9px, 33px);
        padding: 0;
        width: 241px;
        height: 426px
    }
    #tabPanel .device.iPhoneDevice {
        width: 248px;
        height: 511px
    }
    #tabPanel .device.iPhoneDevice>.controls,
    #tabPanel .device.iPhoneDevice>.deviceScreen {
        -moz-transform: translate(0, 0);
        -o-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0);
        width: 248px;
        height: 511px
    }
    #tabPanel .device.deviceHardwareTablet {
        width: 574px;
        height: 374px
    }
    #tabPanel .device.deviceHardwareTablet>.controls,
    #tabPanel .device.deviceHardwareTablet>.deviceScreen {
        -moz-transform: translate(24px, 26px);
        -o-transform: translate(24px, 26px);
        -ms-transform: translate(24px, 26px);
        -webkit-transform: translate(24px, 26px);
        transform: translate(24px, 26px);
        width: 517px;
        height: 322px
    }
    #tabPanel .device.iPadDevice {
        width: 536px;
        height: 378px;
        border-radius: 30px
    }
    #tabPanel .device.iPadDevice>.controls,
    #tabPanel .device.iPadDevice>.deviceScreen {
        -moz-transform: translate(35px, 20px);
        -o-transform: translate(35px, 20px);
        -ms-transform: translate(35px, 20px);
        -webkit-transform: translate(35px, 20px);
        transform: translate(35px, 20px);
        width: 458px;
        height: 343px
    }
}


@media (min-width: 1024px) {
    .bubbleRow {
        padding: 60px 60px
    }
}

.deviceHardware {
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    user-select: none
}



.screen video {
    width: 100%;
    height: 100%;
    position: absolute;
    object-fit: contain;
    zoom: 1;
    top: 0;
    left: 0
}

/* .iphone6s {
    width: 250px
}
*/

/* faking iphone suurus on padding-top */

.outer-container {
    width: 100%;
    height: 100%;
    text-align: center;
}
.inner-container {
    display: inline-block;
    position: relative;
}
.video-overlay {
    position: absolute;
    z-index: 1;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    font-family: Helvetica;
    color: #FFF;
    background: url("../images/bg/phone_2.svg") no-repeat;
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    .video-overlay {
        position: absolute;
        z-index: 1;
        left: 0x;
        top: -35px;
        width: 100%;
        height: 100%;
        font-family: Helvetica;
        color: #FFF;
        background: url("../images/bg/phone_2.svg") no-repeat;
    }
}

video {
    width: 100%;
    height: 100%;
}



/**/

.screen {
    background-size: cover;
    overflow: hidden;
    display: block;
    position: absolute;
    border-radius: 27px
}


.iphone6s .deviceHardware {
    padding-top: 60%;
    background: url("../images/bg/phone_.svg") no-repeat
}

.iphone6s .screen {
    width: 97%;
    height: 74.5%;
    top: 2.5%;
    left: calc(3% / 2)
}

@media (max-width: 575.98px) { 
    .video-overlay {
        position: absolute;
        z-index: 1;
        left: 0px;
        top: 0px;
        width: 100%;
        height: 100%;
        font-family: Helvetica;
        color: #FFF;
        background: none
        
    }
    .screen {
        background-size: cover;
        overflow: hidden;
        display: block;
        position: absolute;
        border-radius: 5px;
    }
    
}


#map { position:absolute; top:0; bottom:0; width:100%; }


    #map {
        border-radius: 0px;
        overflow: hidden;
    }
    .h500 {
    line-height:500px;
}
.map-holder {
	position: relative;
	background-color: rgb(0, 255, 255);
	height: calc(100vh - 72px);
	min-height: 25rem;
	height: 20%;
	width: 100%;
	overflow: hidden;
  }
#demovideo .deviceScreen {
    background-image: url("images/activity.png");
}
#demovideo {
    width: 100%;
}

.opacity-0 {
    opacity: 0; }
  
.opacity-10 {
    opacity: 0.1; }
  
.opacity-20 {
    opacity: 0.2; }
  
.opacity-30 {
    opacity: 0.3; }
  
.opacity-40 {
    opacity: 0.4; }
  
.opacity-50 {
    opacity: 0.5; }
  
.opacity-60 {
    opacity: 0.6; }
  
.opacity-70 {
    opacity: 0.7; }
  
.opacity-80 {
    opacity: 0.8; }
  
.opacity-90 {
    opacity: 0.9; }
  
.opacity-100 {
    opacity: 1; }