@media screen and (max-width: 1025px) {
    nav ul.header-nav {
        display: none;
    }
}

.ph-logo,
.ph-nav {
    float: left
}

li,
ul {
    list-style: none;
    margin: 0
}

.clearfix {
    display: block
}
.placeholder-layar1,
.placeholder-layar1 * {
    box-sizing: border-box
}

.placeholder-layar1 {
    position: fixed;
    top: 0;
    left: 0;
    background: #fff;
    z-index: 999999;
    width: 100vw;
    height: 100vh
}

.ph-header {
    height: 96px;
    box-shadow: 0 2px 2px -1px #ccc
}

.ph-header-top {
    height: 41px
}

.ph-header-mainsec {
    height: 55px
}

.ph-animation {
    background: -webkit-linear-gradient(left, #eee 8%, #ddd 18%, #eee 33%);
    background: -o-linear-gradient(left, #eee 8%, #ddd 18%, #eee 33%);
    background: linear-gradient(to right, #eee 8%, #ddd 18%, #eee 33%);
    background-size: 1200px 350px;
    animation: 1s linear infinite forwards placeholder
}

@keyframes placeholder {
    0% {
        background-position: -468px 0
    }

    100% {
        background-position: 468px 0
    }
}

.ph-head-container {
    max-width: 1400px;
    margin: 0 auto
}

.ph-container {
    max-width: 1200px;
    margin: 0 auto
}

.ph-header-top .clearfix {
    float: right;
    padding: 10px 0
}

.ph-header-top .clearfix li {
    display: inline-block;
    margin: 0 3px
}

.top-content {
    padding: 10px 0 0;
    display: inline-block;
    width: 80px
}

.ph-sd-box {
    display: none
}

.ph-logo {
    width: 250px
}

.ph-logo .img-box {
    width: 220px;
    height: 45px
}

.ph-header-nav {
    margin-left: 100px;
    padding: 12px 0
}

.ph-header-nav li {
    margin: 0 5px;
    display: inline-block;
    float: left;
    width: 110px
}

.ph-header-nav li span {
    display: block;
    height: 18px;
    width: 100%
}

.ph-download-btn {
    float: right
}

.ph-download-btn span {
    width: 160px;
    height: 42px;
    display: block
}

.ph-brand-header {
    padding: 11vh 0;
    background: rgba(242, 241, 240, .23);
    border-bottom: 1px solid rgba(128, 128, 128, .11)
}

.ph-animation.hdr {
    height: 50px;
    width: 420px;
    border-radius: 3px
}

.content-box1,
.content-box2 {
    margin: 20px 0;
    width: 380px;
    height: 15px;
    max-width: 100%;
}

.content-box3 {
    width: 150px;
    height: 40px;
    margin: 30px 0 0;
    border-radius: 3px;
    display: block !important;
}

.ph-default {
    display: flex;
    align-items: center;
    justify-content: center
}

.anim-rightbox {
    width: 50%;
    display: inline-block;
    vertical-align: middle;
    text-align: left
}

.img-ph {
    width: 440px;
    height: 440px;
    display: block;
    margin: 0 auto;
    border-radius: 100%;
}

.ph-lighter {
    padding: 40px
}

.bottom-content1 {
    width: 800px;
    height: 12px;
    margin: 0 auto
}

.bottom-content2 {
    width: 700px;
    height: 12px;
    margin: 12px auto
}

.bottom-content3 {
    width: 450px;
    height: 12px;
    margin: 12px auto
}

@media only screen and (max-width:1450px) {
    .ph-head-container {
        max-width: 98%
    }
}

@media only screen and (min-width:1200px) and (max-height:800px) {
    .ph-brand-header {
        padding: 8vh 0
    }

    .img-ph {
        width: 380px;
        height: 380px
    }
}

@media only screen and (max-width:1200px) {
    .ph-container {
        max-width: 90%
    }
}

@media only screen and (max-width:1025px) {
    .itsm-solutions ul li.video p span br {
        display: none;
    }

    .ph-download-btn,
    .ph-header-top,
    .ph-nav {
        display: none !important;
    }

    .ph-default,
    .ph-sd-box {
        display: block
    }

    .ph-header,
    .ph-header-mainsec {
        height: 78px
    }

    .ph-logo {
        margin-top: 18px
    }

    .ph-sd-box {
        float: right;
        margin: 18px 15px
    }

    .line1,
    .line2,
    .line3 {
        height: 5px;
        margin-top: 7px;
        width: 30px
    }

    .anim-rightbox {
        width: 100%
    }

    .ph-brand-header {
        padding: 5vh 0
    }

    .anim-rightbox * {
        margin-left: auto;
        margin-right: auto
    }

    .img-ph {
        max-width: 90%;
        width: 350px;
        height: 350px;
        margin-top: 50px
    }
}

@media only screen and (max-width:600px) {
    .ph-animation.hdr {
        height: 60px;
        margin-bottom: 40px;
        width: 90%;
    }

    .img-ph {
        width: 90%;
        height: 300px;
        margin-top: 18px
    }

    .bottom-content1,
    .bottom-content2,
    .bottom-content3 {
        height: 18px;
        max-width: 100%;
    }
}