/* styles for sharing on social media */


/* img with text*/
.bottom_separator {
	padding-bottom:10px
}

/*share block */
button.share_toggle {
	position: absolute;
	top: 10px;
	right:5px;
	background-color:transparent;
	border:none;
	color:#fff;z-index:100
}

div.share_ul_collapse {
	z-index: 90;
	background-color: #fff;
	border: 1px solid #000;
	position:relative;
	margin-top:-10px;
	margin-bottom:20px;
	width:100%
	
}

.share_ul li a {
		display: block;
  		padding: 5px 0px;
		border-bottom:none;
		line-height:30px
	}
	
.whatsapp {
 	width:22px;
 	margin-right:4px;
 	background:url('/system/modules/ch.ethz.sed.bootstrap.bedretto/resources/img/socials/whatsapp22x22.png') no-repeat 0px;;
	height:22px;
	display:inline-block
}

.icon-twitter {
  display: inline-block;
  width: 1.8rem;
  height: 1.8rem;
  vertical-align: middle;
  content: "";
  background: 0% 50% no-repeat;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' viewBox='0 0 16 16'%3e%3cpath d='M12.6.75h2.454l-5.36 6.142L16 15.25h-4.937l-3.867-5.07-4.425 5.07H.316l5.733-6.57L0 .75h5.063l3.495 4.633L12.601.75Zm-.86 13.028h1.36L4.323 2.145H2.865l8.875 11.633Z' /%3e%3c/svg%3e");
  background-size: 100%% 100%;
  margin-top:-4px
}

@media (max-width: 767px) {
	.share_ul .fa::before, .share_ul .fas::before, .share_ul .fab::before {
		padding-right:10px !important
	}
	
	.share_ul .fa-facebook {
		margin-right:5px
	}
}

@media (min-width: 768px) {
	.share_ul li {
		display:inline-block;
		padding-right:30px
	}

	.share_ul .fa::before, .share_ul .fas::before, .share_ul .fab::before {
		padding-right:5px !important
	}

	.share_ul .fa-facebook {
		margin-right:5px
	}

}

/*
@media (min-width: 768px) {
	div.share_ul_collapse {
		position: absolute;
		right: 0px;
		z-index: 90;
		background-color: #fff;
		border: 1px solid #000;
		top:230px
	}
}


@media (min-width: 768px) and (max-width:991px){
	div.share_ul_collapse{
		width: 100%;
	}
}



@media (min-width: 992px) and (max-width: 1200px) {

  div.share_ul_collapse {
    width: 330px;
	right:15px;
  }
  
  button.share_toggle {
  	right:0px
  }
  
}


@media (min-width: 1201px) {

   div.share_ul_collapse {
    width: 350px;
	right:15px
  }
  
  button.share_toggle {
  	right:15px
  }
  
}
*/
ul.share_ul {
	list-style-type: none;
	margin: 0px !important;
	padding: 5px 20px 5px 30px;
	overflow: hidden;
}


.share_ul li a {
	display: block;
  	padding: 5px 0px;
	border-bottom:none;
	line-height:30px
}



.fa-share-alt-square::before {
    content: "\f1e1";
    color: #666 !important;
}

a.share_iwt {
	position: absolute;
	bottom: 2px !important;
	right: 10px;
	border-bottom: none;
}

a.share_iwt_float {
	float:right;
	border-bottom: none;
}