.home-page .office-block  .row > .col-md-4,
.home-page .office-block  .row > .col-md-8,
.home-page .office-block  .row > .col-sm-12 {
    padding-left: 0;
    padding-right: 0;
}

.home-page .office-block .container-fluid {
    padding-left: 0;
    padding-right: 0;
}

.home-page .office-block .container-fluid .row {
    margin-left: 0;
    margin-right: 0;
	margin-bottom: 40px;
}


.home-page .office-block .col-calendar {
    display: none;
}


    .home-page .office-block .pin {
        position: absolute;
        transition: left 0.4s ease-in-out;
        display: block;
    }


    .home-page .office-block .pin .icon {
        /*width: 0;*/
        /*height: 0;*/
                width: 56px;
                height: 64px;
        transform: scale(0);
        transition: all 0.3s ease-in;
        overflow: hidden;
        cursor: hand;
    }

    .home-page .office-block .pin.show-pin {
        display: block;
    }

    .home-page .office-block .pin.show-pin .icon {
        transform: scale(1);
    }

    .pin .icon img {
        width: 56px;
    }

    .pin:hover {
        -webkit-filter: drop-shadow(0px 0px 20px rgba(255,255,255,1));
        filter: drop-shadow(0px 0px 20px rgba(255,255,255,1));
    }

    .pin.bounce {
      animation: bounce 1s linear forwards;
      transform: translate3d(0, 0, 0);
      animation-iteration-count: 2;
      /*animation-delay: 2s;*/
    }

    @keyframes bounce {
        0% { transform: translateY(0); }
        10% { transform: translateY(-10px); }
        20% { transform: translateY(0); }
        30% { transform: translateY(-10px); }
        40% { transform: translateY(0); }
        100% { transform: translateY(0); }
    }

    @keyframes nothing {
        0% { transform: translateY(0); }
        100% { transform: translateY(0); }
    }



    .pin .detail p {
        display: table-cell;
        vertical-align: middle;
        /*text-align: center;*/
        color: #fff;
        /*letter-spacing: 1px;*/
        font-size: 12px;
        line-height: 18px;
    }


    .pin.show-detail .detail{
        opacity: 1;
    }

    /*
    .pin.offscreen {
        left: 655px !important;
    }
    */

    /*
    .pin.left.offscreen {
        left: -90px !important;
    }
    */





@media only screen and (max-width: 768px) {

    .o365-desktop-only {
        display: none;
    }

    .o365-mobile-only {
        display: block;
    }

    section.office-block h2,
    section.office-block p {
        padding-left: 10px
    }

    .home-page .office-block .col-map {
        /*height: 110vw;*/
		height: 80vm;
        overflow: hidden;
    }

    .pin {
        height: 100%;
        width: 100%;
    }


    .pin .detail {
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        padding: 5% 10%;
        height: 5%;
        color: #fff;
        opacity: 0;
        transition: opacity 0.4s;
        display: table;
    }

    .pin .detail strong {
        display: none;
    }

    .home-page .office-block .pin {
        top: 0;
        left: 0;
    }

    .home-page .office-block .pin .icon {
        position: absolute;
        width: 11vw;
        height: 14vw;
    }

    .pin .icon img {
        width: 11vw;
    }

    .pin-0 .detail {
        background-color: rgba(46,172,227, 1);
    }

    .pin-1 .detail {
        background-color: rgba(220,76,41, 1);
    }

    .pin-2 .detail {
        background-color: rgba(243,112,33, 1);
    }

    .pin-3 .detail {
        background-color: rgba(36,118,73, 1);
    }

    .pin-4 .detail {
        background-color: rgba(36,118,188, 1);
    }

    .hit-0,
    .pin-0 .icon {
        top: 62%;
        left: 22%;
    }

    .hit-1,
    .pin-1 .icon {
        top: 35%;
        left: 7%;
    }

    .hit-2,
    .pin-2 .icon {
        top: 13%;
        left: 22%;
    }

    .hit-3,
    .pin-3 .icon {
        top: 7%;
        left: 72%;
    }

    .hit-4,
    .pin-4 .icon {
        top: 42%;
        left: 83%;
    }

    /*
    need these b/c pins occupy 100%x100% on mobile
    each pin prevents clicks to previous pins.
    create hit area that sit on top of pins.
    */
    .hit {
        position: absolute;
        width: 11vw;
        height: 14vw;
        /*background-color: #ff0;*/
    }

    /*
     ---------------------------------------------------------------------------
     glow states
    */
    .pin-0.show-detail .icon,
    .pin-1.show-detail .icon,
    .pin-2.show-detail .icon,
    .pin-3.show-detail .icon,
    .pin-4.show-detail .icon {
        -webkit-filter: drop-shadow(0px 0px 5px rgba(255,255,255,1));
        filter: drop-shadow(0px 0px 5px rgba(255,255,255,1));
    }


     /*
     ---------------------------------------------------------------------------
     */

     .home-page .office-block .row-office-features-header {
         /*margin-top: 0;*/
     }

     .home-page .office-block .row-features {
         display: flex;
        flex-wrap: wrap;
        align-items: stretch;
     }

     .home-page .office-block .row-features > .col-md-4 {
         display: flex;
     }

     .home-page .office-block .row-features .office-feat {
         font-size: 12px;
     }

     .home-page .office-block .row-features .office-feat img {
         width: 50px;
     }

}



