.fixed-bar {
    position: fixed;
    right: 10px;
    top: 48%;
    width: 50px;
    z-index: 9
}

@media (max-width:1200px) {
    .fixed-bar {
        display: none
    }
}

.fixed-bar li {
    width: 50px;
    height: 50px;
    background-color: #384347;
    margin-bottom: 3px;
    border-radius: 3px;
    cursor: pointer;
    -webkit-transition: .3s;
    transition: .3s
}

.fixed-bar .mail p {
    right: 0;
    padding-left: 50px;
    position: relative;
    height: 50px;
    line-height: 50px;
    width: 0;
    background: url('../png/f-mail.png') no-repeat 12px center;
    overflow: hidden;
    color: #fff;
    font-size: 14px
}

.fixed-bar .mail p a {
    color: #fff
}

.fixed-bar .wapp {
    background: #384347 url('../png/f-whatapp.png') no-repeat center
}

.fixed-bar .wapp a {
    width: 50px;
    height: 50px;
    display: block
}

.fixed-bar .wapp:hover {
    background: #9d1904 url('../png/f-whatapp.png') no-repeat center
}

.fixed-bar .skype {
    background: #384347 url('../png/skype.png') no-repeat center
}

.fixed-bar .skype a {
    width: 50px;
    height: 50px;
    display: block
}

.fixed-bar .skype:hover {
    background: #9d1904 url('../png/skype.png') no-repeat center
}

.fixed-bar .mail p a {
    color: #fff
}

.fixed-bar li:hover p {
    left: -205px;
    width: 228px;
    background-color: #9d1904
}

.fixed-bar .mail:hover {
    background-color: #9d1904
}

.fixed-bar .fixed-facebook {
    background: #9d1904 url('../png/ico-facebook.png') no-repeat center
}

.fixed-bar .fixed-facebook a {
    width: 50px;
    height: 50px;
    display: block
}

.fixed-bar .fixed-facebook:hover {
    background: #9d1904 url('../png/ico-facebook.png') no-repeat center
}