.apple-intro {margin: 5rem 0 1rem;}
.apphr {margin: 10% 0 10%;}
main {padding-bottom: 0px;}
.no-margin-top {margin-top : 0px;}
.margin-left-15{margin-left : 15px;}
.announcement-wrapper{margin: 4rem auto -1rem;}
.announcement-wrapper .separator__up { margin-top: 4rem;}
.section-title,
.benefit-card h2,
.node-type-modular-standard-page .overview-editorials__title {
    font-size: 2.125rem;
    margin-top: .6875rem;
    line-height: 1;
    font-family: inherit;
}

/* Banner */
.event-banner {
    background-color: #005cb9;
    min-height: 77px;
    padding: 0 10px;
}
.event-banner p {
  color: #fff;
  margin: 0;
}
.event-banner p .learn-more-link {
  color: #fff;
}
.event-banner .description {
  margin: 27px 0;
  text-align: center;
}

.event-banner .description a {
  color: white;
  text-decoration: underline;
}

.event-banner .description sup {
    display: inline-block;
    border-bottom: 1px solid #fafafa;
    padding-bottom: 10px;
}

.event-banner .logo img {
  margin: auto;
  margin-top: 22px;
}

@media screen and (min-width: 62.5rem) {
  .event-banner .description {
  margin: 27px 0;
  text-align: center;
  padding-left: 70px;
 }
}


/* App Icons */
.apple-apps .dock img {
  width: 50%;
  margin:auto;
}
.apple-apps .dock>div {height:100px;}
.apple-apps .dock>div img {display: none;}




/* Device Overlay */
.overlay {display:none;}
.apple-devices .device img {
  width: 75%;
  margin: auto;
}
.apple-devices .copy {
  margin-top: 6%;
}
.device .overlay {
  position: absolute;
  background-color: #fff;
  height: 85px;
  font-size: 14px;
  padding: 23px 10px 0 0;
  width: 50%;
  border-radius: 4px;
  -webkit-box-shadow: 0px 0px 60px -5px rgba(0,0,0,0.3);
  -moz-box-shadow: 0px 0px 60px -5px rgba(0,0,0,0.3);
  box-shadow: 0px 0px 60px -5px rgba(0,0,0,0.3);
}
.device .overlay .col-sm-9 {padding:0;}
.device .overlay .col-sm-3 img {
  width: 65%;
  padding: 10% 0 0 15%;
}
.device .overlay.box1 {
  margin-top: 20%;
}
.device .overlay.box2 {
  margin-top: 50%;
}
.device .overlay.box3 {
  margin-top: 80%;
}




/* iPad */
.apple-experience .container img {position:absolute;}
.apple-experience {
  background-color: #f4f4f4;
  padding-top: 8%;
  margin: 7% 0 0 0;
}
.apple-dev {
  margin-top: 9%;
}
.apple-dev p {padding: 0 10% 0 10%;}
.ipad-ui {
 width: 718px;
 height: 539px;
 z-index: 10;
 position: absolute;
 margin: 40px 0 0 128px;
 background-image: url(/sites/default/files/ipad_ui.png);
 background-size: contain;
 background-repeat: no-repeat;
}

