/* * {
  outline: 1px solid #f00 !important;
} */


/******GLOBAL STYLES*********/
@media (max-width: 767px) { .hidden-sm {display: none;} .hidden-lg {display: block;}}
@media (min-width: 768px) { .hidden-sm {display: block;} .hidden-lg {display: none;}}
.no-break { white-space: nowrap; }
.bkg-white {background: #fff;}
.text-xlit {font-weight: 200 !important;}
.text-black {color: #000;}
.text-white {color: #fff;}
h1,
.h1 {font-family: 'Poppins', sans-serif;font-weight: 600;font-size: 2.8125em;line-height: 1.08888889;}
@media (min-width: 768px) {
  h1,
  .h1 {font-size: 3.75em;line-height: 1.08333333;}
}

  h2,
.h2 {font-family: 'Poppins', sans-serif;font-weight: 600;font-size: 2.1875em;line-height: 1.14285714;}
@media (min-width: 768px) {
  h2,
  .h2 {font-size: 2.8125em;line-height: 1.22222222;}
}
h3,
.h3 {font-family: 'Poppins', sans-serif;font-weight: 600;font-size: 1.625em;line-height: 1.15384615;}
@media (min-width: 768px) {
  h3,
  .h3 {font-size: 1.875em;line-height: 1.16666667;}
}
.h4 {text-transform: uppercase;letter-spacing: 1px;}
h4,
.h4 {font-family: 'Poppins', sans-serif;font-weight: bold;font-size: 1em;line-height: 1;}
@media (min-width: 768px) {
  h4,
  .h4 {font-size: 1.125em;line-height: 1;}
}
h5,
.h5 {font-family: 'Poppins', sans-serif;font-weight: bold;font-size: 1.375em;line-height: 1.18181818;}
@media (min-width: 768px) {
  h5,
  .h5 {font-size: 1.5em;line-height: 1.16666667;}
}
h6,
.h6 {font-family: 'Poppins', sans-serif;font-weight: bold;font-size: 1.125em;line-height: 1.55555556;}
@media (min-width: 768px) {
  h6,
  .h6 {font-size: 1.125em;line-height: 1.55555556;}
}
p,
.p,
.copy {font-family: 'Poppins', sans-serif;font-size: 1em;line-height: 1.375;}
@media (min-width: 768px) {
  p,
  .p,
  .copy {font-size: 1em;line-height: 1.375;}
}

.copy-lg {font-family: 'Poppins', sans-serif;font-size: 1.25em;line-height: 1.3;}
@media (min-width: 768px) {
  .copy-lg {font-size: 1.25em;line-height: 1.3;}
}

small,
.small {font-family: 'Poppins', sans-serif;font-size: 0.75em;line-height: 1.16666667;}
@media (min-width: 768px) {
  small,
  .small {font-size: 0.75em;line-height: 1.16666667;}
}

.btn {min-height: 40px;font-family: 'Poppins', sans-serif;font-weight: bold;font-weight: 600;border-radius: 100px;overflow: hidden;}
.btn .btn-text {position: relative;z-index: 3;}
.btn.btn-primary {background: transparent;color: #fff;border: 0;position: relative;padding: 8px 15px;}
.btn.btn-primary:before {content: "";position: absolute;border-radius: 100px;display: block;height: 100%;width: 100%;background: #26AD58;top: 0;left: 0;z-index: 1}
.btn.btn-primary:after {content: "";position: absolute;border-radius: 100px;display: block;height: 100%;width: 100%;background: transparent;border: 2px solid #26AD58;top: 0;left: 0;z-index: 2;transform: scale(0);opacity: 0;box-sizing: border-box;}
@media (min-width: 768px) {
  .btn {transition: color 0.45s;min-height: 55px;}
  .btn.btn-primary {padding: 15px 55px;}
  .btn.btn-primary:before {transition: background 0.45s;}
  .btn.btn-primary:after {transition: transform 0.45s, opacity 0.45s;}
  .btn:focus,
  .btn:hover {transition: color 0.3 0.05s;}
  .btn:focus.btn-primary,
  .btn:hover.btn-primary {color: #26AD58;}
  .btn:focus.btn-primary:before,
  .btn:hover.btn-primary:before {transition: background 0.35s;background: #fff;}
  .btn:focus.btn-primary:after,
  .btn:hover.btn-primary:after {transition: transform 0.15s 0.05s, opacity 0.15s 0.05s;transform: scale(1);opacity: 1;}
}
html,
body {font-size: 16px;}
@media (min-width: 768px) {
  html,
  body {font-size: 16px;}
}
html *:focus,
body *:focus {outline-color: #26AD58;}
html {background: #26AD58;}
body {background: #14181A;}
* {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.max-container {max-width: 1200px;display: block;margin-left: auto;margin-right: auto;}
#footer {background: #000;padding-top: 25px;z-index: 3;position: relative;}
#footer .logo {max-width: 165px;margin-bottom: 15px;}
#footer .footer-link {clear: both;color: #fff;font-family: 'Poppins', sans-serif;font-weight: bold;font-weight: 600;text-align: center;width: 100%;font-size: 1em;display: block;padding: 6px;}
#footer .small {text-align: center;width: 100%;display: block;}
#footer .social-links {list-style: none;padding: 0;display: table;margin: 12px auto;}
#footer .social-links .social-link {color: #26AD58;float: left;padding: 0 10px;}
#footer .social-links .social-link .icon {height: 26px;width: auto;}
@media (min-width: 992px) {
  #footer {padding-top: 65px;padding-bottom: 76px;}
  #footer .logo {max-width: 146px;margin-bottom: 15px;float: left;margin-right: 24px !important;}
  #footer .footer-link {clear: initial;color: #fff;font-family: 'Poppins', sans-serif;font-weight: bold;font-weight: 600;text-align: left;float: left;width: auto;font-size: 1em;display: block;padding: 6px;margin: 0 24px;}
  #footer .small {text-align: right;width: 100%;display: block;}
  #footer .social-links {list-style: none;padding: 0;display: table;margin-right: 0;margin-top: 0;}
  #footer .social-links .social-link {color: #26AD58;float: left;padding: 0 10px;}
  #footer .social-links .social-link .icon {height: 25px;width: auto;}
}
.link {text-decoration: underline;}
.link.text-white {color: #fff;}
.link.text-black {color: #000;}
.link:hover {text-decoration: none;}


/************************New VidiMo Styles***************************/
.text-new-green { color: #0acc4f;}
.copy-small { font-size: 0.5em; }
.copy-medium { font-size: 0.8750em; font-family: 'Poppins', sans-serif;}
.font-weight-reg { font-weight: 400; }
.text-xlit { font-weight: 600 !important; }
.disclaimer {position: absolute; color: #595959; bottom: 2px;left: 2px; font-size: .4em;}
@media (min-width: 576px) {
  .disclaimer {bottom: 6px;left: 8px; font-size: .5em;}
}

.fadein {opacity: 0;transition: all 1.5s;transform: translate(0, 50px);}  
.fadein.visible {opacity: 1;transform: translate(0, 0);}

/********* Hero *********/
.hero-01 {min-height: 670px;background: url("../img/hero-mobile.jpg") center center / cover no-repeat; text-align: center; position: relative;padding-top: 54px;padding-right: 0px;padding-left: 0px;padding-bottom: 48px;overflow: hidden;}
.hero-01 .logo { max-width: 195px; margin: 0 auto; }
.hero-01 .btn { margin: 0 auto; }
.hero-01 .content-bottom { position: absolute; display: block; bottom: 50px; left: 50%; transform: translate(-50%, 0); width: 100%; }
@media (min-width: 768px) {
    .hero-01 {background: url("../img/hero-desktop.jpg") center center / cover no-repeat; text-align: left; margin-top: 0px; padding-top: 189px; padding-bottom: 189px; min-height: 400px;max-height: 750px;min-height: 57vw;padding-left: 30px;padding-right: 30px;display: flex;align-items: center;}
    .hero-01 .logo { max-width: 315px; margin: 0; }
    .hero-01 .btn { margin: 0; }
    .hero-01 .content-bottom { display: none; }
  }

  .splash {position: fixed;top: 0;left: 0;display: flex;justify-content: center;align-items: center;width: 100%;z-index: 200;height: 100vh;background-color: #000;}
  .splash .splash-content {z-index: 1;}

  .hero-01 .logo {opacity: 0;}
  .hero-01 .h2 {opacity: 0;}
  .hero-01 .h5 {opacity: 0;}
  .hero-01 .btn {opacity: 0;}

/********* Intro *********/
.intro {padding-top: 64px;padding-bottom: 0px;}
.intro .container-fluid {margin-bottom: -1px;}
.intro .product-img {width: 100%; margin: 0 auto; }

.intro .slick-container{ width: 100%; margin: 0 auto; position: relative;overflow: hidden;}
.intro .slick-list .slick-track {overflow: hidden;}


.intro .arrow { display: none !important;  border: none; height: 60px;bottom: 47%;opacity: 1;padding: 0;position: absolute;visibility: visible;width: 60px;z-index: 1;cursor: pointer; background: #14181a; border-radius: 50%; transition: .25s ease-in-out;}
.intro .arrow:hover {background: #0acc4f;}
.intro .arrow img{transition: .35s;width: 24%;position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);}
.intro .arrow.next {right: -30px;}
.intro .arrow.next img {transform: translate(-118%,-50%);}
.intro .arrow.prev {left: -30px;}
.intro .arrow.prev img{ transform: translate(28%,-50%);}

.intro .slick-dots {bottom: 0;}
.intro .slick-dots li {width: 13px; height: 13px;}
.intro .slick-dots li button {padding: 0px;}
.intro .slick-dots li button:before {content: none;}
.intro .slick-dotted.slick-slider {margin-bottom: 60px;}
.intro .slick-slider-dots {position: absolute;bottom: 24px;right: 0;display: flex; width: 100%; }
.intro .slick-slider-dots ul {display: flex;list-style: none;margin: 0;padding: 0; justify-content: center;}
.intro .slick-slider-dots ul li {margin: 0 3px;}
.intro .slick-slider-dots ul li button {background: #fff;height: 13px;width: 13px;border-radius: 50%;border: 2.5px solid #14181a;overflow: hidden;}
.intro .slick-slider-dots ul li.slick-active button {background: #14181a;color: #14181a;}

@media (min-width: 576px) { 
  .intro .product-img {width: 72%; }
  .intro .slick-dotted.slick-slider {margin-bottom: 0px;}
  /* .intro .slick-slider-dots {bottom: 32px;right: 186px;} */
  .intro .arrow { display: block !important; height: 35px; bottom: 4.6%; width: 35px;z-index: 1;}
  .intro .arrow img{ width: 25%; top: 50%; left: 50%; transform: translate(-50%,-50%);}
  .intro .arrow.next {right: 45px;}
  .intro .arrow.next img {transform: translate(-32%,-50%);}

  .intro .arrow.prev {left: auto;right: 95px;}
  .intro .arrow.prev img{ transform: translate(-71%,-50%);}
}

/*********  Livestream Anywhere *********/
.livestream-anywhere {padding-top: 100px; padding-bottom: 70px;}
/* .livestream-anywhere .icon {width: 100%; height: auto; max-width: 120px; display: block; margin-bottom: 0px;} */
.livestream-anywhere .icon {width: 100%; height: auto; max-height: 50px; display: block; margin-bottom: 0px;}

@media (min-width: 768px) {
  /* .livestream-anywhere .icon {max-width: 165px; margin-bottom: 0px;} */
  .livestream-anywhere .icon {max-height: 60px; margin-bottom: 0px;}
}


/********* HDMI Enabled *********/
.HDMI-enabled {padding-top: 70px; padding-bottom: 0px; background: #0b0d0e;}
.HDMI-enabled .cameras {width: 100%;}


/********* Multiple Views *********/
.multiple-views {padding-top: 70px; padding-bottom: 70px;}
.multiple-views .video-container { max-width: 960px; display: flex; justify-content: center;}
.multiple-views .video-container .poster { width: 100%;}


/********* Any Project *********/
.any-project {background: #14181A; padding-top: 64px; padding-bottom: 30px; position: relative; z-index: 3;}
.any-project .max-container {max-width: 900px;}
.any-project .icon {width: 100%; height: auto; max-width: 50px; display: block; margin-bottom: 10px;}
.any-project .copy {display: block; max-width: 620px; margin-left: auto; margin-right: auto;}
@media (min-width: 768px) {
  .any-project {padding-top: 56px; padding-bottom: 60px;}
  .any-project .icon {max-width: 85px; margin-bottom: 10px;}
}


/********* Specifications *********/
.specifications {padding-top: 70px; padding-bottom: 70px;}
.specifications .specifications-img {width: 100%; }



/********* Mobile Studio *********/
.mobile-studio {padding-top: 70px; padding-bottom: 160px;}
.mobile-studio .logo {max-width: 95px;}
.mobile-studio .apple-logo-container {justify-content: flex-end;}
.mobile-studio .google-logo-container {justify-content: flex-start;}
.mobile-studio .apple-logo,
.mobile-studio .google-logo {height: 45px;display: block;max-height: 50px;float: right;padding: 0 10px;}
.mobile-studio .apple-logo img,
.mobile-studio .google-logo img {height: 100%;width: auto;}
@media (min-width: 404px) {
  .mobile-studio .apple-logo,
  .mobile-studio .google-logo {height: 45px;}
}
@media (min-width: 768px) {
  .mobile-studio .apple-logo,
  .mobile-studio .google-logo {height: 50px;}
}
.mobile-studio .google-logo {float: left;}

@media (max-width: 375px) {
  .mobile-studio .apple-logo-container,
  .mobile-studio .google-logo-container {justify-content: center;}
}

.mobile-studio .phone-carousel {position: relative; }
.mobile-studio .slick-container{ width: 100%; margin: 0 auto; position: relative; max-width: 1250px; left: 0px; margin-top: 45px;}
.mobile-studio .phone-carousel #carousel-2 {display: flex; flex-direction: column;}
.mobile-studio .phone-carousel .slider-for {display: block;position: absolute;z-index: 10;top: 100%; width: 100%; height: 100%; margin-top: 10px;}
.mobile-studio .phone-carousel .slider-for .slick-list {height: 100%; overflow: hidden;}
.mobile-studio .phone-carousel .slider-for .slick-list .slick-track {height: 100%;}
.mobile-studio .phone-carousel .slider-for .slick-list .slide{display: block; z-index: 1 !important;}
.mobile-studio .phone-carousel .slider-for .slick-list .slide .copy{max-width: 550px;position: relative; text-align: center; padding-left: 30px; padding-right: 30px; margin: 0 auto;}

.mobile-studio .phone-carousel .slider-nav {width: 80%;position: relative;left: 50%; transform: translate(-50%, 0);}
.mobile-studio .phone-carousel #carousel-2:after {content: none;}
.mobile-studio .phone-carousel .slider-nav .slide { max-width: 625px;}
.mobile-studio .phone-carousel .slider-nav .slide img {width: 100%;}

.mobile-studio .arrow {display: none !important; border: none; height: 60px;bottom: 35%;opacity: 1;padding: 0;position: absolute;visibility: visible;width: 60px;z-index: 10;cursor: pointer; background: #14181a; border-radius: 50%; transition: .25s ease-in-out;}
.mobile-studio .arrow:hover {background: #0acc4f;}
.mobile-studio .arrow img{transition: .35s;width: 24%;position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);}
.mobile-studio .arrow.next {right: -30px;}
.mobile-studio .arrow.next img {transform: translate(-118%,-50%);}

.mobile-studio .arrow.prev {left: -30px;}
.mobile-studio .arrow.prev img{ transform: translate(28%,-50%);}

.mobile-studio .slick-dotted.slick-slider {margin-bottom: 0;}


@media (min-width: 576px) {
  .mobile-studio .phone-carousel .slider-for {display: block;position: absolute;z-index: 10;top: 100%; width: 100%; height: 100%; margin-top: 10px;}
}
@media (min-width: 768px) {
  .mobile-studio {padding-bottom: 100px;}
  .mobile-studio .slick-container{ margin-top: 95px;}
  .mobile-studio .phone-carousel #carousel-2 {display: flex; flex-direction: row;}
  .mobile-studio .phone-carousel .slider-for {width: 50%; position: relative; height: inherit; margin-top: 0px;}
  .mobile-studio .phone-carousel .slider-for .slick-list {overflow: hidden;}
  .mobile-studio .phone-carousel .slider-for .slick-list .slide{display: flex;align-items: center; justify-content: flex-start;}
  .mobile-studio .phone-carousel .slider-for .slick-list .slide .copy{max-width: 350px;position: absolute; text-align: left; left: 39.5%; transform: translate(0, 0); padding-left: 0px; padding-right: 15px;}
  
  .mobile-studio .phone-carousel .slider-nav {width: 50%; left: 8%; transform: translate(0, 0);}
  .mobile-studio .phone-carousel #carousel-2:after {content: "";background: url("../img/iPhone8.png") center center / contain no-repeat;position: absolute;display: block;z-index: 1;width: 100%;height: 113.6%;overflow: hidden;top: -6.8%;left: -17.1%;}
  
  .mobile-studio .arrow {display: block !important; border: none; height: 35px;bottom: -2.4%;opacity: 1;padding: 0;position: absolute;visibility: visible;width: 35px;z-index: 10;cursor: pointer; background: #14181a; border-radius: 50%; transition: .25s ease-in-out;}
  .mobile-studio .arrow:hover {background: #0acc4f;}
  .mobile-studio .arrow img{transition: .35s;width: 25%;position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);}
  .mobile-studio .arrow.next {right: 22.1%;}
  .mobile-studio .arrow.next img {transform: translate(-32%,-50%);}
  .mobile-studio .arrow.prev {left: auto;right: 27.5%;}
  .mobile-studio .arrow.prev img{ transform: translate(-71%,-50%);}
}
@media (min-width: 992px) {
  .mobile-studio .arrow.next {right: 23.5%;}
}
@media (min-width: 1024px) {
  .mobile-studio .arrow {bottom: 15.6%;}
}

/* .mobile-studio .slick-dots {bottom: 0;}
.mobile-studio .slick-dots li {width: 13px; height: 13px;}
.mobile-studio .slick-dots li button {padding: 0px;}
.mobile-studio .slick-dots li button:before {content: none;}

.mobile-studio .slick-slider-dots {position: absolute;bottom: -9px;right: 200px;display: flex;}
.mobile-studio .slick-slider-dots ul {display: flex;list-style: none;margin: 0;padding: 0;}
.mobile-studio .slick-slider-dots ul li {margin: 0 3px;}
.mobile-studio .slick-slider-dots ul li button {background: #fff;height: 13px;width: 13px;border-radius: 50%;border: 2.5px solid #14181a;overflow: hidden;}
.mobile-studio .slick-slider-dots ul li.slick-active button {background: #14181a;color: #14181a;} */


.mobile-studio .slick-dots {bottom: 0;}
.mobile-studio .slick-dots li {width: 13px; height: 13px;}
.mobile-studio .slick-dots li button {padding: 0px;}
.mobile-studio .slick-dots li button:before {content: none;}
.mobile-studio .slick-dotted.slick-slider {margin-bottom: 60px;}
.mobile-studio .slick-slider-dots {position: absolute;bottom: 24px;right: 0;display: flex; width: 100%; }
.mobile-studio .slick-slider-dots ul {display: flex;list-style: none;margin: 0;padding: 0; justify-content: center;}
.mobile-studio .slick-slider-dots ul li {margin: 0 3px;}
.mobile-studio .slick-slider-dots ul li button {background: #fff;height: 13px;width: 13px;border-radius: 50%;border: 2.5px solid #14181a;overflow: hidden;}
.mobile-studio .slick-slider-dots ul li.slick-active button {background: #14181a;color: #14181a;}




/********* Dual Mount *********/
.dual-mount {background: #f5f6f7; padding-top: 70px; padding-bottom: 0px; position: relative;}
.dual-mount .mount-wrap {display: flex; align-items: baseline; padding-bottom: 60px; justify-content: space-between; max-width: 890px; margin: 0 auto;} 
.dual-mount .mount-wrap .mount-1 {flex-direction: column;} 
.dual-mount .mount-wrap .mount-2 {flex-direction: column;} 
.dual-mount .mount-wrap img {width: 80%; padding: 0 15px;} 

@media (min-width: 576px) {
  .dual-mount .mount-wrap img {width: 90%;}
}

/********* Kit Configurations *********/
.kit-configurations {padding-top: 70px; padding-bottom: 70px;}
.kit-configurations:focus {border: 1px solid #26ad58;}
.kit-configurations .img-wrap {max-width: 335px; height: auto; padding-left: 30px; padding-right: 30px; }
.kit-configurations .img-wrap img {width: 100%}
.kit-configurations .copy {max-width: 335px;}
.kit-configurations .includes-btn { background: none; border: none; padding: 5px 5px; display: inline-block; position: relative; margin-bottom: 40px;}
.kit-configurations .includes-btn a { color: #fff; text-decoration: none; display: block; z-index: 1; padding: .4rem 3rem; }
.kit-configurations .includes-btn:hover { cursor: pointer; }
.kit-configurations .includes-btn:before {content: "";height: 14px;width: 14px;display: block;position: absolute; z-index: -1; left: 160px;top: calc(50% - 6px);background: url("../img/arrow-down.svg") center center/contain no-repeat; transition: all 0.35s; transform: rotate(0);}
.kit-configurations .panel-heading.active > .includes-btn:before {content: ""; transform: rotate(180deg)}

.kit-configurations .panel-heading.active .includes-btn > a .expanded {display: block;}
.kit-configurations .panel-heading.active .includes-btn > a .collapsed {display: none;}

.kit-configurations .panel-heading .includes-btn> a .expanded {display: none;}
.kit-configurations .panel-heading .includes-btn > a .collapsed {display: block;}

.kit-configurations .includes-list {width: 100%; margin-left: auto;margin-right: auto;padding: 0 18px;}
/* max-height: 0;
  overflow: hidden;
  transition: max-height .35s ease-in-out; */

@media (min-width: 576px) {
  .kit-configurations .includes-list {width: 70%;}
}
@media (min-width: 768px) {
  .kit-configurations .includes-list {width: 50%;}
}
@media (min-width: 992px) {
  .kit-configurations .includes-list {width: 100%;}
}

.kit-configurations .includes-list {list-style-type: none; padding-left: 30px; text-align: left; margin-bottom: 40px;}
.kit-configurations .includes-list li  { position: relative; padding: 10px 0; border-bottom: 1px solid white; }
.kit-configurations .includes-list li:before  { content: ""; height: 14px; width: 14px; display: block; position: absolute; left: -30px; top: calc(50% - 6px);background: url("../img/check.svg") center center/contain no-repeat; }
.kit-configurations .includes-list .line-break:before { top: calc(50% - 18px) }


/********* Support *********/
.support {padding-top: 70px; padding-bottom: 70px;}
.support .img-wrap {background: green; max-width: 335px; height: auto; }
.support .img-wrap img {width: 100%;}
.support .support-link {height: 100%; height: 100%; left: 0;position: absolute;top: 0;width: 100%;}