/* Responsive Styles */


@media (max-width: 860px) {
    .block2 .text-right {
      line-height:14px;
      font-size:12px;
    }
    .block2 .red img {
      width:30px;
      height:15px;
    }
    .booths:first-child {
      margin-top:10px;
    }
    .booths.mt70 {
      margin-top:60px;
    }
    .block1 .cloudgrowth {
      background-size:361px 214px;
    }
    .cloudgrowth .big-cloud {
      right:20px;
    }
    .cloudgrowth .date2 {
      right:0;
    }
    #csptext {
      bottom: 35%;
    }

    /* #simple */

    .datacloud .logo {
        width:34px;
        height:8px;
        background-size:34px 8px;
        margin-left:-17px;
        top:74px;
    }
    .datacloud .hub1, .datacloud .hub2 {
      width:140px;
    }
      .hub1 .text1, .hub2 .text2 {top:11px;}
      .hub1 .text2, .hub2 .text1 {top:-23px;}
      .hub1 .text1 {left:-10px;}
      .hub2 .text2 {right:-10px;}
      .hub1 .text2 {left:7px;}
      .hub2 .text1 {right:7px;}

}



@media (max-width: 768px) {
  #wrap {
    padding:60px 20px 60px;
  }
  h4 {
    text-align:center;
    margin-bottom:15px;
  }
  .col-sm-6.pr30, .col-sm-6.pl30 {
    padding:0;
  }
  .col-sm-6.vr-dotted {
    background:none;
  }
  .hide-md {
    display:none;
  }
  .third {
    width:50%;
    float:right;
    margin-bottom:25px;
  }
  .third:first-of-type {
    float:left;
  }
    #max-wrap .third {
      width:33%;
      float:left;
    }

  .block2 .floathands {
    margin: 0 auto;
    margin-top:80px;
  }
  .block2 .bottles {
    max-width: 400px;
    margin: 0 auto;
    margin-top: 30px;
  }
  blockquote > div:after {
    content: '”';
    font-family:gotham;
    font-size:48px;
    font-weight:800;
    display:inline-block;
    padding-left:10px;
    top:22px;
    right:0;
    line-height:0;
    position:relative;
  }
  .block2 .text-right {
    line-height:15px;
    font-size:13px;
  }
  .block2 .red img {
    width:50px;
    height:25px;
  }
  .booths:first-child {
    margin-top:0;
  }
  .booths.mt70 {
    margin-top:20px;
  }
  .block1 .cloudtrends {
    padding-bottom:30px;
    margin-bottom:30px;
    background:url(img/hr-dotted.png) bottom left repeat-x;
  }
  .block1 .cloudgrowth {
    background-size:auto auto;
  }
  .cloudgrowth .big-cloud {
    right:60px;
  }
  .cloudgrowth .date2 {
    right:40px;
  }
  .block1 .cloudgrowth:before {
    margin-top:10px;
    background:none;
  }
  .block1 {
    margin-bottom:50px;
    padding-bottom:60px;
    background:url(img/hr-dotted.png) bottom left repeat-x;
  }
  .block2 .floathands {
    margin-top:30px;
    background:url(img/hr-dotted.png) bottom left repeat-x;
    margin-bottom:50px;
    padding-bottom:10px;
  }
  .block3 .bg2, .block3 .draw2 {
    display:block;
  }
  .block3 .bg, .block3 .draw1 {
    display:none;
  }
  #enterprise { top:33%; width:12%; left:3%; }
  #perfhub {width:10%; top:34%; left:26%;}
  #nsp {width:16%; bottom:24%; left:51%;}
  #ece {width:21%; bottom:49%; left:48.5%;}
  #azure {width:20%; bottom:85%; left:72%;}
  #aws {width:20%; bottom:68%; left:78%;}
  #csp {width:20%; bottom: 37%; left:75%;}
  #enterprisetext { left: 3%; top: 28%; width: 12%; }
  #perfhubtext {width:12%; top:29%; left:26%;margin-left:-2%;}
  #nsptext {width:29%; bottom:20%; left:53%; margin-left:-8%;}
  #ecetext {bottom:44%; left:43%;}
  #azuretext {top:17%; right:21%;}
  #awstext {top:36%; right:17%;}
  #csptext {bottom: 34%; left: 75%; width:20%;}

  /* #improved */
  .improved {
    margin-top:30px;
  }
  .waves {
    min-height:320px;
  }
}

