.squat-hero>div {
     display: -webkit-box;
     display: -moz-box;
     display: -ms-flexbox;
     display: -webkit-flex;
     display: flex;
     -webkit-flex-flow: column nowrap;
     flex-direction: column;
     position: relative;
     width: 100%;
 }

 .squat-hero .video-component.pull-right {
     padding-left: 20px;
 }
.squat-hero img {
    max-width: 100%;
}
 .squat-hero .video__trigger>img {
     position: relative;
     top: auto;
 }

 .squat-hero .video__trigger {
     padding-top: 0;
 }

 .squat-hero .pull-left {
     order: 1;
 }

 .squat-hero .pull-right {
     order: 2;
 }

 .squat-hero .pull-left,
 .squat-hero .pull-right {
     clear: both;
     float: none !important;
 }

 .squat-hero h2,.squat-hero h1 {
     margin-top: 0;
     margin-bottom: 1rem;
     font-size: 2.4rem;
     line-height: 2.28rem;
 }

 .squat-hero .content.left {
     order: 1;
 }

 .squat-hero .content.right {
     order: 2;
 }

.squat-hero .content {
    padding: 12vw 8vw 9vw;
}
.squat-hero .hero__frame .content {
    padding: 12vw 10vw 9vw;
}
.squat-hero .content.right {
    padding-top: 8vw;
}
.squat-hero .hero__frame .content.right {
    padding-top: 5vw;
}
.squat-hero {
     position: relative;
 }

 .squat-hero .video__trigger {
     margin-bottom: 0;
 }

 .squat-hero .video-component__main {
     padding-bottom: 0;
 }
 .squat-hero .content div{
     margin-top:.7rem;
     margin-bottom:0
  }
.squat-hero .content .btn{
    margin-top: 1.5rem;
    margin-bottom:0
}
 .squat-hero a.text{
     margin-top:1rem;
     margin-bottom: 0;
 }
 .squat-hero.bg-navy-blue .content div,
 .squat-hero.bg-medtronic-blue .content div,
 .squat-hero.bg-cobalt-blue .content div,
 .squat-hero.bg-medium-blue .content div,
 .squat-hero.bg-dark-gray .content div,
 .squat-hero.bg-blue-gray .content div {
     color: #fff !important;
 }

 .squat-hero.bg-sky-blue .content div,
 .squat-hero.bg-white .content div,
 .squat-hero.bg-light-gray .content div,
 .squat-hero.bg-light-blue .content div {
     color: #002554 !important;
 }

 .squat-hero.bg-cool-gray .content div {
     color: #53565A !important;
 }
 /*button color*/
 /*navy btn*/

 .squat-hero a.btn.bg-navy-blue {
     background-color: #001E46;
     border-color: #001E46;
     color:#fff;
 }

 .squat-hero a.btn.bg-navy-blue:hover {
     background-color: #0085CA;
     border-color: #0085CA;
 }
 /*medtronic blue btn*/

 .squat-hero a.btn.bg-medtronic-blue {
     background-color: #004B87;
     border-color: #004B87;
     color: #fff;
 }

 .squat-hero a.btn.bg-medtronic-blue:hover {
     background-color: #004B87;
     border-color: #004B87
 }
 /*cobalt blue btn*/

 .squat-hero a.btn.bg-cobalt-blue {
     background-color: #0085CA;
     border-color: #0085CA;
     color: #fff;
 }

 .squat-hero a.btn.bg-cobalt-blue:hover {
     background-color: #001E46;
     border-color: #001E46;
 }

 .squat-hero.bg-navy-blue a.btn.bg-cobalt-blue:hover,
 .squat-hero.bg-medtronic-blue a.btn.bg-cobalt-blue:hover {
     background-color: #B1B3B3;
     border-color: #B1B3B3;
 }
 /*orange btn*/

 .squat-hero a.btn.bg-orange {
     background-color: #E35205;
     border-color: #E35205;
     color: #fff;
 }

 .squat-hero a.btn.bg-orange:hover {
     background-color: #001E46;
     border-color: #001E46;
 }

 .squat-hero.bg-navy-blue a.btn.bg-orange:hover,
 .squat-hero.bg-medtronic-blue a.btn.bg-orange:hover {
     background-color: #B1B3B3;
     border-color: #B1B3B3;
 }
 /*purple btn*/

 .squat-hero a.btn.bg-purple {
     background-color: #B0008E;
     border-color: #B0008E;
     color: #fff;
 }

 .squat-hero a.btn.bg-purple:hover {
     background-color: #001E46;
     border-color: #001E46;
 }

 .squat-hero.bg-navy-blue a.btn.bg-purple:hover {
     background-color: #B1B3B3;
     border-color: #B1B3B3;
 }
 /*green btn*/

 .squat-hero a.btn.bg-green {
     background-color: #77BC1F;
     color: #001E46;
     border-color: #77BC1F;
 }

 .squat-hero a.btn.bg-green:hover {
     background-color: #B1B3B3;
     color: #fff;
     border-color: #B1B3B3;
 }

 .squat-hero.bg-white a.btn.bg-green:hover {
     background-color: #001E46;
     border-color: #001E46;
 }
