/* Share */

.cp-share {
    position : fixed;
    z-index: 9999;
    top : 50%;
    padding : 10px;
    transform : translateY(-50%);
    animation-duration : 1s;
    animation-iteration-count : 1;
    border-radius : 4px;
    background : #eee;
}

.cp-share.left {
    left : 10px;
    animation-name : cpshareleft;
}

@keyframes cpshareleft {
    0% {
        left : -50%;
    }
    100% {
        left : 10px;
    }
}

.cp-share.right {
    right : 10px;
    animation-name : cpshareright;
}

@keyframes cpshareright {
    0% {
        right : -50%;
    }
    100% {
        right : 10px;
    }
}

.cp-share > a {
    display : block;
    margin-bottom : 5px;
}

.cp-share > a > i {
    color: #fff;
    background: #333;
    height: 38px;
    width: 38px;
    line-height: 40px;
    text-align: center;
    font-size: 18px;
    border-radius: 100%;   
}

.cp-share > a:hover > i {
    animation : cpshareicons 2s infinite;
}

@keyframes cpshareicons {
    0% {
        box-shadow : 0 0 0 2px inset;
    }
    50% {
        box-shadow : 0 0 0 1px inset;
    }
    90% {
        box-shadow : 0 0 0 4px inset;
    }
    100% {
        box-shadow : 0 0 0 1px inset;
    }
}

.cp-share > a:last-child {
    margin-bottom : 0;
}

.cp-share > a > i.fa-facebook {
    background: #0D6DAB;
}

.cp-share > a > i.fa-twitter {
    background: #14B2C8;
}

.cp-share > a > i.fa-youtube-play {
    background: #D62121;
}


/* Share Plus*/

.cp-share-plus {
    position : fixed;
    z-index: 9999;
    top : 50%;
    transform : translateY(-50%);
}

.cp-share-plus.left {
    left: 10px;
}

.cp-share-plus.left.items:target {
    left: 14px;
}

.cp-share-plus.left.items {
    left: -50%;
}

.cp-share-plus.right {
    right: 10px;
}

.cp-share-plus.right.items:target {
    right: 14px;
}

.cp-share-plus.right.items {
    right: -50%;
}

.cp-share-plus.trigger > a > img {
    max-width : 25px;
}

.cp-share-plus.trigger > a {
    display : block;
    padding : 20px;
    animation : cp-share-plus-trigger 2s cubic-bezier(.4, 0, .2, 1) infinite;
    border-radius : 100%;
    background : #14afc8;
}

@keyframes cp-share-plus-trigger {
    0% {
        transform : translateY(0px);
    }
    40% {
        transform : translateY(6px);
    }
}

.cp-share-plus.items > a {
    display : block;
    margin-top : 5px;
}

.cp-share-plus > a > i {
    color: #fff;
    background: #333;
    height: 38px;
    width: 38px;
    line-height: 40px;
    text-align: center;
    font-size: 18px;
    border-radius: 100%;   
}

.cp-share-plus > a:hover > i {
    animation : cpshareplusicons 2s infinite;
}

@keyframes cpshareplusicons {
    0% {
        box-shadow : 0 0 0 2px inset;
    }
    50% {
        box-shadow : 0 0 0 1px inset;
    }
    90% {
        box-shadow : 0 0 0 4px inset;
    }
    100% {
        box-shadow : 0 0 0 1px inset;
    }
}

.cp-share-plus > a:last-child {
    margin-bottom : 0;
}

.cp-share-plus > a > i.fa-facebook {
    background: #0D6DAB;
}

.cp-share-plus > a > i.fa-twitter {
    background: #14B2C8;
}

.cp-share-plus > a > i.fa-youtube-play {
    background: #D62121;
}

.cp-share-plus.items > a:first-child {
    margin-top : 0;
}

.cp-share-plus.items {
    margin-top : 140px;
    padding : 10px;
    transition : all .4s ease;
}

.cp-share-plus-close {
    padding : 10px;
    border-radius : 100%;
    background : #111111;
}

.cp-share-plus-close > img {
    display: block;
    margin: 2px auto;
    max-width: 15px !important;
}

.cp-share-plus-close:hover > img {
    animation : cp-share-plus-close 4s infinite;
}

@keyframes cp-share-plus-close {
    0% {
        transform : rotate(0deg);
    }
    40% {
        transform : rotate(180deg);
    }
    50% {
        transform : rotate(0deg);
    }
    100% {
        transform : rotate(360deg);
    }
}