@font-face {
            font-family:'UniversLTW01-49LightUlt';
            src:       url('/a/pgs/Fonts/6bba7e28-1748-401d-91dc-6998ac60e165.eot');
            src:       url('/a/pgs/Fonts/6bba7e28-1748-401d-91dc-6998ac60e165.eot?iefix') format('embedded-opentype'),
                       url('/a/pgs/Fonts/be7ea3ea-e09b-451e-b97c-362668d31c5b.woff') format('woff'),
                       url('/a/pgs/Fonts/6227e606-f97b-4dc5-a971-14169ff750df.ttf') format('truetype'),
                       url('/a/pgs/Fonts/5fbe907d-e311-40df-a30c-b22f1f47d80b.svg#5fbe907d-e311-40df-a30c-b22f1f47d80b') format('svg');
}

/**
* [projectName]
* The main SCSS file for [projectName].
*/
/*------------------------------------*\
    #Helper Classes
    - Responsive
    -- Hide elements by breakpoint
    -- Show elements by breakpoint
    -- Show element only on desktop *recommended*
    -- Show element only on mobile *recommended*
    - Clearfix
    - Text alignment
    - No border classes
    - Basic grid system
\*------------------------------------*/
/*------------------------------------*\
    #Variables
    - Breakpoints
    - Pixel Values
    - Fonts
\*------------------------------------*/
/** Colors **/
/** Breakpoints **/
/** Pixel Values **/
/** Fonts **/
/*------------------------------------*\
    #Mixins
    - Clearfix
    - Breakpoint
    - Overlay
    - Box Sizing
    - Text rendering
    - Create columns
    - Grid system
\*------------------------------------*/
/**
* @mixin clearfix
* Used to clear elements that are floated. Usually used within a container.
*
* @example
*   @include clearfix;
*/
/**
* @mixin breakpoint
* Used to define different styles per breakpoint.
*
* @param $minbp - the min-width for the breakpoint
* @param $maxbp (optional) - if you choose to do a range.
*
* @example
*   @include breakpoint(320px, $tablet-landscape) {
*       color: red;
*   }
*/
/**
* @mixin overlay
* Used to create an overlay.
*
* @example
*   @include overlay;
*/
/**
* @mixin boxSizing
* Used to add box sizing border-box to an element(s)
*
* @example
*   @include boxSizing;
*/
/**
* @mixin text-rendering
* Used to adjust the rendering of a font.
* Note: Not all browsers support this.
*
* @param $style - the type of rendering "smooth" makes type antialiased.
*
* @example
*   @include text-rendering("smooth");
*/
/**
* @mixin create-columns
* Can be used to create a column system.
*
* @param $state - the number to start your column system at, i.e 1
*
* @example
*   @include create-columns(1);
*/
/*
* @mixin grid
* Create a grid system.
*
* @param $cols - number of columns
* @param $gutter - px of margin between columns
* @param $children - class of children
* @example
*   @include grid($cols: 4, $gutter: 0, $children: ".related-content-item");
*/
/*
* @mixin horizontal-center
* Center element Horizontally
* @param $position- Element position type.  Defaults to relative;
* @example
*   @include horizontal-center();
*/
/*
* @mixin vertical-center
* Center element Vertically
* @param $position- Element position type.  Defaults to relative;
* @example
*   @include horizontal-center();
*/
/*
* @mixin box-middle
* Center element vertically and horizontally
* @example
*   @include horizontal-center();
*/
/** Responsive **/
/* Hidden By Breakpoint*/

body.full-width.dronesInfoGraphic > div#wrapper > ol.breadcrumbs.grid3 {
  float: none !important;
  width: auto !important;
  max-width: 1905px !important;
  position: relative !important;
  margin: auto !important;
}

body.full-width.dronesInfoGraphic > div#wrapper > ol.breadcrumbs.grid3 li {
  float: none !important;
  width: 1200px !important;
  margin: 0 auto !important;
}

body.full-width.dronesInfoGraphic > div#wrapper > ol.breadcrumbs a {
    display: block;
    color: #fff;
    padding: 7px 15px 7px 10px;
    text-transform: uppercase;
    text-decoration: none;
    font-size: 1.126em;
    background: transparent url(/a/pgs/images/breadcrumb-chevron.gif) 9% 51% no-repeat;
}

#wrapper {
    overflow: hidden;
}
.hidden-mobile {
  display: none !important;
}
@media (min-width: 768px) {
  .hidden-tablet-portrait {
    display: none !important;
  }
}
@media (min-width: 960px) {
  .hidden-tablet-landscape {
    display: none !important;
  }
}
@media (min-width: 1230px) {
  .hidden-desktop {
    display: none !important;
  }
}
@media (min-width: 1300px) {
  .hidden-large-screens {
    display: none !important;
  }
}

/* Visible by breakpoint */
.visible-mobile {
  display: block;
}
@media (min-width: 768px) {
  .visible-tablet-portrait {
    display: block !important;
  }
}
@media (min-width: 960px) {
  .visible-tablet-landscape {
    display: block !important;
  }
}
@media (min-width: 1230px) {
  .visible-desktop {
    display: block !important;
  }
}
@media (min-width: 1300px) {
  .visible-large-screens {
    display: block !important;
  }
}

/* Show only on desktop */
.show-desktop {
  display: none !important;
}
@media (min-width: 768px) {
  .show-desktop {
    display: block !important;
  }
}
.show-desktop-inline {
  display: none !important;
}
@media (min-width: 768px) {
  .show-desktop-inline {
    display: inline !important;
  }
}
.show-desktop-inline-block {
  display: none !important;
}
@media (min-width: 768px) {
  .show-desktop-inline-block {
    display: inline-block !important;
  }
}

/* Show only on mobile */
@media (min-width: 768px) {
  .show-mobile {
    display: none !important;
  }
}

/** Clearfix **/
.clearfix {
  *zoom: 1;
}
.clearfix:before, .clearfix:after {
  content: " ";
  display: table;
}
.clearfix:after {
  clear: both;
}

/** Text Alignment **/
.text-left {
  text-align: left !important;
}

.text-center {
  text-align: center !important;
}

.text-right {
  text-align: right !important;
}

/** No Border classes **/
.no-border-top {
  border-top: 0 !important;
}

.no-border-bottom {
  border-bottom: 0 !important;
}

.no-border-left {
  border-left: 0 !important;
}

.no-border-right {
  border-right: 0 !important;
}

.no-spacing {
  padding-top: 0;
  padding-bottom: 0;
  margin-top: 0;
  margin-bottom: 0;
}

/** Basic Grid **/
.row {
  *zoom: 1;
}
.row:before, .row:after {
  content: " ";
  display: table;
}
.row:after {
  clear: both;
}
@media (min-width: 768px) {
  .row {
    margin-right: -15px;
    margin-left: -15px;
  }
  .row .col-1-2 {
    width: 50%;
  }
  .row .col-1-3 {
    width: 33.33333%;
  }
  .row .col-1-4 {
    width: 25%;
  }
  .row .col-1-5 {
    width: 20%;
  }
  .row .col-1-6 {
    width: 16.66667%;
  }
  .row .col-1-7 {
    width: 14.28571%;
  }
  .row .col-1-8 {
    width: 12.5%;
  }
  .row .col-2-3 {
    width: 66.66667%;
  }
  .row .col-2-4 {
    width: 50%;
  }
  .row .col-2-5 {
    width: 40%;
  }
  .row .col-2-6 {
    width: 33.33333%;
  }
  .row .col-2-7 {
    width: 28.57143%;
  }
  .row .col-2-8 {
    width: 25%;
  }
}
@media (min-width: 1230px) {
  .row {
    margin-right: 0;
    margin-left: 0;
  }
}
@media (min-width: 1300px) {
  .row {
    margin-right: -15px;
    margin-left: -15px;
  }
}
@media (min-width: 768px) {
  .row [class*='col-'] {
    float: left;
    padding: 0 15px;
  }
}

/*------------------------------------*\
    #Variables
\*------------------------------------*/
/*------------------------------------*\
    #Variables
    - Breakpoints
    - Pixel Values
    - Fonts
\*------------------------------------*/
/** Colors **/
/** Breakpoints **/
/** Pixel Values **/
/** Fonts **/
/*------------------------------------*\
    #Mixins
\*------------------------------------*/
/*------------------------------------*\
    #Mixins
    - Clearfix
    - Breakpoint
    - Overlay
    - Box Sizing
    - Text rendering
    - Create columns
    - Grid system
\*------------------------------------*/
/**
* @mixin clearfix
* Used to clear elements that are floated. Usually used within a container.
*
* @example
*   @include clearfix;
*/
/**
* @mixin breakpoint
* Used to define different styles per breakpoint.
*
* @param $minbp - the min-width for the breakpoint
* @param $maxbp (optional) - if you choose to do a range.
*
* @example
*   @include breakpoint(320px, $tablet-landscape) {
*       color: red;
*   }
*/
/**
* @mixin overlay
* Used to create an overlay.
*
* @example
*   @include overlay;
*/
/**
* @mixin boxSizing
* Used to add box sizing border-box to an element(s)
*
* @example
*   @include boxSizing;
*/
/**
* @mixin text-rendering
* Used to adjust the rendering of a font.
* Note: Not all browsers support this.
*
* @param $style - the type of rendering "smooth" makes type antialiased.
*
* @example
*   @include text-rendering("smooth");
*/
/**
* @mixin create-columns
* Can be used to create a column system.
*
* @param $state - the number to start your column system at, i.e 1
*
* @example
*   @include create-columns(1);
*/
/*
* @mixin grid
* Create a grid system.
*
* @param $cols - number of columns
* @param $gutter - px of margin between columns
* @param $children - class of children
* @example
*   @include grid($cols: 4, $gutter: 0, $children: ".related-content-item");
*/
/*
* @mixin horizontal-center
* Center element Horizontally
* @param $position- Element position type.  Defaults to relative;
* @example
*   @include horizontal-center();
*/
/*
* @mixin vertical-center
* Center element Vertically
* @param $position- Element position type.  Defaults to relative;
* @example
*   @include horizontal-center();
*/
/*
* @mixin box-middle
* Center element vertically and horizontally
* @example
*   @include horizontal-center();
*/
/*------------------------------------*\
    #Overrides
\*------------------------------------*/
.view1280 section header {
  width: auto;
  margin: 0;
}

