/* For mobile phones: */
 /* [class*="col-"] {
    width: 100%;
  } */
  .join1 {
    position: relative;
  top: -500px;
  right: -82px;
  color: #fff;
  background: #CE4DD5;
  width: 160px;
  padding: 15px 15px;
  font-family: ZCOOL XiaoWei !important;
}
.pt1-75{
    padding-top: 5px;
}
.pb1-75{
    padding-bottom: 5px;
}

.join2 {
    position: relative;
    top: -70px;
    right: 0px;
    color: #fff;
    background: #CE4DD5;
    width: 120px;
    padding: 10px 10px;
}
.joinca {
    position: relative;
    top: -480px;
right: -150px;
    color: #fff;
    background: #CE4DD5;
    width: 130px;
    padding: 15px 15px;
    font-family: ZCOOL XiaoWei !important;
}

.breadcumb-area {
    background: linear-gradient(rgba(0, 0, 0, 0.5),rgba(0,0,0,0.5)), url(assets/images/about/abtt.jpg) no-repeat center/cover;
    height: 20px;
    position: relative;
}

.breadcumb-area1 {
    background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(assets/images/about/o1.jpg) no-repeat center/cover;
    height: 520px;
    position: relative;
}

.breadcumb-skill {
    background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(assets/images/about/project.jpg) no-repeat center/cover;
    height: 160px;
    position: relative;
}
.fam{
    width: 210px;
    color: #E153E9;
    position: relative;
    top: -280px;
    right: -20px;
}

.fam h6{
    color:#E153E9 ;
    font-size: 12px;
    line-height: 1.5;
}


  
  @media only screen and (min-width: 600px) {
    /* For tablets: */

    .join1 {
        position: relative;
        top: -750px;
        right: -180px;
        color: #fff;
        background: #CE4DD5;
        width: 130px;
        padding: 15px 15px;
        font-family: ZCOOL XiaoWei !important;
    }

    .joinca {
        position: relative;
        top: -480px;
    right: -150px;
        color: #fff;
        background: #CE4DD5;
        width: 130px;
        padding: 15px 15px;
        font-family: ZCOOL XiaoWei !important;
    }

    .join2 {
        position: relative;
        top: -590px;
        right: -220px;
        color: #fff;
        background: #CE4DD5;
        width: 100px;
        padding: 15px 15px;
    }
    .fam{
        width: 300px;
        color: #E153E9;
        position: relative;
        top: -300px;
        right: -50px;
    }

    .fam h6{
        color:#E153E9 ;
        line-height: 1.5;
    }

    
 
  }
  
  @media only screen and (min-width: 768px) {
    /* For desktop: */

    .join1 {
        position: relative;
        top: -790px;
        right: -210px;
        color: #fff;
        background: #CE4DD5;
        width: 180px;
        padding: 15px 15px;
        font-family: ZCOOL XiaoWei !important;
    }
    .pt1-75{
        padding-top: 75px;
    }
    .pb1-75{
        padding-bottom: 75px;
    }

    .join2 {
        position: relative;
        top: -100px;
        right: 0px;
        color: #fff;
        background: #CE4DD5;
        width: 120px;
        padding: 10px 15px;
    }

    .breadcumb-area {
        background: linear-gradient(rgba(0, 0, 0, 0.5),rgba(0,0,0,0.5)), url(assets/images/about/abtt.jpg) no-repeat center/cover;
        height: 320px;
        position: relative;
    }

    .breadcumb-skill {
        background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(assets/images/about/project.jpg) no-repeat center/cover;
        height: 500px;
        position: relative;
    }
    .fam{
        width: 300px;
        color: #E153E9;
        position: relative;
        top: -400px;
        right: -50px;
    }

    .fam h6{
        color:#E153E9 ;
        line-height: 1.5;
    }

    

    

    
  }