.container-bar{
	width: 100%;
	max-width: 55px;
	position: fixed;
	left: 0;
	top: 25%;
}

.container-bar a{
	display: block;
	padding: 15px;
	text-decoration: none;
	font-size: 17px;
	position: relative;;
	transition: all 500ms ease;
	color: #fff;
}

.container-bar a:hover{
	background: #1c1c1c;
}

.container-bar .icon-linkedin2{
	background: #0a66c2;
	border-radius: 0px 5px 0px 0px;
}
.container-bar .icon-facebook{
	background: #3b5998;
}
.container-bar .icon-twitter{
	background: #00abf0;
}
.container-bar .icon-youtube{
	background: #ff0000;
}
.container-bar .icon-instagram{
	
	background: #f09433; 
	background: -moz-linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%); 
	background: -webkit-linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%); 
	background: linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%); 
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f09433', endColorstr='#bc1888',GradientType=1 );
  
	border-radius: 0px 0px 5px 0px;
}

.container-bar .icon-pinterest{
	background: #ae181f;
}

.container-bar #title{
	position: fixed;
	background: #1c1c1c;
	padding: 6px;
	border-radius: 3px;
	font-size: 15px;
	margin-top: -4px;
	transition: all 500ms ease;
	opacity: 0;
	visibility: hidden;
}

.container-bar a:hover #title{
	opacity: 1;
	visibility: visible;
	margin-left: 30px;
}

.container-bar input:hover #title{
	opacity: 1;
	visibility: visible;
	margin-left: 30px;
}

.container-bar #title:after{
	position: absolute;
	content: '';
	border-left: 7px solid transparent;
	border-right: 6px solid #1c1c1c;
	border-top: 7px solid transparent;
	border-bottom: 7px solid transparent;
	right: 100%;
	top: 8px;
}

#btn-social{
	display: none;
}

.icon-play3{
	cursor: pointer;
	transition: all 0.4s;
	font-size: 12px;
	margin-bottom: 5px;
	display: inline-block;
	transform: rotate(180deg);
}

#btn-social:checked ~.icon-play3{
	transform: rotate(0deg);
}

.icon-social{
	transition: all 0.4s;
	transform: translateX(0%);
	box-shadow: 0px 1px 10px rgb(0,0,0,0.9);
}

#btn-social:checked ~ .icon-social{
	transform: translateX(-100%);
}

@media (max-width: 767px) {
    .container-bar{
		display: none;
	}
}