/* - Custom Dashboard - */
.welcome-panel .welcome-panel-close {
    display: none!important;
}

#welcome-panel.welcome-panel {
    padding: 25px;
    background: #303533;
    overflow:visible;
}

#welcome-panel .column {
    width: 31%;
    position: relative;
    display: inline-block;
    margin-right: 30px;
    vertical-align: top;
}

.column div{
  vertical-align: top;
}

#welcome-panel .column.review {
    margin-right: 0px;
}
.services{
  display:flex;
  display:-ms-flexbox;
  justify-content: space-around;
}

.service {
    width: 23.5%;
    margin:12px;
    display: inline-block;
    background: #F1F1F1;
    /*border: 1px solid #E0E0E0;*/
    padding: 10px 15px 35px;
    box-sizing: border-box;
    position:relative;
    opacity: 0.85;
    -webkit-transition: all 400ms cubic-bezier(0.165, 0.840, 0.440, 1.000);
   -moz-transition: all 400ms cubic-bezier(0.165, 0.840, 0.440, 1.000);
     -o-transition: all 400ms cubic-bezier(0.165, 0.840, 0.440, 1.000);
        transition: all 400ms cubic-bezier(0.165, 0.840, 0.440, 1.000); /* easeOutQuart */

-webkit-transition-timing-function: cubic-bezier(0.165, 0.840, 0.440, 1.000);
   -moz-transition-timing-function: cubic-bezier(0.165, 0.840, 0.440, 1.000);
     -o-transition-timing-function: cubic-bezier(0.165, 0.840, 0.440, 1.000);
        transition-timing-function: cubic-bezier(0.165, 0.840, 0.440, 1.000); /* easeOutQuart */
        -webkit-box-basis: auto;
    -webkit-flex-basis: auto;
    -ms-flex-basis: auto;
    flex-basis: auto;
    -webkit-box-flex: 1;
    /* OLD - iOS 6-, Safari 3.1-6 */
    -moz-box-flex: 1;
    /* OLD - Firefox 19- */
    -webkit-flex: 1;
    /* Chrome */
    -ms-flex: 1 0 auto;
    /* IE 10 */
    flex: 1;
}

.service img {
    /*width: 130px;
    margin: 0 auto;
    display: block; ver 1*/
    width: 90px;
    margin: 0 10px 0 0;
    display: inline-block;
    vertical-align: top;
    -webkit-transition: all 400ms cubic-bezier(0.165, 0.840, 0.440, 1.000);
   -moz-transition: all 400ms cubic-bezier(0.165, 0.840, 0.440, 1.000);
     -o-transition: all 400ms cubic-bezier(0.165, 0.840, 0.440, 1.000);
        transition: all 400ms cubic-bezier(0.165, 0.840, 0.440, 1.000); /* easeOutQuart */

-webkit-transition-timing-function: cubic-bezier(0.165, 0.840, 0.440, 1.000);
   -moz-transition-timing-function: cubic-bezier(0.165, 0.840, 0.440, 1.000);
     -o-transition-timing-function: cubic-bezier(0.165, 0.840, 0.440, 1.000);
        transition-timing-function: cubic-bezier(0.165, 0.840, 0.440, 1.000); /* easeOutQuart */
}

.service__text {
    display: inline-block;
    width: 213px;
    line-height: 1.45;
}


.service:last-of-type {
    margin-right: 0;
}
.service:first-of-type {
    margin-left: 0;
}

.service a {
    position: absolute;
    bottom: 0;
    width: 100%;
    background: #A02C32;
    left: 0;
    text-align: center;
    color: white;
    text-transform: uppercase;
    letter-spacing: 1px;
    border-top: 3px solid #D46F6F;
}

.service a:hover {
    color: white;
    background: #389AB7;
    border-color: #95C8DC;
}

.service:hover img {
    transform: scale(1.1) rotate(10deg);
    -webkit-transform: scale(1.1) rotate(10deg);
}

.service:hover{
  opacity:1;
}

h3.service__name {
    font-size: 16px;
    margin: 2px 0 5px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: #584A4A;
    line-height: 1.3;
}

/*.service p {
    font-size: 15px;
    font-weight: 300;
} ver 1*/

.service p {
    font-size: 13px;
    font-weight: 300;
    margin-top: 0px;
}

.cb-intro img {
    width: 56%;
    display: block;
    margin: 0 auto;
}

.cb-intro p {
    font-size: 16px;
    text-align: center;
    color:rgb(236, 236, 236);
}

.referral {
    margin-top:-30px;
}

.referral > a {
    color: white;
    font-size: 25px;
    text-align: center;
    width: 100%;
    display: block;
    padding: 15px;
    text-transform: uppercase;
    box-sizing: border-box;
    line-height: 1;
    background: #2C8675;
    border: 7px solid #50A091;
}

.referral > a:hover {
    color: white;
    background: #50A091;
    border: 7px solid #7EC3B6;
}

.referral a span {
    font-size: 15px;
    display: block;
    margin-top: 7px;
}

a.social-icon {
    width: 39px;
    height: 39px;
    display: inline-block;
    margin-right: 10px;
    margin-bottom: 8px;
    border-radius: 100%;
    background: url("../images/social_icon_sprite.png");
    background-repeat: no-repeat!important;
}