.full-width #content header {
  height: auto;
}
.full-width #content a,
.full-width #content a:hover,
.full-width #content a:focus,
.full-width #content a:active,
.full-width #content a:visited {
  text-decoration: none;
}
.full-width .owl-dots .owl-dot span {
  background: #d1d5d9;
}
.full-width .owl-dots .owl-dot.active span {
  background: #539be2;
}

.no-objectfit .dronesInfoGraphic #wrapper .videoTrigger img {
  display: none;
}

.viewing-on-tablet.android-device #content .hLineHolder {
  bottom: 3px;
}
@media only screen and (min-device-width: 768px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 1) {
  .viewing-on-tablet.android-device #content .hLineHolder {
    bottom: 8px;
  }
}
.viewing-on-tablet .dronesInfoGraphic #wrapper {
  box-sizing: border-box;
  width: 100%;
  min-width: 982px;
}
.viewing-on-tablet #content.drones .sectionFadeMarker {
  opacity: 1;
}
.viewing-on-tablet #content.drones .flyOutNav {
  display: none;
}
.viewing-on-tablet #content.drones .introCard {
  padding-bottom: 300px;
  box-sizing: border-box;
}
.viewing-on-tablet #content.drones .introCard .globalSectionFadeOutMarker {
  bottom: 0;
}
.viewing-on-tablet #content.drones .growthOpportunites {
  opacity: 1;
}
.viewing-on-tablet #content.drones .growthOpportunites .globalSectionFadeInMarker {
  top: 0;
}
.viewing-on-tablet #content.drones .growthOpportunites .globalSectionFadeOutMarker {
  bottom: 0;
}
.viewing-on-tablet #content.drones .videoTrigger {
  opacity: 1;
}
.viewing-on-tablet #content.drones .videoTrigger .fadeOutMarkerVideoSceen {
  bottom: 0;
}
.viewing-on-tablet #content.drones .videoTrigger .fadeInMarkerVideoSceen {
  top: 0;
}
.viewing-on-tablet #content.drones .imgSquences .flipBookHolder {
  height: 101vh;
}
.viewing-on-tablet #content.drones .imgSquences .videoCopy {
  max-width: 750px;
}
.viewing-on-tablet #content.drones .card {
  min-height: 0;
  padding: 15% 0;
}
.viewing-on-tablet #content.drones .card.cardPinTrigger {
  padding: 0;
  margin: 0;
}
.viewing-on-tablet #content.drones .card.cardPinTrigger hr.cardPinFadeOutMarker {
  top: auto;
  bottom: 0%;
}
.viewing-on-tablet #content.drones .card.cardPinTrigger hr.cardPinFadeInMarker {
  top: 0%;
}
.viewing-on-tablet #content.drones .card.cardPinTrigger .keepScrollingFade {
  opacity: 1;
}
.viewing-on-tablet #content.drones .card.bg {
  background: radial-gradient(ellipse at top, #0d2456 0%, #16113a 50%);
}
.viewing-on-tablet #content.drones .card.takeaway .innerContent {
  padding-top: 180px;
}
.viewing-on-tablet #content.drones .card.takeaway .cardContent {
  min-height: 700px;
}
.viewing-on-tablet #content.drones .card.takeaway .droneImgSeq {
  top: -15px;
}
.viewing-on-tablet #content.drones .card .cardPin {
  padding: 5% 0;
  height: auto;
  min-height: 0;
  background-position: center top;
}
.viewing-on-tablet #content.drones .card .cardPin .missionCrossFade2,
.viewing-on-tablet #content.drones .card .cardPin .missionCrossFade1 {
  opacity: 1;
}
.viewing-on-tablet #content.drones .card .cardPin .missionCrossFade2 p,
.viewing-on-tablet #content.drones .card .cardPin .missionCrossFade1 p {
  opacity: 1;
}
.viewing-on-tablet #content.drones .card .cardContent {
  margin: 0;
  top: auto;
  -webkit-transform: perspective(1px) translateY(0);
          transform: perspective(1px) translateY(0);
}
.viewing-on-tablet #content.drones .card .cardContent .cardCopy {
  opacity: 1;
}
.viewing-on-tablet #content.drones .card .cardContent .innerContent.missionCrossFade1 {
  padding: 15% 0;
  position: relative;
  top: auto;
  -webkit-transform: perspective(1px) translateY(0);
          transform: perspective(1px) translateY(0);
}
.viewing-on-tablet #content.drones .card .cardContent .innerContent.missionCrossFade2 {
  position: relative;
  top: auto;
  -webkit-transform: perspective(1px) translateY(0);
          transform: perspective(1px) translateY(0);
  padding-bottom: 10%;
}
@media only screen and (min-device-width: 768px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 1) {
  .viewing-on-tablet #content.drones .card.takeaway hr.cardPinFadeInMarker {
    top: -60%;
  }
}
@media only screen and (min-device-width: 768px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 1) {
  .viewing-on-tablet #content.drones .card.takeaway hr.cardPinFadeInMarker {
    top: -10%;
  }
}
.viewing-on-tablet #content.drones .startSmall {
  min-height: 0;
  padding: 3% 0 15% 0;
}
.viewing-on-tablet #content.drones .startSmall .globalSectionFadeOutMarker {
  bottom: 0;
}
.viewing-on-tablet #content.drones .startSmall .globalSectionFadeInMarker {
  top: 0;
}
.viewing-on-tablet #content.drones .pieChartStartingSmall,
.viewing-on-tablet #content.drones .chartKey {
  opacity: 1;
}
.viewing-on-tablet #content.drones .smallContentHolder {
  padding: 0;
}
.viewing-on-tablet #content.drones .readyToGrow {
  opacity: 1;
  padding: 0;
}
.viewing-on-tablet #content.drones .readyToGrow .innerHolder {
  padding: 15% 30px;
}
.viewing-on-tablet #content.drones .readyToGrow .bottomValue {
  -webkit-tap-highlight-color: transparent;
}
.viewing-on-tablet #content.drones .readyToGrow .globalSectionFadeInMarker {
  top: 0%;
}
.viewing-on-tablet #content.drones .readyToGrow .globalSectionFadeOutMarker {
  bottom: 0;
}
.viewing-on-tablet #content.drones .readyToGrowContent {
  float: none;
  width: 100%;
}
.viewing-on-tablet #content.drones .readyToGrowContent h3 {
  text-align: center;
}
.viewing-on-tablet #content.drones .readyToGrowContent p {
  text-align: center;
}
.viewing-on-tablet #content.drones .readyToGrowContent p.sourceFootnote {
  padding-right: 0;
  position: absolute;
  bottom: 5%;
  width: 100%;
  margin: 0;
}
.viewing-on-tablet #content.drones .growChart {
  float: none;
  width: 100%;
  margin: 100px 0 0 0;
}
@media only screen and (min-device-width: 768px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 1) {
  .viewing-on-tablet #content.drones .readyToGrow .hiddenFlag {
    top: 30%;
  }
}
.viewing-on-tablet #content.drones .militaryDrones {
  min-height: 0;
}
.viewing-on-tablet #content.drones .militaryDrones .globalSectionFadeOutMarker {
  bottom: 0;
}
.viewing-on-tablet #content.drones .militaryDronesCopyLeft {
  opacity: 1;
  -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
          transform: translateY(0);
}
.viewing-on-tablet #content.drones .militaryDronesCompare {
  -webkit-transform: scale(1, 1) translate(0, 0);
      -ms-transform: scale(1, 1) translate(0, 0);
          transform: scale(1, 1) translate(0, 0);
  top: 180px;
}
.viewing-on-tablet #content.drones .droneScale {
  width: 95%;
  opacity: 1;
  text-align: center;
  display: block;
  margin: 0 auto;
}
.viewing-on-tablet #content.drones .compareTitleMDrones {
  opacity: 1;
  top: 115px;
  -webkit-transform: translateY(0) translateX(240px);
      -ms-transform: translateY(0) translateX(240px);
          transform: translateY(0) translateX(240px);
}
.viewing-on-tablet #content.drones .compareCopy {
  opacity: 1;
  -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
          transform: translateY(0);
}
.viewing-on-tablet #content.drones .compareWingSpan {
  width: 95%;
  border-right: 2px solid rgba(255, 255, 255, 0.5);
  border-left: 2px solid rgba(255, 255, 255, 0.5);
  -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
          transform: translateY(0);
}
.viewing-on-tablet #content.drones .compareWingSpan.bigSapn {
  opacity: 1;
}
.viewing-on-tablet #content.drones .compareWingSpan.littleSpan {
  max-width: 94px;
}
.viewing-on-tablet #content.drones .compareWingSpan hr {
  width: 100%;
  margin: 5px 0 0 0;
  float: left;
  top: auto;
  -webkit-transform: perspective(1px) translateY(0);
          transform: perspective(1px) translateY(0);
}
@media only screen and (min-device-width: 768px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 1) {
  .viewing-on-tablet #content.drones .compareCopy {
    margin-top: 0;
  }
  .viewing-on-tablet #content.drones .compareCopy .subCopy {
    top: -5px;
  }
}
@media only screen and (min-device-width: 768px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 1) {
  .viewing-on-tablet #content.drones .militaryDronesCompare {
    top: 240px;
  }
  .viewing-on-tablet #content.drones .militaryDronesCopyLeft {
    margin-top: 100px;
  }
  .viewing-on-tablet #content.drones .compareTitleMDrones {
    top: 168px;
  }
  .viewing-on-tablet #content.drones .compareWingSpan.bigSapn {
    margin-top: 15%;
  }
  .viewing-on-tablet #content.drones .compareCopy {
    margin-top: 100px;
  }
  .viewing-on-tablet #content.drones .militaryDronesCompare {
    height: 80%;
  }
}
.viewing-on-tablet #content.drones .map {
  opacity: 1;
  padding-bottom: 5%;
}
.viewing-on-tablet #content.drones .map .globalSectionFadeInMarker {
  top: 0;
}
.viewing-on-tablet #content.drones .map .globalSectionFadeOutMarker {
  bottom: 0;
}
.viewing-on-tablet #content.drones .worldMapHolder {
  position: relative;
  -webkit-transform: perspective(1px);
          transform: perspective(1px);
}
.viewing-on-tablet #content.drones .worldMapHolder .sourceFootnote {
  text-align: center;
  margin-top: 50px;
}
@media only screen and (min-device-width: 768px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 1) {
  .viewing-on-tablet #content.drones .map {
    padding-bottom: 20%;
  }
  .viewing-on-tablet #content.drones .map .worldTotal {
    bottom: -100px;
  }
  .viewing-on-tablet #content.drones .map .sourceFootnote {
    position: absolute;
    bottom: -135px;
    width: 100%;
  }
  .viewing-on-tablet #content.drones .map .mapLegend {
    top: -280px;
  }
  .viewing-on-tablet #content.drones .map .mapLeftContent {
    float: none;
    width: 100%;
  }
  .viewing-on-tablet #content.drones .map .mapLeftContent h4 {
    text-align: center;
  }
  .viewing-on-tablet #content.drones .map .mapLeftContent .chartDescription {
    text-align: center;
  }
  .viewing-on-tablet #content.drones .map .mapRightContent {
    float: none;
    margin: 5% auto 0 auto;
  }
  .viewing-on-tablet #content.drones .map .sourceFootnote {
    margin-top: 0px;
  }
  .viewing-on-tablet #content.drones .mapHolder {
    margin-top: 320px;
  }
  .viewing-on-tablet #content.drones .scrollingCopy {
    top: 10%;
  }
}
.viewing-on-tablet #content.drones .droneCity .globalSectionFadeOutMarker {
  bottom: 0;
}
.viewing-on-tablet #content.drones .sectionIndicators {
  opacity: 1;
  -webkit-transform: perspective(1px) translateY(0);
          transform: perspective(1px) translateY(0);
}
.viewing-on-tablet #content.drones .sectionIndicators h5 {
  opacity: 0.3;
}
.viewing-on-tablet #content.drones .droneCityInnerContentHolder {
  opacity: 1;
}
.viewing-on-tablet #content.drones .droneIconHolder {
  top: 60%;
}
.viewing-on-tablet #content.drones .cityContentLeftHolder {
  opacity: 0;
  -webkit-transform: perspective(1px) translateY(0);
          transform: perspective(1px) translateY(0);
}
.viewing-on-tablet #content.drones .cityLayer {
  -webkit-transform: perspective(1px) translateY(0);
          transform: perspective(1px) translateY(0);
}
.viewing-on-tablet #content.drones .cityLayer .maxHeightMarker {
  opacity: 0;
}
.viewing-on-tablet #content.drones .droneIconHolder {
  opacity: 0;
}
.viewing-on-tablet #content.drones .peopleMarker {
  opacity: 0;
}
.viewing-on-tablet #content.drones .heightIndacator {
  height: 105px;
  -webkit-transform: scale(1, 1);
      -ms-transform: scale(1, 1);
          transform: scale(1, 1);
}
.viewing-on-tablet #content.drones .heightIndacator hr {
  height: 50px;
}
@media only screen and (min-device-width: 768px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 1) {
  .viewing-on-tablet #content.drones .cityContentLeftHolder {
    bottom: 40px;
  }
}
.viewing-on-tablet #content.drones .growingCapability .globalSectionFadeInMarker {
  top: 0;
}
.viewing-on-tablet #content.drones .growingCapability .globalSectionFadeOutMarker {
  bottom: 0;
}
.viewing-on-tablet #content.drones .growingCapabilityContent {
  margin-bottom: 100px;
}
.viewing-on-tablet #content.drones .growingCapabilityContent .sourceFootnote {
  position: absolute;
  bottom: 5%;
  width: 100%;
  margin: 0;
}
.viewing-on-tablet #content.drones .growingCapabilityContent,
.viewing-on-tablet #content.drones .bigPicture {
  float: none;
  width: 100%;
  text-align: center;
}
.viewing-on-tablet #content.drones .growingCapabilityPin {
  min-height: 0;
}
.viewing-on-tablet #content.drones .growingCapabilityPin > .innerHolder {
  top: auto;
  -webkit-transform: perspective(1px);
          transform: perspective(1px);
}
.viewing-on-tablet #content.drones .growingCapabilityPin > .innerHolder {
  padding: 15% 30px;
}