@media (max-width: 650px) {

  /* cloud-readiness */
  .block3 .abs .text {
    font-size:10px;
  }
  #csptext {bottom: 32%; }
  /* #improved */
  .radio {
    height:52px;
  }
  .moneyhand {
    height:87px;
  }
  .improved .mr10.number {
    margin-bottom:90px;
  }
  .improved .f11 {
    margin-top:5px;
    max-width:50%;
  }
  .radiohand .dblock.f12 {
    float:left;
  }
  .tenmilliseconds {

  }
  .tenmilliseconds .text {
    padding:0;
    margin-bottom:20px;
  }
  .tenmilliseconds .right {
    float:none;
    margin:0 auto;
    padding:0;
  }



  /* #simple */
  #simple-wrap .strategies {
    float:none;
    background:url(img/hr-dotted.png) repeat-x bottom left;
    padding-bottom:60px;
    margin-bottom:40px;
  }
  .guybubble {
    float:none;
    max-width:300px;
    margin:0 auto;
    width:100%;
    border-left:0;
    padding-left:0;
    background:none;
    margin-bottom:20px;
  }
  .datacloud .logo {
    top:78px;
    height:15px;
    width:67px;
    background-size:67px 15px;
    margin-left:-33px;
  }
  .datacloud .pubcloud {
    margin-left:-90px;
  }
  .datacloud .hub2 {
    right:0;
  }
  .line1 {
    margin-left:-110px;
  }
  .line2 {
    margin-left:-10px;
  }
  .line3 {
    margin-left:-60px;
  }
  .datacloud .pubcloud {
  }
  .datacloud .hub1, .datacloud .hub2 {
    width:180px;
  }
    .hub1 .text1, .hub2 .text2 {top:5px;}
    .hub1 .text2, .hub2 .text1 {top:-33px;}
    .hub1 .text1 {left:10px;}
    .hub2 .text2 {right:10px;}
    .hub1 .text2 {left:34px;}
    .hub2 .text1 {right:34px;}

  .waves {
    min-height:250px;
  }

  /* #max */
  .redbox {
    height:250px;
  }
  /* #simple */
  .gbone {
    display:none;
  }
  .gbtwo {
    display:block;
  }

  /* #final */
  #final-wrap .button {
    margin-top:0;
    float:left;
  }

}
@media (max-width: 520px) {

  .waves {
    min-height:180px;
  }

  /* #max */
  #max-wrap .third {
    width:100%;
    padding:0;
    margin:15px 0 0;
  }
    #max-wrap .third .redbox {
      margin:0;
      height:auto;
    }


  /* #simple */
  .datacloud .hub1, .datacloud .hub2 {
    width:140px;
  }
    .hub1 .text1, .hub2 .text2 {top:11px;}
    .hub1 .text2, .hub2 .text1 {top:-23px;}
    .hub1 .text1 {left:-10px;}
    .hub2 .text2 {right:-10px;}
    .hub1 .text2 {left:7px;}
    .hub2 .text1 {right:7px;}

  .datacloud .logo {
      width:34px;
      height:8px;
      background-size:34px 8px;
      margin-left:-17px;
      top:74px;
  }
}