.squat-hero a.text{
    display: block;
}
@media (min-width:500px){
    .squat-hero .hero__frame:before {
        border: 1.2rem solid #fff;
        top: 1.6rem;
        left: 1.6rem;
        bottom: 1.6rem;
        right: 1.6rem;
        width: calc(100% - 3.2rem);
        height: calc(100% - 3.2rem);
    }
}
 @media (min-width:750px) {
     .one-third .video-component__main,
     .one-third img {
         width: 270px
     }
     .two-thirds .video-component__main,
     .two-thirds img {
         width: 520px
     }
     .squat-hero .hero__frame:before {
         border-width: 0.8vw;
     }
     .squat-hero {
         height: 250px;
         display: block;
     }
     .squat-hero h2,.squat-hero h1 {
        font-size: 2.4rem;
        margin-bottom: 0;
        line-height: 2.3rem;
    }
     .squat-hero .content div,
     .squat-hero .content .btn {
        font-size: 1.4rem;
        line-height: 1.2;
        margin-bottom: 0;
    }
     .squat-hero .btn {
         padding: 7px;
     }
     .squat-hero>div {
         display: block;
         position: initial;
         height: inherit;
     }
     .squat-hero .pull-right {
         padding-left: 30px;
     }
     .squat-hero .pull-left {
         padding-right: 30px;
         float: left !important;
     }
     .squat-hero img {
         height: 100%;
     }
     .squat-hero .pull-right {
         padding-left: 20px;
         float: right !important;
     }
     .squat-hero .pull-left {
         padding-right: 20px;
         float: left !important;
     }
     .squat-hero .content.left {
        padding: 5.6vw 3vw 0;
    }
     .squat-hero .hero__frame .content.left {
         padding: 5.6vw 4.4vw 0;
     }
     .squat-hero .content.right {
         padding: 5.6vw 4.4vw 0 0;
     }
     .squat-hero .hero__frame .content.right, .squat-hero .hero__frame .content.left, .two-thirds.squat-hero .hero__frame .content.right, .two-thirds.squat-hero .hero__frame .content.left {
         padding-top: 4.6vw;
     }
     .squat-hero .video__trigger {
         height: inherit;
     }
     .squat-hero .video-component__main {
         height: 100%;
     }
 }

 @media (min-width:1000px) {
     .squat-hero {
         height: 334px;
     }
     .one-third .video-component__main,
     .one-third img {
         width: 354px
     }
     .two-thirds .video-component__main,
     .two-thirds img {
         width: 686px
     }
     .squat-hero .hero__frame:before {
         border-width: .8rem;
     }
     .squat-hero h2,.squat-hero h1 {
         font-size: 2.8rem;
         line-height: 2.66rem;
         margin-bottom: 0;
     }
     .squat-hero .content div,
     .squat-hero .btn {
        font-size: 1.6rem;
        line-height: 1.3;
        margin-bottom: 0;
     }
     .squat-hero .btn{
         margin-top:2rem;
     }
     .squat-hero a.text{
         margin-top:1.5rem;
         margin-bottom: 0;
     }
     .squat-hero .hero__frame .content.left,.two-thirds.squat-hero .hero__frame .content.left, .two-thirds.squat-hero .hero__frame .content.right {
        padding: 5.3rem 4.0rem 0;
    }
     .squat-hero .content.left, .two-thirds.squat-hero .content.left {
         padding: 5.3rem 2.8rem 0;
     }
     .squat-hero .content.right, .two-thirds.squat-hero .content.right {
         padding: 5.3rem 3.5rem 0 36rem;
     }
 }
.hero__frame.cobalt-blue:before {border-color:#0085CA}
.hero__frame.medium-blue:before {border-color:#00A9E0}
.hero__frame.sky-blue:before {border-color:#71C5E8}
.hero__frame.light-blue:before {border-color:#B9D9EB}
.hero__frame.blue-gray:before {border-color:#5B7F95}
.hero__frame.dark-gray:before {border-color:#88888D}
.hero__frame.light-gray:before {border-color: #B1B3B3}
.hero__frame.white:before {border-color:#FFFFFF}
.hero__frame.navy-blue:before {border-color:#001E46}
.hero__frame.medtronic-blue:before {border-color:#004B87}