/*------------------------------------*\
    #Typography
    All typography related styles go in this file: headings, paragraphy copy etc...
\*------------------------------------*/
/*------------------------------------*\
    #Mixins
\*------------------------------------*/
/*------------------------------------*\
    #Mixins
    - Clearfix
    - Breakpoint
    - Overlay
    - Box Sizing
    - Text rendering
    - Create columns
    - Grid system
\*------------------------------------*/
/**
* @mixin clearfix
* Used to clear elements that are floated. Usually used within a container.
*
* @example
*   @include clearfix;
*/
/**
* @mixin breakpoint
* Used to define different styles per breakpoint.
*
* @param $minbp - the min-width for the breakpoint
* @param $maxbp (optional) - if you choose to do a range.
*
* @example
*   @include breakpoint(320px, $tablet-landscape) {
*       color: red;
*   }
*/
/**
* @mixin overlay
* Used to create an overlay.
*
* @example
*   @include overlay;
*/
/**
* @mixin boxSizing
* Used to add box sizing border-box to an element(s)
*
* @example
*   @include boxSizing;
*/
/**
* @mixin text-rendering
* Used to adjust the rendering of a font.
* Note: Not all browsers support this.
*
* @param $style - the type of rendering "smooth" makes type antialiased.
*
* @example
*   @include text-rendering("smooth");
*/
/**
* @mixin create-columns
* Can be used to create a column system.
*
* @param $state - the number to start your column system at, i.e 1
*
* @example
*   @include create-columns(1);
*/
/*
* @mixin grid
* Create a grid system.
*
* @param $cols - number of columns
* @param $gutter - px of margin between columns
* @param $children - class of children
* @example
*   @include grid($cols: 4, $gutter: 0, $children: ".related-content-item");
*/
/*
* @mixin horizontal-center
* Center element Horizontally
* @param $position- Element position type.  Defaults to relative;
* @example
*   @include horizontal-center();
*/
/*
* @mixin vertical-center
* Center element Vertically
* @param $position- Element position type.  Defaults to relative;
* @example
*   @include horizontal-center();
*/
/*
* @mixin box-middle
* Center element vertically and horizontally
* @example
*   @include horizontal-center();
*/
/**
* Icons
* Set of clases generated from Icomoon.
* Please use the JSON file located in ../fonts
*/
.drones p {
  font-family: "UniversLTStdLight";
  font-size: 14px;
  line-height: 18px;
}
@media (min-width: 768px) {
  .drones p {
    font-size: 21px;
    line-height: 32px;
  }
}
.drones h1,
.drones h2,
.drones h3,
.drones h4,
.drones h5,
.drones h6 {
  font-weight: normal;
  margin: 0;
  padding: 0;
}

#content .infographicTitle {
  font-family: "UniversLTW01-49LightUlt";
  font-size: 110px;
  line-height: 1;
  text-transform: uppercase;
}
@media (min-width: 768px) {
  #content .infographicTitle {
    font-size: 242px;
  }
}
#content .industryTitle {
  font-family: "UniversLTW01-59UltraCn";
  font-size: 52px;
  line-height: 50px;
  text-transform: uppercase;
}
@media (min-width: 768px) {
  #content .industryTitle {
    font-size: 85px;
    line-height: 76px;
  }
}
#content .moduleTitle {
  font-family: "UniversLTW01-59UltraCn";
  font-size: 30px;
  line-height: 32px;
  font-weight: normal;
  text-transform: uppercase;
}
@media (min-width: 768px) {
  #content .moduleTitle {
    font-size: 46px;
    line-height: 46px;
  }
}
#content .chartTitle {
  font-family: "UniversLTW01-67BoldCn";
  font-size: 16px;
  line-height: 15px;
  text-transform: uppercase;
}
@media (min-width: 768px) {
  #content .chartTitle {
    font-size: 21px;
    line-height: 20px;
  }
}
#content .sectionTitle {
  font-family: "UniversLTW01-67BoldCn";
  font-size: 15px;
  line-height: 1;
  text-transform: uppercase;
}
#content .chartLabel1 {
  font-family: "UniversLTW01-67BoldCn";
  font-size: 13px;
  line-height: 1;
}
@media (min-width: 768px) {
  #content .chartLabel1 {
    font-size: 21px;
  }
}
#content .chartLabel2 {
  font-family: "UniversLTW01-57Condense 723821";
  font-size: 14px;
  line-height: 1;
}
@media (min-width: 768px) {
  #content .chartLabel2 {
    font-size: 21px;
    line-height: 1.4;
  }
}
#content .chartDescription {
  font-family: "UniversLTW01-55Oblique";
  font-size: 12px;
  line-height: 16px;
}
@media (min-width: 768px) {
  #content .chartDescription {
    font-size: 21px;
    line-height: 29px;
  }
}
#content .sourceFootnote {
  font-family: "UniversLTStdLight";
  font-size: 10px;
  line-height: 18px;
}
@media (min-width: 768px) {
  #content .sourceFootnote {
    font-size: 15px;
    margin-top: 40px;
  }
}
#content .footNote {
  font-family: "UniversLTStdLight";
  font-size: 12px;
  line-height: 18px;
}
#content .values {
  font-family: "Univers LT W01 65 Bold";
  font-size: 16px;
  line-height: 1;
}
@media (min-width: 768px) {
  #content .values {
    font-size: 36px;
    line-height: 1;
  }
}
#content .xAxisValues {
  font-family: "UniversLTW01-67BoldCn";
  font-size: 18px;
  line-height: 1;
}
#content .yAxisValues {
  font-family: "UniversLTW01-57Condense 723821";
  font-size: 18px;
  line-height: 1;
}

