.box-home {
    width: 700px;
    max-width: 100%;
    margin: 0 auto;
    padding: 30px 0 20px 0;
    position: relative;
}
.row-home {
    display: table;
    width: 100%;
}
.col-home {
    display: block;
    float: left;
    width: 50%;
    text-align: right;
    padding: 5px;
}
.home-link {
    display: block;
    position:  relative;
}
.home-link > img {
    max-width: 100%;
}
.image-1b {
    position:  absolute;
    top: 0;
    width:  100%;
    right: -2px;
    opacity:  0;
    -webkit-transition: all ease 0.3s;
    -moz-transition: all ease 0.3s;
    -o-transition: all ease 0.3s;
    -ms-transition: all ease 0.3s;
    transition: all ease 0.3s;
}
.link1:hover > .image-1b,.link1:focus > .image-1b {
    opacity:  1;
}
.image-2b {
    position:  absolute;
    top: 0;
    width:  100%;
    left: -1px;
    opacity:  0;
    -webkit-transition: all ease 0.3s;
    -moz-transition: all ease 0.3s;
    -o-transition: all ease 0.3s;
    -ms-transition: all ease 0.3s;
    transition: all ease 0.3s;
}
.link2:hover > .image-2b,.link2:focus > .image-2b {
    opacity:  1;
}
.image-4b {
    position:  absolute;
    top: 0;
    width:  100%;
    left: -1px;
    opacity:  0;
    -webkit-transition: all ease 0.3s;
    -moz-transition: all ease 0.3s;
    -o-transition: all ease 0.3s;
    -ms-transition: all ease 0.3s;
    transition: all ease 0.3s;
}
.link4:hover > .image-4b,.link4:focus > .image-4b {
    opacity:  1;
}
.home-logo {
    position:  absolute;
    top: 38%;
    left: 0;
    width: 100%;
    text-align:  center;
}
.circle-logo {
    display: table;
    margin: 0 auto;
    width: 190px;
    height: 190px;
    background: radial-gradient(ellipse at center, #ffffff 0%,#cccccc 100%);
    border-radius:  100%;
    padding: 30px;
}
.circle-logo > a {
    display: table-cell;
    vertical-align: middle;
}
.logo-center {
    max-width:  100%;
}
.bg-home {
    background-size: 80px;
    background-repeat: repeat;
    background-position:  center;
}
.content-home {
    background-color: #FFFFFF;
}
.home-sosmed {
    padding: 0 15px 40px 15px;
    text-align: center;
}
.home-sosmed > a {
    padding: 0 10px;
}
.home-sosmed > a > img {
    width: 40px;
}
.top-footer {
    background: linear-gradient(to top, #e0e0e0, white);
}
.footer-content {
    padding: 15px 15px;
    color: #737373;
    font-size: 12px;
    text-align: center;
}
.top-footer > .container {
    width: 1300px;
    max-width: 100%;
}
.footer-copyright {
    background-color:  #A8A9AD;
    text-align: center;
    padding: 10px 15px;
    color: #FFFFFF;
    font-size: 12px;
}
.mobile-logo {
    text-align: center;
    background-color: #FFFFFF;
    background: linear-gradient(to bottom, #f3f3f3, white);
    padding: 20px 15px;
}
.mobile-logo > a > img {
    width: 140px;
}
.mobile-link {
    display: block;
    margin-bottom:  30px;
    position:  relative;
}
.mobile-list {
    padding: 30px 15px;
}
.mobile-link > img {
    max-width: 100%;
}
.image-m1b {
    position:  absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 2;
    opacity:  0;
    -webkit-transition: all ease 0.3s;
    -moz-transition: all ease 0.3s;
    -o-transition: all ease 0.3s;
    -ms-transition: all ease 0.3s;
    transition: all ease 0.3s;
}
.mlink1:hover > .image-m1b,.mlink1:focus > .image-m1b,.mlink1:active > .image-m1b {
    opacity:  1;
}
.image-m4b {
    position:  absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 2;
    opacity:  0;
    -webkit-transition: all ease 0.3s;
    -moz-transition: all ease 0.3s;
    -o-transition: all ease 0.3s;
    -ms-transition: all ease 0.3s;
    transition: all ease 0.3s;
}
.mlink4:hover > .image-m4b,.mlink4:focus > .image-m4b,.mlink4:active > .image-m4b {
    opacity:  1;
}
@media(max-width: 991px){
    .circle-logo {
        width: 200px;
        height: 200px;
    }
    .home-logo {
        top: 38%;
    }
}
@media(max-width: 767px){
    .home-sosmed > a {
        padding: 0 5px;
    }
    .home-sosmed > a > img {
        width: 30px;
    }
    .home-sosmed {
        padding: 0 15px 30px 15px;
    }
    .mobile-list {
        padding: 30px 15px 0 15px;
    }
    .footer-content {
        font-size: 11px;
    }
    .footer-copyright {
        font-size: 11px;
    }
}