.code {
  width: 375px;
  height: 540px;
  background: #222325;
  color: white;
  font-size: 12px;
  font-family: monospace;
  text-align: left;
  margin: 40px 0 0 72px;
  padding: 30px 30px 0 30px;
  border-radius: 0 3px 3px 0;
  overflow: hidden;
}
.code a {color:inherit;}
.code .red {color: #a71d5d;}
.code .comment {color: #969896;}





/* Use Cases */
.apple-usecase .usecase.active .card {
  background: #357eeb;
  border: 1px solid #357eeb;
}
.banner-text-img .container .hero-text h1 {
 max-width: 100%;
}
.apple-usecase .usecase.active .card .arrow span {
  border-left: 12px solid transparent;
  border-right: 12px solid transparent;
  border-top: 12px solid #357eeb;
  position: absolute;
}
.apple-usecase .usecase.active .card .use-title {
  color: white;
}

.apple-usecase .arrow {
  position: absolute;
  margin-left: 30%;
  margin-top: 37px;
}

.apple-usecase .card-expanded {
 display: none;   
 border: 1px solid #ccc;
 margin: 1%;
 width: 98%;
 padding: 2% 3% 3% 3%;
}
.apple-usecase .card-expanded.active {
  display: block;
}
.apple-usecase .card-expanded .mobile-title {
  display:none;
}
.apple-usecase .usecase {padding:0;}

.apple-usecase .card {
  border: 1px solid #ccc;
  border-radius: 2px;
  padding: 10%;
  min-height: 150px;
  text-align: center;
  margin: 4%;
}
.apple-usecase .card:hover {
  border: 1px solid #357eeb;
}
.apple-usecase .card .use-title {
  text-transform: uppercase;
  color: #357eeb;
}
.apple-usecase .card .use-icon {
  background-image: url(/sites/default/files/apple_use_case_icons.png);
  width: 33px;
  height: 29px;
  background-repeat: no-repeat;
  background-size: cover;
  margin: 20px auto 15px;
}

.apple-usecase .card .use-icon.icon0 {background-position: 2px 0;}
.apple-usecase .card .use-icon.icon1 {background-position: -56px 0;}
.apple-usecase .card .use-icon.icon2 {background-position: -115px 0;}
.apple-usecase .card .use-icon.icon3 {background-position: -165px 0;}
.apple-usecase .usecase.active .card .use-icon.icon0 {background-position: -28px 0;}
.apple-usecase .usecase.active .card .use-icon.icon1 {background-position: -84px 0;}
.apple-usecase .usecase.active .card .use-icon.icon2 {background-position: -141px 0;}
.apple-usecase .usecase.active .card .use-icon.icon3 {background-position: -188px 0;}

.card-expanded {
  border: 1px solid #ccc;
  margin: 2%;
  width: 96%;
  padding: 2% 3% 3% 3%;
}




/* Testimonials */
.apple-testimonials {
  background: #f4f4f4;
  padding: 5% 0 0 0;
  margin-top: 7%;
}

.apple-testimonials h4 {
  color: #1b49a0;
  font-size: 1rem;
}

.apple-testimonials .logos {
  background: #e9e9e9;
  height: 70px;
  margin-top: 2%;
}
.apple-testimonials .logo img {
  cursor: pointer;
  margin: auto;
  -khtml-opacity: 0.4;
  opacity: 0.4;
}
.apple-testimonials .logo.active img {
 -khtml-opacity: 1.0;
 opacity: 1.0;
}
.apple-testimonials .logo img:hover {
 -khtml-opacity: 1.0;
 opacity: 1.0;
}

.quote0 .intro, .quote1 .intro, .quote3 .intro {padding-top: 35px;}

.apple-testimonials #quote0 img {
  width: 125px;
  padding-top: 19px;
}
.apple-testimonials #quote1 img {
  width: 110px;
  padding-top: 9px;
}
.apple-testimonials #quote2 img {
  width: 85px;
  padding-top: 18px;
}
.apple-testimonials #quote3 img {
  width: 41px;
  padding-top: 17px;
}
.apple-testimonials .arrow {
 position: absolute;
 margin-left: 41%;
 display: none;
}
.apple-testimonials .logo.active .arrow {
  display: block;
}
.apple-testimonials .arrow span {
  border-left: 12px solid transparent;
  border-right: 12px solid transparent;
  border-top: 12px solid #f4f4f4;
  position: absolute;
}
.apple-testimonials .quote {
  display:none;
  min-height: 230px;
}
.apple-testimonials .quote.active {display:block;}




/* Get Started */
.bottom-block {
  padding: 3.125rem 0;
}
.bottom-block .btn {
  margin-bottom: 1.5625rem;
}
.bottom-block h2 {
  margin-bottom: 1.8125rem;
}




/* Break Points */
@media (min-width: 48em) {
  .bottom-block {
    padding: 3.4375rem 0;
  }
  .bottom-block .btn {
    margin-bottom: 0;
  }
  .bottom-block .btn:nth-child(-n+2) {
    margin-right: 1.25rem;
  }
}
@media (min-width: 62.5em) {
  .bottom-block {
    padding: 5.75rem 0;
  }
}

@media (min-width: 479px) and (max-width: 767px) {
  .apple-usecase .usecase .arrow {
   display: none!important;
 }
 .apple-testimonials .arrow {
   display: none!important;
 }
}
@media (max-width: 767px) {
 .banner-text-img .container .hero-text {
   text-align: center;
 }
 .apple-intro {margin-top: 10%;}
 .apple-intro .copy {margin-top: 0;}
 .apple-devices .copy {text-align: center;}
 .apple-apps .dock > div img {width: 100%;display:block!important;}
 .apple-usecase .card {
  padding: 0px;
  min-height: 70px;
  margin-bottom: 12%;
}
.apple-apps .dock>div {
  height: 70px;
}
.apple-usecase .card .use-title {
  display: none;
}
.apple-usecase .usecase .arrow {
  margin: 0 0 0 31%;
}
.apple-testimonials .arrow {
 margin-left: 28%;
}
.apple-usecase .card-expanded .mobile-title {
  display:block;
    text-align: left;
    margin-top: 20px;
}
.banner-text-img .container .hero-text .btn {
  width: 17.75rem;
  position: inherit;
  bottom: 0;
  left: 0%;
  margin-left: 0;
}
}

@media (max-width: 1000px) {
  .apple-experience .ipad-screen {display:none;}
  .apple-dev {margin-top: 10%;}
  .overlay {display:none!important;}
  .apple-experience .container img {
   position: inherit;
   padding-bottom: 5%;
 }
}