#content {
  position: relative;
}
#content.drones div {
  line-height: 0;
}
#content .innerHolder {
  max-width: 1200px;
  width: 100%;
  margin: 0 auto;
  position: relative;
  overflow: hidden;
  padding: 0;
  box-sizing: border-box;
}
@media (min-width: 768px) {
  #content .innerHolder {
    padding: 0 30px;
  }
}
@media (min-width: 1230px) {
  #content .innerHolder {
    padding: 0;
  }
}
#content .flyOutNav {
  position: fixed;
  bottom: 30px;
  right: 30px;
  background: #fff;
  z-index: 999;
  width: 52px;
  height: 52px;
  overflow: hidden;
  cursor: pointer;
  opacity: 0;
}
#content .flyOutNav > span {
  background: #799bc4;
  display: block;
  position: absolute;
  z-index: 99;
  text-align: center;
  width: 52px;
  height: 52px;
  top: 0;
  right: 0;
}
#content .flyOutNav > span:after {
  content: "\21";
  font-family: 'gs-share';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  color: #fff;
  font-size: 25px;
  line-height: 52px;
}
#content .flyOutNav > span img {
  display: inline-block;
  position: relative;
  top: 50%;
  text-align: center;
  -webkit-transform: perspective(1px) translateY(-50%);
          transform: perspective(1px) translateY(-50%);
}
#content .flyOutNav .expaneHolder {
  padding: 0;
  position: absolute;
  top: 0;
  left: 0;
  width: 0;
  overflow: hidden;
  z-index: 2;
}
#content .flyOutNav .expaneHolder:after {
  content: "";
  position: absolute;
  width: 100%;
  height: 50px;
  border-top: 1px solid #e9e9e9;
  border-bottom: 1px solid #e9e9e9;
  border-left: 1px solid #e9e9e9;
  left: 53px;
  right: 52px;
  z-index: -1;
}
#content .flyOutNav .expaneHolder .gs-share {
  margin: 0;
}
#content .flyOutNav .expaneHolder .flyOutLogo {
  display: block;
  float: left;
  margin: 0 55px 0 0;
}
#content .flyOutNav .expaneHolder .flyOutTitle {
  float: left;
  font-size: 21px;
  line-height: 52px;
  font-family: "UniversLTW01-59UltraCn";
  padding-right: 55px;
  border-right: 1px solid #e5e5e5;
  padding-left: 2%;
  background-color: #fff;
}
#content .flyOutNav .expaneHolder .gs-share {
  margin: 17px 0 0 40px;
  float: left;
}
#content .flyOutNav .expaneHolder .gs-share .email i {
  color: #2F6EB6;
}
#content .flyOutNav .expaneHolder .gs-share .facebook i {
  color: #405f9e;
}
#content .flyOutNav .expaneHolder .gs-share .twitter i {
  color: #09abf1;
}
#content .flyOutNav .expaneHolder .gs-share .linkedin i {
  color: #0079b9;
}
#content .flyOutNav .expaneHolder .gs-share .google-plus i {
  color: #d9451e;
}
#content .globalSectionFadeInMarker {
  visibility: hidden;
  position: absolute;
  height: 1px;
  width: 1px;
}
#content .globalSectionFadeOutMarker {
  visibility: hidden;
  position: absolute;
  height: 1px;
  width: 1px;
}
#content .sectionWrapper {
  background: #16113a;
}
#content .sectionFadeMarker {
  opacity: 0;
}
#content .introCard {
  background: url("/a/pgs/images/drones/intor-bg.jpg");
  background-position: top center;
  background-repeat: no-repeat;
  background-color: #fff;
  color: #fff;
  padding: 60px 0 780px 0;
  position: relative;
  min-height: 3600px;
  box-sizing: border-box;
}
#content .introCard .globalSectionFadeOutMarker {
  bottom: 30%;
}
#content .introCard .droneAnimationMarker {
  position: absolute;
  margin: 0;
  height: 0px;
  visibility: hidden;
  z-index: -1;
  width: 1%;
  top: 300px;
}
#content .introCard .innerContent {
  box-sizing: border-box;
  padding: 0;
  width: 100%;
  position: absolute;
  top: 50%;
  -webkit-transform: perspective(1px) translateY(-50%);
          transform: perspective(1px) translateY(-50%);
}
#content .introCard .border-lines {
  position: absolute;
  border: 0;
  border-top: 2px solid rgba(0, 0, 0, 0.5);
  width: 20px;
  height: 10px;
  display: block;
  margin: 0;
  visibility: visible;
}
@media (min-width: 768px) {
  #content .introCard .border-lines {
    width: 30px;
    height: 15px;
  }
}
#content .introCard .border-lines.top-left {
  top: 0;
  left: 0;
  border-left: 2px solid rgba(0, 0, 0, 0.5);
}
#content .introCard .border-lines.bottom-left {
  top: auto;
  bottom: 0;
  left: 0;
  -webkit-transform: rotateX(-180deg);
          transform: rotateX(-180deg);
  border-left: 2px solid rgba(0, 0, 0, 0.5);
}
#content .introCard .border-lines.top-right {
  top: 0;
  right: 0;
  -webkit-transform: rotateY(-180deg);
          transform: rotateY(-180deg);
  border-left: 2px solid rgba(0, 0, 0, 0.5);
}
#content .introCard .border-lines.bottom-right {
  top: auto;
  bottom: 0;
  right: 0;
  border-right: 2px solid rgba(0, 0, 0, 0.5);
  -webkit-transform: rotateX(-180deg);
          transform: rotateX(-180deg);
}
#content .introCard .border-lines {
  border-color: rgba(255, 255, 255, 0.25);
}
#content .introCard .border-lines.top-left, #content .introCard .border-lines.bottom-left, #content .introCard .border-lines.top-right, #content .introCard .border-lines.bottom-right {
  border-color: rgba(255, 255, 255, 0.25);
}
#content .introCard > .innerHolder {
  position: relative;
  margin: 100px auto 200px auto;
  padding: 0 30px;
  opacity: 0;
}
#content .introCard > .innerHolder .cardContent {
  position: relative;
  min-height: 600px;
  background: url("/a/pgs/images/drones/scroll-icon-white.png") no-repeat bottom center;
}
#content .introCard > .innerHolder h1 {
  text-align: center;
  margin-bottom: 20px;
  width: 100%;
  line-height: 170px;
}
#content .introCard > .innerHolder h2 {
  text-align: center;
  margin-bottom: 65px;
  color: #ff335a;
}
#content .introCard > .innerHolder p {
  text-align: center;
  max-width: 845px;
  width: 100%;
  margin: 0 auto;
}
#content .introDroneSequences {
  text-align: center;
  margin: 0 auto;
  display: block;
  position: absolute;
  top: 50px;
  left: 50%;
  -webkit-transform: perspective(1px) translateX(-50%);
          transform: perspective(1px) translateX(-50%);
  opacity: 0;
}
#content .introChartHolder {
  position: relative;
}
#content .introRight {
  width: 50%;
  position: absolute;
  right: 0;
  padding: 0 0 0 0;
  box-sizing: border-box;
}
#content .chartOneTrigger {
  height: 1px;
  width: 100%;
  background: #fff;
}
#content .chartTrigger {
  margin: 0 0 250px 0;
  visibility: hidden;
}
#content .introPieHolder {
  width: 100%;
  position: relative;
  float: right;
  padding: 0 0 0 0;
}
#content .introPieHolder img {
  width: 100%;
  text-align: center;
}
#content .introPieHolder img.pieImg {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  opacity: 0;
}
#content .inforBucket {
  padding: 0 4% 0 1%;
  opacity: 0.3;
  box-sizing: border-box;
}
#content .inforBucket.first {
  opacity: 1;
}
#content .inforBucket h2 {
  margin: 0 0 35px 0;
}
#content .rightSideCirle {
  max-width: 480px;
  width: 98%;
  float: left;
  position: relative;
  box-sizing: border-box;
}
#content .pieChartIntroValue {
  font-size: 63px;
  line-height: 1;
  font-family: "Univers LT W01 65 Bold";
  position: absolute;
  opacity: 0;
  z-index: 10;
  top: 50%;
  left: 50%;
  -webkit-transform: perspective(1px) translateY(-50%) translateX(-50%) scale(0.7, 0.7);
          transform: perspective(1px) translateY(-50%) translateX(-50%) scale(0.7, 0.7);
}
#content .pieChartIntroValue sup {
  font-size: 35px;
}
#content .pieChartIntroValue:after {
  content: "BN";
  font-size: 30px;
  margin-left: 1%;
}
#content .pieChartIntroValue:before {
  content: "e2016-2020";
  font-size: 18px;
  text-align: center;
  display: block;
  position: absolute;
  bottom: -25px;
  width: 100%;
}
#content .pieChartIntroValue.moneyFirst {
  opacity: 1;
  -webkit-transform: perspective(1px) translateY(-50%) translateX(-50%) scale(1);
          transform: perspective(1px) translateY(-50%) translateX(-50%) scale(1);
}
#content .introLeft {
  padding: 115px 0 50px 0;
  width: 50%;
  overflow: hidden;
  box-sizing: border-box;
}
#content .introLeft .outCirleMakert {
  width: 100%;
  position: relative;
  -webkit-transform: translateZ(0);
          transform: translateZ(0);
}
#content .videoTrigger {
  position: relative;
  opacity: 0;
  line-height: 0;
}
#content .videoTrigger img {
  -webkit-transform: perspective(1px);
          transform: perspective(1px);
  object-fit: cover;
  max-width: 100%;
  width: 100%;
  height: 100%;
  display: block;
}
#content .videoTrigger hr {
  position: absolute;
  margin: 0;
  border: 0;
  width: 100%;
  z-index: 10;
}
#content .videoTrigger .copyMarker {
  visibility: hidden;
}
#content .videoTrigger .progressBar {
  top: 0;
  background: #ffbc1c;
  height: 3px;
  width: 0;
}
#content .videoTrigger .fadeInMarkerVideoSceen,
#content .videoTrigger .fadeOutMarkerVideoSceen {
  visibility: hidden;
  height: 1px;
  width: 1px;
}
#content .videoTrigger .fadeOutMarkerVideoSceen {
  bottom: 70%;
}
#content .videoTrigger .fadeInMarkerVideoSceen {
  top: -5%;
}
#content .imgSquences {
  height: 100vh;
  position: relative;
}
#content .imgSquences .videoCopy {
  text-align: center;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: perspective(1px) translateY(-50%) translateX(-50%);
          transform: perspective(1px) translateY(-50%) translateX(-50%);
  z-index: 2;
  color: #fff;
  font-family: "UniversLTStdXBlack";
  font-size: 16px;
  text-transform: uppercase;
  letter-spacing: 3px;
  opacity: 0;
  width: 100%;
  max-width: 920px;
}
#content .imgSquences .flipBookHolder,
#content .imgSquences .flipBook {
  position: absolute;
  z-index: 1;
  width: 100%;
  height: 100vh;
  top: 0;
  left: 0;
  background-position: center center;
  background-size: cover;
  -webkit-transform: translateZ(0);
          transform: translateZ(0);
}
#content .map {
  max-width: 1200px;
  margin: 0 auto;
  position: relative;
  padding: 3% 0;
  opacity: 0;
}
#content .map .sourceFootnote {
  margin-top: 0;
}
#content .map .globalSectionFadeInMarker {
  top: -10%;
}
#content .map .globalSectionFadeOutMarker {
  bottom: 20%;
}
#content .map .scrollingCopy {
  position: absolute;
  top: 2%;
  left: 50%;
  z-index: 10;
  -webkit-transform: perspective(1px) translateY(-2%) translateX(-50%);
          transform: perspective(1px) translateY(-2%) translateX(-50%);
  width: 100%;
  text-align: center;
  min-height: 600px;
  background: url("/a/pgs/images/drones/scroll-icon.png") no-repeat bottom center;
}
#content .map .scrollingCopy .mapCardContent {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: perspective(1px) translateY(-50%) translateX(-50%);
          transform: perspective(1px) translateY(-50%) translateX(-50%);
}
#content .map .scrollingCopy p {
  max-width: 680px;
  width: 100%;
  margin: 0 auto;
}
#content .map .scrollingCopy h3 {
  margin: 0 0 40px 0;
}
#content .map .scrollingCopy .border-lines {
  position: absolute;
  border: 0;
  border-top: 2px solid rgba(0, 0, 0, 0.5);
  width: 20px;
  height: 10px;
  display: block;
  margin: 0;
  visibility: visible;
}
@media (min-width: 768px) {
  #content .map .scrollingCopy .border-lines {
    width: 30px;
    height: 15px;
  }
}
#content .map .scrollingCopy .border-lines.top-left {
  top: 0;
  left: 30px;
  border-left: 2px solid rgba(0, 0, 0, 0.5);
}
#content .map .scrollingCopy .border-lines.bottom-left {
  top: auto;
  bottom: 0;
  left: 30px;
  -webkit-transform: rotateX(-180deg);
          transform: rotateX(-180deg);
  border-left: 2px solid rgba(0, 0, 0, 0.5);
}
#content .map .scrollingCopy .border-lines.top-right {
  top: 0;
  right: 30px;
  -webkit-transform: rotateY(-180deg);
          transform: rotateY(-180deg);
  border-left: 2px solid rgba(0, 0, 0, 0.5);
}
#content .map .scrollingCopy .border-lines.bottom-right {
  top: auto;
  bottom: 0;
  right: 30px;
  border-right: 2px solid rgba(0, 0, 0, 0.5);
  -webkit-transform: rotateX(-180deg);
          transform: rotateX(-180deg);
}
#content .map .location {
  position: absolute;
  text-align: center;
}
#content .map .location.setSmall {
  -webkit-transform: scaleX(0.8) scaleY(0.8);
      -ms-transform: scaleX(0.8) scaleY(0.8);
          transform: scaleX(0.8) scaleY(0.8);
}
#content .map .location.setOne {
  opacity: 0;
}
#content .map .location.setTwo {
  opacity: 0;
}
#content .map .location.setThree {
  opacity: 0;
}
#content .map .location p:not(.noCapitalize) {
  font-family: "UniversLTW01-57Condense 723821";
  font-size: 16px;
  text-transform: capitalize;
}
#content .map .location p.noCapitalize {
  font-family: "UniversLTW01-57Condense 723821";
  font-size: 16px;
}
#content .map .location span {
  font-family: "Univers LT W01 65 Bold";
  color: #0070c0;
  margin: 0 0 0 0;
  display: block;
  font-size: 28px;
  line-height: 1;
}
#content .map .location span sup {
  font-size: 18px;
}
#content .map .location span:after {
  content: "bn";
  font-size: 15px;
  text-transform: uppercase;
  margin: 0 0 0 5px;
}
#content .map .location .innerCircle {
  border-radius: 50%;
  height: 10px;
  width: 10px;
  background: #0070c0;
  margin: 0 auto;
  position: relative;
}
#content .map .location .circleHolder {
  overflow: hidden;
}
#content .map .location .circleHolder hr {
  display: block;
  width: 1px;
  margin: 0;
  height: 24px;
  margin: 0 auto;
  border: 0;
  background: #000;
}
#content .map img {
  margin: 1.5% 0 0 0;
  width: 100%;
  height: auto;
}
#content .map .mapLeftContent {
  float: left;
  padding-left: 1%;
}
#content .map .mapLeftContent h4 {
  margin: 0 0 20px 0;
}
#content .map .mapRightContent {
  float: right;
  width: 440px;
  margin: 15px 0 0 0;
}
#content .map .mapLegend {
  position: absolute;
  width: 100%;
  opacity: 0;
  z-index: 1;
}
#content .map .mapMoneyMarkes {
  text-align: center;
  overflow: hidden;
  margin: 0 auto;
  width: 100%;
}
#content .map .mapMoneyMarkes p {
  font-family: "Univers LT W01 65 Bold";
  font-size: 19px;
  display: inline-block;
  margin: 0 0 5px 80px;
  opacity: 0.25;
}
#content .map .mapMoneyMarkes p:after {
  content: "BN";
  display: inline-block;
  font-size: 10px;
}
#content .map .mapMoneyMarkes p:first-child {
  margin: 0;
}
#content .map .mapSource {
  opacity: 0;
  padding-left: 1%;
}
#content .map .worldTotal {
  position: absolute;
  bottom: 25px;
  border: 2px solid #e5e5e5;
  max-width: 300px;
  width: 100%;
  text-align: center;
  padding: 20px 0;
  z-index: 30;
  left: 40%;
  -webkit-transform: perspective(1px) translateY(-50%);
          transform: perspective(1px) translateY(-50%);
  opacity: 0;
}
#content .map .worldTotal h5 {
  font-family: "UniversLTW01-57Condense 723821";
  font-size: 16px;
  margin-bottom: 10px;
}
#content .map .worldTotal p {
  color: #0070c0;
}
#content .map .worldTotal p sup {
  font-size: 18px;
}
#content .map .worldTotal p:after {
  content: "BN";
  display: inline-block;
  font-size: 15px;
  margin: 0 0 0 5px;
}
#content .map .legendTrack {
  margin: 0 auto;
  width: 83%;
  overflow: hidden;
  background: #c5c3ce;
}
#content .map .legendTrack hr {
  width: 33.3%;
  display: block;
  float: left;
  border: 0;
  height: 2px;
  margin: 0;
  opacity: 0;
  background: #0070c0;
}
#content .growthOpportunitesBg {
  padding: 20px 0 60px 0;
  background: url("/a/pgs/images/drones/drones-cloud_background.jpg") center 0 no-repeat #fff;
  position: relative;
}
#content .growthOpportunitesBg .globalSectionFadeInMarker {
  top: -15%;
}
#content .growthOpportunitesBg .globalSectionFadeOutMarker {
  bottom: 15%;
}
#content .growthOpportunites {
  overflow: hidden;
  opacity: 0;
  text-align: center;
}
#content .industryFunction {
  padding: 20px 0 0 0;
  box-sizing: border-box;
}
#content .industryFunction h3 {
  margin-bottom: 15px;
}
#content .industryFunction .barHolder {
  width: 75%;
  float: left;
  height: 100%;
}
#content .industryFunction .line {
  margin: 0 auto 0 auto;
  border: 0;
  border-top: 1px solid #bdbbcb;
  height: 1px;
  width: 100%;
  box-sizing: border-box;
  top: 50%;
  -webkit-transform: perspective(1px) translateY(-50%);
          transform: perspective(1px) translateY(-50%);
  position: absolute;
  left: 0;
}
#content .industryFunction .bar {
  left: 0;
  position: absolute;
  margin: 0;
  border: 0;
  height: 100%;
  width: 1px;
  background: #ff335a;
}
#content .industryFunction ul {
  box-sizing: border-box;
  overflow: hidden;
  width: 100%;
  max-width: 900px;
  margin: 50px auto 0 auto;
}
#content .industryFunction ul li {
  margin-bottom: 25px;
  width: 100%;
  overflow: hidden;
  height: 80px;
  position: relative;
  box-sizing: border-box;
  text-align: center;
}
#content .industryFunction ul li div {
  height: 100%;
  position: relative;
  width: 78%;
  overflow: hidden;
  float: left;
  top: 50%;
  -webkit-transform: perspective(1px) translateY(-50%);
          transform: perspective(1px) translateY(-50%);
  position: relative;
}
#content .industryFunction ul li p,
#content .industryFunction ul li h3 {
  box-sizing: border-box;
  margin: 0;
  float: left;
  padding: 0 1% 0 0;
  top: 50%;
  -webkit-transform: perspective(1px) translateY(-50%);
          transform: perspective(1px) translateY(-50%);
  position: relative;
}
#content .industryFunction ul li h3 {
  max-width: 165px;
  width: 40%;
  font-size: 20px;
  text-transform: none;
  text-align: left;
}
#content .industryFunction ul li p {
  line-height: 33px;
  float: right;
  padding: 0 2% 0 0;
  text-align: right;
}
#content .industryFunction ul li p:after {
  content: "MN";
  font-size: 15px;
  margin: 0 0 0 5px;
}
#content .growthContent {
  width: 100%;
  box-sizing: border-box;
  padding: 20px 0 80px 0;
}
#content .growthContent h2 {
  margin: 0 auto 35px auto;
}
#content .growthContent h2 span {
  display: block;
  margin-bottom: 15px;
  color: #ff335a;
}
#content .growthContent p {
  max-width: 745px;
  padding: 0;
  margin: 0 auto;
}
#content .growthContent .sourceFootnote {
  margin-top: 40px;
}
#content .readyToGrow {
  background: #fff;
  position: relative;
  z-index: 1;
  opacity: 0;
  padding: 7% 0;
  box-sizing: border-box;
}
#content .readyToGrow .globalSectionFadeOutMarker {
  bottom: 60%;
}
#content .readyToGrow .globalSectionFadeInMarker {
  top: -40%;
}
#content .readyToGrowContent {
  width: 40%;
  float: left;
  padding-right: 5%;
  box-sizing: border-box;
}
#content .readyToGrowContent h3 {
  margin-bottom: 40px;
}
#content .readyToGrowContent .sourceFootnote {
  padding-right: 20px;
}
#content .barMarkers {
  position: absolute;
  height: 442px;
  width: 90%;
  top: 110px;
}
#content .barMarkers hr {
  margin: 0;
  position: absolute;
  width: 100%;
  border: 0;
  height: 1px;
  background: #d2d2d2;
}
#content .barMarkers hr.bn35 {
  bottom: 100%;
}
#content .barMarkers hr.bn3 {
  bottom: 85.71429%;
}
#content .barMarkers hr.bn25 {
  bottom: 71.42857%;
}
#content .barMarkers hr.bn20 {
  bottom: 57.14286%;
}
#content .barMarkers hr.bn15 {
  bottom: 42.85714%;
}
#content .barMarkers hr.bn10 {
  bottom: 28.57143%;
}
#content .barMarkers hr.bn05 {
  bottom: 14.28571%;
}
#content .barMarkers hr.bn0 {
  bottom: 0%;
}
#content .growChart {
  width: 60%;
  float: left;
  position: relative;
  box-sizing: border-box;
  text-align: center;
}
#content .growChart h4 {
  margin-bottom: 10px;
}
#content .chartLines {
  float: left;
  width: 90%;
  position: relative;
  min-height: 490px;
  margin: 50px 0 0 0;
}
#content .bottomValue {
  position: relative;
  width: 11%;
  margin: 0 0.7%;
  float: left;
  padding: 442px 0 0 0;
  height: 442px;
  box-sizing: border-box;
  z-index: 10;
}
#content .bottomValue .valueMarker {
  position: absolute;
  width: 100%;
  opacity: 0;
  z-index: 10;
}
#content .bottomValue .valueMarker .values:after {
  display: inline;
  font-size: 12px;
  content: "BN";
}
#content .bottomValue .valueMarker .values.millions:after {
  content: "MN";
}
#content .bottomValue .valueMarker span {
  color: #09003d;
  display: block;
  width: 100%;
  font-size: 18px;
}
#content .bottomValue .valueMarker span sup {
  font-size: 12px;
}
#content .bottomValue .valueLine {
  border: 0;
  height: 40px;
  width: 1px;
  border: 0;
  margin: 0 auto;
  background: #c5c3ce;
  position: relative;
}
#content .bottomValue p {
  margin: 20px 0 0 0;
  text-align: center;
}
#content .hLineHolder {
  bottom: 1px;
  margin: 0;
  border: 0;
  width: 100%;
  position: absolute;
}
#content .hlines {
  margin: 0;
  border: 0;
  width: 100%;
  height: 0;
  background: #ff335a;
  position: absolute;
  bottom: 0;
}
#content .chartTotals {
  box-sizing: border-box;
  float: left;
  margin: 3px 0 0 0;
  padding-left: 2%;
  width: 10%;
}
#content .chartTotals p {
  margin: 23px 0 0 0;
  line-height: 35px;
  white-space: nowrap;
}
#content .chartTotals p sup {
  font-size: 12px;
  margin: 0 2px 0 0;
}
#content .startSmall {
  color: #fff;
  text-align: center;
  padding: 3% 0;
  position: relative;
  box-sizing: border-box;
  min-height: 100Vh;
}
#content .startSmall .globalSectionFadeOutMarker {
  bottom: 70%;
}
#content .startSmall .globalSectionFadeInMarker {
  top: -40%;
}
#content .startSmallLeadingCopy {
  margin: 20px auto 50px auto;
  overflow: hidden;
  width: 520px;
}
#content .smallContentHolder {
  position: relative;
  overflow: hidden;
  height: 100%;
  padding-bottom: 100px;
}
#content .chartKey {
  width: 50%;
  text-align: left;
  float: left;
  opacity: 0;
}
#content .chartKey h4 {
  margin: 0 0 20px 0;
}
#content .pieChartStartingSmall {
  right: 0;
  width: 50%;
  opacity: 0;
  position: absolute;
  top: 50%;
  -webkit-transform: perspective(1px) translateY(-50%);
          transform: perspective(1px) translateY(-50%);
}
#content .pieChartStartingSmall svg {
  float: right;
  position: relative;
  width: 80%;
  display: block;
  margin: 15% 0;
}
#content .pieChartStartingSmall svg .tabletsValue {
  fill: #e17000;
}
#content .pieChartStartingSmall svg .dronesValue {
  fill: #fd3c50;
}
#content .pieChartStartingSmall svg .videogameConsoles {
  fill: #f89f00;
}
#content .pieChartStartingSmall svg .wearables {
  fill: #ffce00;
}
#content .pieChartStartingSmall svg .actionCameras {
  fill: #ffdf5a;
}
#content .key {
  margin: 35px 0 0 0;
}
#content .key li {
  position: relative;
  margin-bottom: 50px;
  height: 33px;
}
#content .key li.dronesValue .keyTitle:before {
  background: #fd3c50;
}
#content .key li.actionCameras .keyTitle:before {
  background: #ffdf5a;
}
#content .key li.wearables .keyTitle:before {
  background: #ffce00;
}
#content .key li.videogameConsoles .keyTitle:before {
  background: #f89f00;
}
#content .key li.tabletsValue .keyTitle:before {
  background: #e17000;
}
#content .key .keyTitle {
  float: left;
  padding: 0 15px 0 0;
  position: relative;
  line-height: 30px;
  top: 50%;
  -webkit-transform: perspective(1px) translateY(-50%);
          transform: perspective(1px) translateY(-50%);
  z-index: 1;
}
#content .key .keyTitle:before {
  content: "";
  width: 15px;
  height: 15px;
  border-radius: 50%;
  position: relative;
  display: inline-block;
  margin-right: 10px;
}
#content .key hr {
  border: 0;
  height: 1px;
  margin: 0;
  width: 100%;
  position: absolute;
  top: 50%;
  -webkit-transform: perspective(1px) translateY(-50%);
          transform: perspective(1px) translateY(-50%);
  background: rgba(255, 255, 255, 0.4);
  z-index: 0;
}
#content .key p {
  background: #16113a;
}
#content .key .totalVal {
  position: absolute;
  right: 0;
  top: 0;
  padding: 0 0 0 15px;
  top: 50%;
  -webkit-transform: perspective(1px) translateY(-50%);
          transform: perspective(1px) translateY(-50%);
}
#content .key .totalVal sup {
  font-size: 18px;
  margin-right: 2px;
}
#content .key .totalVal:after {
  content: "MN";
  font-size: 14px;
  margin-left: 3px;
}
#content .militaryDrones {
  overflow: hidden;
  min-height: 100vh;
  position: relative;
}
#content .militaryDrones .sectionFadeMarker {
  opacity: 1;
}
#content .militaryDrones .globalSectionFadeOutMarker {
  bottom: 15%;
}
#content .militaryDronesContent {
  position: relative;
  min-height: 100%;
  color: #fff;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
}
#content .compareWingSpan {
  border-right: 1px solid rgba(255, 255, 255, 0.3);
  border-left: 1px solid rgba(255, 255, 255, 0.3);
  height: 12px;
  margin: 25px auto 0 auto;
  -webkit-transform: translateY(50px);
      -ms-transform: translateY(50px);
          transform: translateY(50px);
  opacity: 0;
  width: 98%;
}
#content .compareWingSpan.littleSpan {
  width: 110px;
  position: absolute;
  top: 125px;
  margin: 0;
  -webkit-transform: translateY(20px);
      -ms-transform: translateY(20px);
          transform: translateY(20px);
}
#content .compareWingSpan hr {
  position: relative;
  background: rgba(255, 255, 255, 0.5);
  height: 1px;
  margin: 0;
  border: 0;
  display: block;
  top: 50%;
  -webkit-transform: perspective(1px) translateY(-50%);
          transform: perspective(1px) translateY(-50%);
}
#content .compareCopy {
  text-align: center;
  z-index: 9;
  max-width: 1200;
  opacity: 0;
  -webkit-transform: translateY(20px) scale(0.5, 0.5);
      -ms-transform: translateY(20px) scale(0.5, 0.5);
          transform: translateY(20px) scale(0.5, 0.5);
  margin-top: 15px;
}
#content .compareCopy h4 {
  margin: 0;
  color: #0070c0;
  font-size: 84px;
  line-height: 1.2;
  font-family: "Univers LT W01 65 Bold";
  font-weight: normal;
}
#content .compareCopy h4:after {
  content: "FT";
  font-size: 24px;
}
#content .compareCopy .subCopy {
  display: block;
  color: #fff;
  position: relative;
}
#content .militaryDronesCompare {
  position: absolute;
  left: 0;
  top: 125px;
  width: 100%;
  -webkit-transform: scale(0.2, 0.2) translate(1700px, 500px);
      -ms-transform: scale(0.2, 0.2) translate(1700px, 500px);
          transform: scale(0.2, 0.2) translate(1700px, 500px);
}
#content .compareTitleMDrones {
  text-align: center;
  text-transform: uppercase;
  top: 50px;
  font-weight: normal;
  opacity: 0;
  -webkit-transform: translateY(50px);
      -ms-transform: translateY(50px);
          transform: translateY(50px);
  position: absolute;
  width: 100%;
  left: 0;
  right: 0;
}
#content .compareBird {
  position: absolute;
  width: 430px;
  left: 900px;
  top: 200px;
}
#content .compareBird h4 {
  font-size: 84px;
  font-family: "Univers LT W01 65 Bold";
  color: #0070c0;
}
#content .compareBird svg {
  max-width: 110px;
  height: 80px;
  float: left;
  margin: 30px 0 0 0;
  fill: #0070c0;
  opacity: 0;
  -webkit-transform: translateY(10px) scale(0.1, 0.1);
      -ms-transform: translateY(10px) scale(0.1, 0.1);
          transform: translateY(10px) scale(0.1, 0.1);
}
#content .compareBird .birdCopy {
  padding: 0 0 0 10%;
  width: 240px;
  float: left;
  opacity: 0;
}
#content .compareBird .birdCopy h4:after {
  content: "IN";
  font-size: 24px;
  margin-left: 5px;
}
#content .droneScale {
  width: 100%;
  opacity: 0;
  position: relative;
  z-index: 1;
}
#content .militaryDronesContentHolder {
  min-height: 100vh;
}
#content .militaryDronesCopyLeft {
  position: relative;
  -webkit-transform: translateY(300px);
      -ms-transform: translateY(300px);
          transform: translateY(300px);
  opacity: 0;
  z-index: 10;
  width: 400px;
  margin: 50px 0 0 0;
}
#content .militaryDronesCopyLeft h3 {
  margin: 20px 0;
  padding: 0 200px 0 0;
}
#content .growingCapability {
  color: #fff;
  position: relative;
}
#content .growingCapability .globalSectionFadeInMarker {
  top: -20%;
}
#content .growingCapability .globalSectionFadeOutMarker {
  bottom: 35%;
}
#content .growingCapabilityPin {
  min-height: 100vh;
}
#content .growingCapabilityPin > .innerHolder {
  top: 50%;
  -webkit-transform: perspective(1px) translateY(20%);
          transform: perspective(1px) translateY(20%);
}
#content .growingCapabilityContent {
  width: 40%;
  float: left;
  box-sizing: border-box;
  padding: 0 3% 0 0;
}
#content .growingCapabilityContent h3 {
  margin-bottom: 40px;
}
#content .bigPicture {
  float: right;
  width: 60%;
  text-align: center;
  box-sizing: border-box;
  padding: 0 5%;
  position: relative;
  z-index: 1;
}
#content .bigPicture .tripMarkers {
  max-width: 100%;
  width: 100%;
}
#content .bigPicture .planeFly {
  position: absolute;
  width: 105px;
  -webkit-transform: perspective(1px) rotate(-100deg) translateY(-100%);
          transform: perspective(1px) rotate(-100deg) translateY(-100%);
}
#content .bigPicture h4 {
  margin-bottom: 20px;
}
#content .bigPicture > p {
  max-width: 475px;
  margin: 0 auto 70px auto;
}
#content .trip {
  position: relative;
  opacity: 0;
  z-index: 1;
  max-width: 583px;
  margin: 0 auto;
}
#content .trip p {
  position: absolute;
  z-index: 10;
}
#content .trip .miles {
  top: 50%;
  left: 50%;
  -webkit-transform: perspective(1px) translateX(-50%) translateY(-65%);
          transform: perspective(1px) translateX(-50%) translateY(-65%);
  opacity: 0;
}
#content .trip .miles:after {
  content: "MN sq. miles";
  font-size: 21px;
}
#content .trip .values {
  font-size: 52px;
}
#content .droneCity {
  position: relative;
  min-height: 100vh;
}
#content .droneCity .globalSectionFadeOutMarker {
  bottom: 20%;
}
#content .droneCity .sectionFadeMarker {
  opacity: 1;
}
#content .droneCityPinSection {
  min-height: 100%;
  height: 100vh;
  position: relative;
}
#content .droneCityPinSection .innerHolder {
  min-height: 100vh;
}
#content .droneIconHolder {
  z-index: 1;
  width: 105px;
  position: absolute;
  top: 120%;
  left: 50%;
  -webkit-transform: perspective(1px) translateY(-50%) translateX(-50%);
          transform: perspective(1px) translateY(-50%) translateX(-50%);
  fill: #0070c0;
}
#content .droneCityCircle {
  opacity: 0;
  border-radius: 50%;
  width: 5px;
  height: 5px;
  border: 1px solid #fff;
  position: relative;
  left: 50%;
  -webkit-transform: perspective(1px) translateX(-50%);
          transform: perspective(1px) translateX(-50%);
}
#content .indicatorH {
  float: left;
  width: 145px;
  position: relative;
}
#content .indicatorH span {
  display: block;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 1px solid #fff;
  float: left;
}
#content .indicatorH hr {
  position: absolute;
  top: 50%;
  -webkit-transform: perspective(1px) translateY(-50%);
          transform: perspective(1px) translateY(-50%);
  display: block;
  width: 100px;
  height: 1px;
  border: 0;
  margin: 0;
  background: #fff;
  right: 0;
}
#content .droneCollisionContent {
  float: left;
  width: 350px;
  margin: 0 0 0 10px;
  color: #fff;
  position: relative;
}
#content .droneCollisionContent h5 {
  color: #ff335a;
  margin-bottom: 20px;
}
#content .droneIcon {
  z-index: 10;
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: perspective(1px) translateY(-50%) translateX(-50%);
          transform: perspective(1px) translateY(-50%) translateX(-50%);
}
#content .droneIndicatorContent {
  position: absolute;
  right: -600px;
  width: 600px;
  top: 50%;
  -webkit-transform: perspective(1px) translateY(-95%);
          transform: perspective(1px) translateY(-95%);
}
#content .droneIndicatorContent p {
  position: absolute;
  opacity: 0;
  left: 0;
  top: 20px;
}
#content .droneIndicatorContent p.rangeCopyFadeTwo {
  bottom: -15px;
}
#content .droneIndicatorContent p.rangeCopyFadeOne {
  opacity: 1;
  bottom: -75px;
}
#content .cityLayer {
  -webkit-transform: translateY(300px);
      -ms-transform: translateY(300px);
          transform: translateY(300px);
  background: url(/a/pgs/images/drones/city.png) left bottom no-repeat;
  height: 100%;
  width: 100%;
  position: absolute;
  z-index: 2;
}
#content .cityLayer .maxHeightMarker {
  left: 0;
  right: 0;
  position: absolute;
  top: 45%;
  -webkit-transform: perspective(1px) translateY(-50%);
          transform: perspective(1px) translateY(-50%);
}
#content .cityLayer .maxHeightMarker > div {
  max-width: 1200px;
  width: 100%;
  margin: 0 auto;
  text-align: right;
  color: #fff;
}
#content .cityLayer .maxHeightMarker > div p {
  padding: 0 1%;
  display: block;
  float: right;
  position: relative;
  z-index: 9;
  background: #16113a;
}
#content .cityLayer hr {
  border: 0;
  border-top: 1px dashed rgba(225, 225, 225, 0.4);
  margin: 0;
  position: absolute;
  top: 52%;
  width: 100%;
  -webkit-transform: perspective(1px) translateY(-50%);
          transform: perspective(1px) translateY(-50%);
  z-index: 0;
}
#content .peopleMarker {
  position: absolute;
  bottom: 0;
  overflow: hidden;
  opacity: 0;
  width: 100%;
}
#content .maxHeightMarker {
  opacity: 0;
}
#content .heightIndacator {
  float: left;
  height: 15px;
  -webkit-transform: scale(0.3, 0.3);
      -ms-transform: scale(0.3, 0.3);
          transform: scale(0.3, 0.3);
}
#content .heightIndacator hr {
  width: 1px;
  height: 50px;
  border: 0;
  margin: 0;
  background: #fff;
  display: block;
  float: left;
  position: relative;
  left: 50%;
  -webkit-transform: perspective(1px) translateX(-50%);
          transform: perspective(1px) translateX(-50%);
}
#content .heightIndacator span {
  width: 50px;
  height: 50px;
  border: 1px solid #fff;
  border-radius: 50%;
  display: block;
  float: left;
  clear: both;
}
#content .sectionIndicators {
  width: 100%;
  overflow: hidden;
  text-align: center;
  padding-top: 3%;
  font-size: 0;
  -webkit-transform: translateY(150px);
      -ms-transform: translateY(150px);
          transform: translateY(150px);
  opacity: 0;
}
#content .sectionIndicators h5 {
  display: inline-block;
  text-align: center;
  text-transform: uppercase;
}
#content .sectionIndicators h5 + h5 {
  margin-left: 10%;
  opacity: 0.3;
}
#content .droneCityPin {
  color: #fff;
  position: relative;
  height: 100%;
  min-height: 100vh;
}
#content .droneCityInnerContentHolder {
  position: relative;
  min-height: 100vh;
}
#content .crossFadeCopy {
  position: relative;
  width: 100%;
}
#content .crossFadeCopy.operations {
  height: 55px;
}
#content .crossFadeCopy p {
  position: absolute;
  opacity: 0;
  white-space: nowrap;
}
#content .crossFadeCopy p:first-child {
  opacity: 1;
}
#content .cityContentLeftHolder {
  z-index: 10;
  position: absolute;
  bottom: 70px;
  left: 5px;
  opacity: 0;
  -webkit-transform: translateY(200px);
      -ms-transform: translateY(200px);
          transform: translateY(200px);
  width: 520px;
}
#content .cityContentLeftHolder h6 {
  text-transform: uppercase;
}
#content .cityContentLeft {
  height: 330px;
  position: relative;
}
#content .cityContentLeft h6 {
  margin-bottom: 15px;
  color: #ff335a;
}
#content .forest {
  width: 100%;
  position: absolute;
  bottom: 0;
  left: 0;
}
#content .card {
  text-align: center;
  position: relative;
  min-height: 100vh;
  padding: 0;
}
#content .card.bg, #content .card.bg-alt {
  color: #fff;
  background: none;
}
#content .card.bg .cardContent .border-lines, #content .card.bg-alt .cardContent .border-lines {
  z-index: 2;
  border-color: rgba(255, 255, 255, 0.25);
}
#content .card.bg .cardContent .border-lines.top-left, #content .card.bg .cardContent .border-lines.bottom-left, #content .card.bg .cardContent .border-lines.top-right, #content .card.bg .cardContent .border-lines.bottom-right, #content .card.bg-alt .cardContent .border-lines.top-left, #content .card.bg-alt .cardContent .border-lines.bottom-left, #content .card.bg-alt .cardContent .border-lines.top-right, #content .card.bg-alt .cardContent .border-lines.bottom-right {
  border-color: rgba(255, 255, 255, 0.25);
}
#content .card.bg .cardContent.keepScrolling, #content .card.bg-alt .cardContent.keepScrolling {
  background: url("/a/pgs/images/drones/scroll-icon-white.png") no-repeat bottom center;
}
#content .card.bg .cardPin {
  background: radial-gradient(ellipse at top, #0d2456 0%, #16113a 70%);
}
#content .card.bg-alt {
  background: none;
}
#content .card.bg-alt .cardPin {
  background: #16113a;
}
#content .card.cardPinTrigger hr {
  position: absolute;
  visibility: hidden;
  width: 1px;
  margin: 0;
  height: 1px;
}
#content .card.cardPinTrigger hr.cardPinFadeOutMarker {
  top: auto;
  bottom: 55%;
}
#content .card.cardPinTrigger hr.cardPinFadeInMarker {
  top: -10%;
}
#content .card.cardPinTrigger hr.missionPinBgMarker {
  top: 0;
}
#content .card.takeaway .droneImgSeq {
  position: absolute;
  left: 50%;
  top: 20px;
  top: 20px;
  width: 100%;
  max-width: 350px;
  -webkit-transform: perspective(1px) translateX(-50%);
          transform: perspective(1px) translateX(-50%);
}
#content .card.takeaway .cardContent {
  padding: 0;
  min-height: 630px;
}
#content .card.takeaway .innerContent {
  padding: 100px 0 0px 0;
}
#content .card.takeaway button {
  max-width: 200px;
  width: 100%;
  border: 0;
  border-radius: 0;
  background: #0070c0;
  color: #fff;
  text-transform: uppercase;
  line-height: 50px;
  transition: background 1s;
  cursor: pointer;
  font-size: 15px;
  font-family: "UniversLTW01-67BoldCn";
  outline: none;
}
#content .card.takeaway button:hover {
  background: rgba(0, 112, 192, 0.7);
}
#content .card.takeaway .gs-share {
  margin: 75px 0 40px 0;
}
#content .card.takeaway .gs-share li a {
  color: rgba(255, 255, 255, 0.75);
  transition: color 1s;
}
#content .card.takeaway .gs-share li a i {
  color: rgba(255, 255, 255, 0.75);
}
#content .card.takeaway .gs-share li a:hover {
  color: white;
}
#content .card.takeaway .gs-share li a:hover i {
  color: white;
}
#content .card.takeaway .gs-share li.share-item-more a {
  line-height: 14px;
}
#content .card.takeaway .gs-share li.share-item-more a {
  bottom: -5px;
  position: relative;
}
#content .gs-share.social-share-bar.gs-social-share-bar.light {
    border-top: 0px;
    border-bottom: 0px;
}
#content .card.takeaway .gs-share.gs-social-share-bar .share-item-more {
  height: 18px;
}
#content .card .cardPin {
  height: 100vh;
}
#content .card .cardPin > .innerHolder {
  padding: 0 30px;
  min-height: 100%;
  box-sizing: border-box;
}
#content .card .cardPin .missionCrossFade2 {
  opacity: 0;
}
#content .card .cardPin .missionCrossFade2 p {
  opacity: 0;
}
#content .card .cloudsBg {
  background-image: url("/a/pgs/images/drones/mission-cloud.jpg");
  background-position: center 100px;
  background-repeat: no-repeat;
  background-color: #fff;
}
#content .card .cardContent {
  position: relative;
  margin: 0;
  z-index: 1;
  min-height: 600px;
  top: 15%;
  -webkit-transform: perspective(1px) translateY(15%);
          transform: perspective(1px) translateY(15%);
  padding: 0;
}
#content .card .cardContent.keepScrolling {
  background: url("/a/pgs/images/drones/scroll-icon.png") no-repeat bottom center;
}
#content .card .cardContent h2 {
  margin: 0 0 35px 0;
}
#content .card .cardContent h2 span {
  margin: 0 0 15px 0;
  display: block;
  color: #ff335a;
}
#content .card .cardContent .cardCopy {
  opacity: 0;
}
#content .card .cardContent p {
  margin: 0 auto;
  width: 100%;
  max-width: 550px;
}
@media (min-width: 768px) {
  #content .card .cardContent p {
    max-width: 650px;
  }
}
#content .card .cardContent p.takeaway-mobile {
  margin: 0 0 25px 0;
}
#content .card .cardContent p.wideCopyBlock {
  max-width: 800px;
}
#content .card .cardContent .innerContent {
  width: 100%;
  box-sizing: border-box;
  top: 50%;
  position: absolute;
  -webkit-transform: perspective(1px) translateY(-50%);
          transform: perspective(1px) translateY(-50%);
}
#content .card .cardContent .border-lines {
  position: absolute;
  border: 0;
  border-top: 2px solid rgba(0, 0, 0, 0.5);
  width: 20px;
  height: 10px;
  display: block;
  margin: 0;
  visibility: visible;
}
@media (min-width: 768px) {
  #content .card .cardContent .border-lines {
    width: 30px;
    height: 15px;
  }
}
#content .card .cardContent .border-lines.top-left {
  top: 0;
  left: 0;
  border-left: 2px solid rgba(0, 0, 0, 0.5);
}
#content .card .cardContent .border-lines.bottom-left {
  top: auto;
  bottom: 0;
  left: 0;
  -webkit-transform: rotateX(-180deg);
          transform: rotateX(-180deg);
  border-left: 2px solid rgba(0, 0, 0, 0.5);
}
#content .card .cardContent .border-lines.top-right {
  top: 0;
  right: 0;
  -webkit-transform: rotateY(-180deg);
          transform: rotateY(-180deg);
  border-left: 2px solid rgba(0, 0, 0, 0.5);
}
#content .card .cardContent .border-lines.bottom-right {
  top: auto;
  bottom: 0;
  right: 0;
  border-right: 2px solid rgba(0, 0, 0, 0.5);
  -webkit-transform: rotateX(-180deg);
          transform: rotateX(-180deg);
}