/* 
Widget: Sharelines
Version: 2.0.0
*/

li.q-sharelines {
    list-style: none;
}

li.q-sharelines ul {
    margin: 0;
}

li.q-sharelines li {
    
}

li.q-sharelines li.title {
    /*display: none;*/
}

li.q-sharelines li .icon {
    width: 44px;
    height: 44px;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    display: inline-block;
    cursor: pointer;
	-webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

li.q-sharelines li.item a.icon.greyscale {
	filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */
    filter: gray; /* IE6-9 */
    -webkit-filter: grayscale(100%); /* Chrome 19+, Safari 6+, Safari 6+ iOS */
	filter: grayscale(100%); /* catch-all for modern browsers ## */
	opacity: 0.5;
}

li.q-sharelines li .facebook-share-button.icon {
    background-image: url("../png/facebook.png");
}

li.q-sharelines li .twitter-share-button.icon {
    background-image: url("../png/twitter.png");
}

li.q-sharelines {
    margin: 0;
    padding: 0 !important;
}

li.q-sharelines .item {
    height: 44px;
    padding-left: 0;
    clear: both;
}

li.q-sharelines * {
    display: block;
    box-sizing: border-box;
}

li.q-sharelines > ul {
    width: 100%;
}

li.q-sharelines li .icon {
    display: block;
    float: left;
}

li.q-sharelines li {
    width: 100%;
    box-sizing: content-box;
    padding-bottom: 24px;
}

li.q-sharelines .text {
    border: 1px solid #cdcdcd;
    border-left: 0;
    border-right: 0;
    float: right;
    color: #6b6b6b;
    font: 200 16px/40px 'Webly', Helvetica, Arial, sans-serif;
    padding-left: 14px;
    box-sizing: border-box;
    height: 44px;
	overflow: hidden;
	position: relative;
	width: calc(100% - 88px);
}

li.q-sharelines .text .fade {
	position: absolute;
	right: 0;
	height: 44px;
	width: 44px;
	background: no-repeat 50% 50% url("../png/fade.png") transparent;
}