@media only screen and (min-width: 768px) {

    .o365-desktop-only {
        display: block;
    }

    .o365-mobile-only {
        display: none;
    }

    .section-divider-office {
        background-position: -33px -898px;
        width: 948px;
        height: 56px;
        margin-top: 50px;
    }



    .home-page .office-block .intro {
        display: block;
    }

    .home-page .office-block .intro h2 {
        text-transform: capitalize;
    }

    .row-interactive {
        margin-top: 40px;
    }
    .home-page .office-block .col-calendar {
        display: block;
    }

    .home-page .office-block .col-map {
        height: auto;
        overflow: hidden;
    }

    .home-page .office-block .col-map .office-map-wrap {
        margin-left: 5px; /* ie */
        height: 613px;
        overflow: hidden; /* ie */
    }

    .home-page .office-block .col-map .office-map-wrap svg {
        /* for ie */
        width: 651px;
        height: 651px;
    }

    .pin .detail {
        position: absolute;
        top: 0;
        left: 58px;
        width: 284px;
        border-radius: 3px;
        padding: 5px 10px;
        height: 45px;
        color: #fff;
        opacity: 0;
        transition: opacity 0.4s;
        display: table;
    }

    .pin.left .detail {
        left: auto;
        right: 58px;
    }

    .pin-skype .detail {
        background-color: rgba(46,172,227, 1);
    }

    .pin-powerpoint .detail {
        background-color: rgba(220,76,41, 1);
    }

    .pin-call .detail {
        background-color: rgba(243,112,33, 1);
    }

    .pin-excel .detail {
        background-color: rgba(36,118,73, 1);
    }

    .pin-outlook .detail {
        background-color: rgba(36,118,188, 1);
    }

    .pin-skype {
        top: 430px;
        left: 152px;
    }

    .pin-powerpoint {
        top: 280px;
        left: 52px;
    }

    .pin-call {
        top: 116px;
        left: 152px;
    }

    .pin-excel {
        top: 60px;
        left: 500px;
    }

    .pin-outlook {
        top: 320px;
        left: 550px;
    }


}

.row-office-features-header {
    margin-top: 40px;
    margin-bottom: 20px;
}

.home-page .office-block h2 span.reg {
    font-size: 0.6em;
    vertical-align: text-top;
}

.office-feat {
    text-align: center;
    padding: 20px;
}



.office-feat .oy {
    display: none;
}

@media only screen and (max-width: 768px) {

    .office-feat .content {
        min-height: 90px;
    }

    .row-features .col-xs-6 {
        width: 49%;
    }

    .row-features .col-md-4:nth-child(-n+4) {
        border-bottom: 1px dashed;
    }

    .row-features .col-md-4:nth-child(odd) {
        border-right: 1px dashed;
    }
	
	.home-page .office-block .pin.show-pin .icon {
        transform: scale(.75);
    }
}

@media only screen and (max-width: 479px) {

    .office-feat .content {
        min-height: 65px;
    }

    .row-features .col-xs-6 {
        width: 100%;
    }

    .row-features .col-md-4:nth-child(-n+5) {
        border-bottom: 1px dashed;
    }

    .row-features .col-md-4:nth-child(odd) {
        border-right: none;
    }
	
	
	.pin .detail {
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        padding: 1% 10%;
        height: 5%;
        color: #fff;
        opacity: 0;
        transition: opacity 0.4s;
        display: table;
    }
}

@media only screen and (min-width: 769px) {

    .office-feat img {
        width: 70px;
    }

    .office-feat .content {
        min-height: 45px;
    }

    .row-features .col-md-4:nth-child(2) ,
    .row-features .col-md-4:nth-child(5) {
        border-left: 1px dashed;
        border-right: 1px dashed;
    }

    .row-features .col-md-4:nth-child(-n+3) {
        border-bottom: 1px dashed;
    }


    .office-feat .oy {
        display: inline;
    }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {
	.home-page .office-block .col-map .office-map-wrap svg {
        /* for ie */
        width: 467px;
        height: 716px;
    }
	
	.pin-skype {
        top: 412px;
        left: 106px;
    }

    .pin-powerpoint {
        top: 297px;
        left: 35px;
    }

    .pin-call {
        top: 180px;
        left: 100px;
    }

    .pin-excel {
        top: 152px;
        left: 362px;
    }

    .pin-outlook {
        top: 329px;
        left: 390px;
    }

}