@media (max-width: 480px) {
  .hide-sm {
    display:none !important;
  }
  #wrap {
    padding:40px 10px
  }
  section .drawer .row {padding:24px 15px}

  .third {
    float:none;
    text-align:left;
    clear:both;
    margin:0 auto;
    width:100%;
  }
  .third:first-of-type {
    float:none;
  }
    .rearchitect .third.text-right {
      max-width:180px;
      margin:0 auto;
    }
      .rearchitect .third.text-right p {
        width:100px;
        padding-top:30px;
      }
      .third.text-left p.right, .third.text-left img.right {
        float:none;
        display:inline-block;
        clear:left;
      }
      .third.text-left img.right {
        float:left;
      }


  /* #cloud-readiness */
  .block1 .cloudgrowth {
    min-height:200px;
  }
  .block1 .cloudChart {
    width:75px;
    height:75px;
  }
    .cloudChart.ml-35 {
      margin-left:-30px;
    }
    .block1 .legends {
      font-size:12px;
    }
      .block1 .legends:first-of-type {
        left:45px;
      }
  .block3 .pieces .text, .block3 .abs > .text div {
    font-size:8px;
  }



    /* #improved */
    .radio {
    }
    .moneyhand {
      width: 100%;
    }
    .improved .mr10.number {
      margin-bottom:10px;
    }
    .improved .f11 {
      max-width:100%;
    }
    .elevator {
      padding:120px 0 0 0;
      background-position:left top;
      background-size:33px auto;
    }
    .elevator button {
      margin-right:10px;
      font-size:10px;
      width:120px;
    }
    .waves {
      padding:0;
      margin:0 0 0 -150px;
      min-height:200px;
    }
      .waves .latencyimg {
        left:50px;
      }

    /* #simple */
    .datacloud .hub1, .datacloud .hub2 {
      width:120px;
    }
      .hub1 .text1, .hub2 .text2 {top:15px;}
      .hub1 .text2, .hub2 .text1 {top:-13px;}
      .hub1 .text1 {left:-18px;}
      .hub2 .text2 {right:-18px;}
      .hub1 .text2 {left:-8px;}
      .hub2 .text1 {right:-8px;}
}


@media (max-width: 380px) {
  .hide-sm2 {
    display:none !important;
  }

  /* #cloud-readiness */
  .bottles .w200 {
    width:100px;
  }
  .block2 .l215 {
    left:115px;
  }
  .waves {
    min-height:200px;
  }

  .block1 .cloudgrowth {
    margin-bottom:100px;
    min-height:160px;
  }
  .cloudgrowth .cloud-data {
    bottom:-120px;
  }
  .hand-cloud {
    margin-left:20px;
  }
  .hand-cloud.right {
    margin-right:20px;
  }
  .cloudgrowth .big-cloud {
    right:30px;
  }
  .cloudgrowth .small-cloud, .cloudgrowth .cloud-data {
    left:60px;
  }
  .cloudgrowth .date1 {
      left:58px;
  }
  .cloudgrowth .date2 {
    right:10px;
  }
  .block1 .channel {
    background:#d8d7d7;
    padding:2px;
    padding-right:0;
    position:absolute;
    height:8px;
    width:75px;
  }
    .block1 .box {
      height:4px;
      width:4px;
      margin-right:4px;
    }
  #azure img {
    min-height:0;
    bottom:9px;
  }
  #csptext {bottom: 32%;}

  /* #improved */
  section .drawer .whylatency {
    padding-bottom:0;
  }
  .waves {
    min-height:140px;
  }
  .elevator {
    background-size:22px auto;
    background-position:left top;
  }

  /* #final */
  #final-wrap .button {
    width:200px;
  }
}


@media (max-width: 320px) {

  .hide-xsm {
    display:none !important;
  }

  /* #cloud-readiness */
  .block1 .channel {
    background:#d8d7d7;
    padding:2px;
    padding-right:0;
    position:absolute;
    height:8px;
    width:75px;
  }
    .block1 .box {
      height:4px;
      width:4px;
      margin-right:4px;
    }

  .block3 .pieces .text {
    font-size:7px;
    line-height:8px;
  }
  #enterprisetext { left: 3%; top: 28%; width: 12%; }
  #perfhubtext {width:12%; top:27%; left:26%;margin-left:-2%;}
  #nsptext {width:29%; bottom:19%; left:53%; margin-left:-8%;}
  #ecetext {bottom:42%; left:42%;}
  #azuretext {top:17%; right:14%;}
  #awstext {top:36%; right:15%;}
  #csptext {bottom: 28%;}
  #azure img {bottom:5px;min-height:0;}
  #aws img {bottom:5px;}
  blockquote > div::after {
    top:12px;
  }


  /* #improved */
  .improved .f15 {
    clear:both;
  }
  .elevator {

  }
  .meter {
    background-position:0 bottom;
  }
  .meter .arrow {
    margin-left:-77px;
  }
  .meter .nubbin {
    margin-left:-82px;
  }
}


/* Height Responsive */

@media (min-height: 644px) {
  html {
    height:100%;
  }
  body {
    min-height:100%;
  }
}