a.social-icon.social-icon--facebook {
    /*background: url("http://www.checkerboard.com/wp-content/uploads/2016/03/social_icon_sprite.png") #1B5AA9;
    background-position-x: -37px;
    background-position-y: 6px;*/
    background:#1B5AA9 url("../images/social_icon_sprite.png") repeat scroll -38px 4px;
}

a.social-icon.social-icon--twitter {
    /*background: url("http://www.checkerboard.com/wp-content/uploads/2016/03/social_icon_sprite.png") #4A9CD6;
    background-position-x: 2px;
    background-position-y: 6px;*/
    background:#4A9CD6 url("../images/social_icon_sprite.png") repeat scroll 0px 4px;
}

a.social-icon.social-icon--gplus {
    background: url("http://www.checkerboard.com/wp-content/uploads/2016/03/social_icon_sprite.png") #909090;
    background-position-x: -77px;
    background-position-y: 6px;
    background:#909090 url("../images/social_icon_sprite.png") repeat scroll -77px 4px;
}

a.social-icon.social-icon--linkedin {
    background: url("http://www.checkerboard.com/wp-content/uploads/2016/03/social_icon_sprite.png") #2C65A0;
    background-position-x: -157px;
    background-position-y: 4px;
    background:#2C65A0 url("../images/social_icon_sprite.png") repeat scroll -158px 4px;
}

a.social-icon.social-icon--youtube {
    background: url("http://www.checkerboard.com/wp-content/uploads/2016/03/social_icon_sprite.png") #B72539;
    background-position-x: -118px;
    background-position-y: 5px;
    background:#B72539 url("../images/social_icon_sprite.png") repeat scroll -118px 4px;
}

.social-icons {
    width: 261px;
    margin: 15px auto 0;
}

.social-icons > :last-child {
    margin-right: 0 !important;
}

.review h3 {
    margin-top: 0;
    color: white;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 20px;
    margin-bottom: 10px;
}

.review p {
    width: 70%;
    display: inline-block;
    color: #E0DFDF;
    font-size: 14px;
    margin:0 10px 0 0;
}

.review a {
    color: white;
    background: #C53AA7;
    padding: 5px;
    text-transform: uppercase;
    font-size: 25px;
    border: 5px solid #CA5DB2;
    vertical-align: top;
    display: inline-block;
    margin: 6px 10px 0 0;
}

.review a:hover {
    color: white;
    border: 5px solid #D475BF;
    background: #DA58BE;
}

/*#welcome-panel > div:first-of-type {
    margin-bottom: 35px;
} ver 1*/

@media screen and (max-width:1782px) {
  .service {
    width: 22.4%;
  }
}

@media screen and (max-width:1731px) {
  .service__text {
    display: inline-block;
    width: 205px;
}
}

@media screen and (max-width:1699px) {
.service__text {
    display: inline-block;
    width: 175px;
}
}

@media screen and (max-width:1569px) {
body .service img {
  width: 90px;
  margin: 0 auto 5px;
  display: block;
}
div.service h3.service__name {
  text-align:center;
}

body .service__text {
  display: inline-block;
  width: 100%;
}
}

@media screen and (max-width:1544px) {
  .service {
    width: 22.35%;
  }
}

@media screen and (max-width:1504px) {
  .service {
    width: 22.25%;
  }
}

@media screen and (max-width:1434px) {
  .service {
    width: 22.15%;
  }
}

@media screen and (max-width:1396px) {
  .service {
    width: 22.05%;
  }
}

@media screen and (max-width:1309px) {
  .service {
    width: 21.95%;
  }
}

@media screen and (max-width:1261px) {
  .service {
    width: 21.85%;
  }
}

@media screen and (max-width:1215px) {
  .service {
    width: 21.75%;
  }
  #welcome-panel .column {
    width: 30%;
  }
}

@media screen and (max-width:1171px) {
  .service {
    width: 22.65%;
  }
}

@media screen and (max-width:1132px) {
  .service {
    width: 22.55%;
  }
}

@media screen and (max-width:1100px) {
  .service {
    width: 48%;
  }
  .services {
    display:block;
  }

  .service--two, .service--four {
    margin-right: 0;
}
.service--two, .service--one{
  margin-bottom:20px;
}
    
    .review p {
        width: 100% !important;
    }
    
}


@media (max-width: 1100px) and (min-width: 762px) {
    
    .services > :nth-child(2n+1) {
        margin-left: 0;
    }

    .services > :nth-child(2n) {
        margin-right: 0;
    }

    .services > :last-child:nth-child(odd) {
        width: 100%;
    }
    
}

@media (max-width: 1215px) and (min-width: 762px) {
    
    .social-icons {
        width: 100%;
    }
    
}

@media screen and (max-width:761px) {
  .service {
    width: 100%;
    margin-bottom:20px;
    opacity:1;
  }
  #welcome-panel .column {
    width: 100%;
  }
  .referral{margin-top:0;}
    
    .column.review {
        text-align: center;
        margin-top: 12px;
    }
    
    .column.review a {
        width: 100%;
        box-sizing: border-box;
        margin-bottom: 14px;
    }
}