.socright {
  float: right;
  width: 60px;
  height: 370px;
}

.socright ul {
  padding: 0;
  margin: 0;
  list-style: none;
}

.socright ul li a {
  display: block;
  height: 40px;
  color: #575754;
  font-size: 10px;
  text-decoration: none;
  position: relative;
  cursor: pointer;
}

.socright ul li:first-child a {
  border: 0;
}

.socright ul li {  padding: 0 10px; }



.no-svg .socright ul li a i {
  background-image: url(/images/allicons.png);
}

.socright ul li a.soc1:active:before,
.socright ul li a.soc1:hover:before,
.socright ul li a.soc2:active:before,
.socright ul li a.soc2:hover:before,
.socright ul li a.soc3:active:before,
.socright ul li a.soc3:hover:before,
.socright ul li a.soc4:active:before,
.socright ul li a.soc4:hover:before,
.socright ul li a.soc5:active:before,
.socright ul li a.soc5:hover:before,
.socright ul li a.soc6:active:before,
.socright ul li a.soc6:hover:before,
.socright ul li a.soc7:active:before,
.socright ul li a.soc7:hover:before,
.socright ul li a.soc8:active:before,
.socright ul li a.soc8:hover:before,
.socright ul li a.soc9:active:before,
.socright ul li a.soc9:hover:before {
  opacity: 0;
}

.socright ul li a.soc1:active:after,
.socright ul li a.soc1:hover:after,
.socright ul li a.soc2:active:after,
.socright ul li a.soc2:hover:after,
.socright ul li a.soc3:active:after,
.socright ul li a.soc3:hover:after,
.socright ul li a.soc4:active:after,
.socright ul li a.soc4:hover:after,
.socright ul li a.soc5:active:after,
.socright ul li a.soc5:hover:after,
.socright ul li a.soc6:active:after,
.socright ul li a.soc6:hover:after,
.socright ul li a.soc7:active:after,
.socright ul li a.soc7:hover:after,
.socright ul li a.soc8:active:after,
.socright ul li a.soc8:hover:after,
.socright ul li a.soc9:active:after,
.socright ul li a.soc9:hover:after {
  opacity: 1;
}



.socright ul li a.soc1 i:before  {
  background-position: 0px 0px;
  opacity: 1;
  content: "";
  background-image: url(/images/allicons.svg);
  background-repeat: no-repeat;
  display: block;
  width: 18px;
  height: 18px;
  position: absolute;   
  top: 10px; 
  left: 10px;
  -webkit-transition: opacity 0.25s ease;
  -moz-transition: opacity 0.25s ease;
  -o-transition: opacity 0.25s ease;
  transition: opacity 0.25s ease;
}

.socright ul li a.soc1:after {
  background-position: 0px -23px;
  background-image: url(/images/allicons.svg); 
  opacity: 0;
  content: "";background-repeat: no-repeat;
  display: block;
  width: 18px;
  height: 18px;
  position: absolute; 
  top: 10px; 
  left: 10px;
 -webkit-transition: opacity 0.25s ease;
  -moz-transition: opacity 0.25s ease;
  -o-transition: opacity 0.25s ease;
  transition: opacity 0.25s ease;
}



.socright ul li a.soc2 i:before  {
  background-position: -23px 0px;
  opacity: 1;
  content: "";
  background-image: url(/images/allicons.svg);
  background-repeat: no-repeat;
  display: block;
  width: 18px;
  height: 18px;
  position: absolute;   
  top: 12px;  
  left: 11px;
  -webkit-transition: opacity 0.25s ease;
  -moz-transition: opacity 0.25s ease;
  -o-transition: opacity 0.25s ease;
  transition: opacity 0.25s ease;
}

.socright ul li a.soc2:after {
  background-position: -23px -23px;
  background-image: url(/images/allicons.svg); 
  opacity: 0;
  content: "";
  background-repeat: no-repeat;
  display: block;
  width: 18px;
  height: 18px;
  position: absolute; 
  top: 12px;  
  left: 11px;
 -webkit-transition: opacity 0.25s ease;
  -moz-transition: opacity 0.25s ease;
  -o-transition: opacity 0.25s ease;
  transition: opacity 0.25s ease;
}


.socright ul li a.soc3 i:before  {
  background-position: -46px 0px;
  opacity: 1;
  content: "";
  background-image: url(/images/allicons.svg);
  background-repeat: no-repeat;
  display: block;
  width: 18px;
  height: 18px;
  position: absolute;   
  top: 11px; 
  left: 10px;
  -webkit-transition: opacity 0.25s ease;
  -moz-transition: opacity 0.25s ease;
  -o-transition: opacity 0.25s ease;
  transition: opacity 0.25s ease;
}

.socright ul li a.soc3:after {
  background-position: -46px -23px;
  background-image: url(/images/allicons.svg); 
  opacity: 0;
  content: "";background-repeat: no-repeat;
  display: block;
  width: 18px;
  height: 18px;
  position: absolute; 
  top: 11px; 
  left: 10px;
 -webkit-transition: opacity 0.25s ease;
  -moz-transition: opacity 0.25s ease;
  -o-transition: opacity 0.25s ease;
  transition: opacity 0.25s ease;
}


.socright ul li a.soc4 i:before  {
  background-position: -92px 0px;
  opacity: 1;
  content: "";
  background-image: url(/images/allicons.svg);
  background-repeat: no-repeat;
  display: block;
  width: 18px;
  height: 18px;
  position: absolute;   
  top: 11px; 
  left: 10px;
  -webkit-transition: opacity 0.25s ease;
  -moz-transition: opacity 0.25s ease;
  -o-transition: opacity 0.25s ease;
  transition: opacity 0.25s ease;
}

.socright ul li a.soc4:after {
  background-position: -92px -23px;
  background-image: url(/images/allicons.svg); 
  opacity: 0;
  content: "";background-repeat: no-repeat;
  display: block;
  width: 18px;
  height: 18px;
  position: absolute; 
  top: 11px; 
  left: 10px;
 -webkit-transition: opacity 0.25s ease;
  -moz-transition: opacity 0.25s ease;
  -o-transition: opacity 0.25s ease;
  transition: opacity 0.25s ease;
}


.socright ul li a.soc5 i:before  {
  background-position: -160px 0px;
  opacity: 1;
  content: "";
  background-image: url(/images/allicons.svg);
  background-repeat: no-repeat;
  display: block;
  width: 18px;
  height: 18px;
  position: absolute;   
  top: 11px; 
  left: 10px;
  -webkit-transition: opacity 0.25s ease;
  -moz-transition: opacity 0.25s ease;
  -o-transition: opacity 0.25s ease;
  transition: opacity 0.25s ease;
}

.socright ul li a.soc5:after {
  background-position: -160px -23px;
  background-image: url(/images/allicons.svg); 
  opacity: 0;
  content: "";background-repeat: no-repeat;
  display: block;
  width: 18px;
  height: 18px;
  position: absolute; 
  top: 11px; 
  left: 10px;
 -webkit-transition: opacity 0.25s ease;
  -moz-transition: opacity 0.25s ease;
  -o-transition: opacity 0.25s ease;
  transition: opacity 0.25s ease;
}


.socright ul li a.soc6 i:before  {
  background-position: -137px 0px;
  opacity: 1;
  content: "";
  background-image: url(/images/allicons.svg);
  background-repeat: no-repeat;
  display: block;
  width: 18px;
  height: 18px;
  position: absolute;   
  top: 11px; 
  left: 10px;
  -webkit-transition: opacity 0.25s ease;
  -moz-transition: opacity 0.25s ease;
  -o-transition: opacity 0.25s ease;
  transition: opacity 0.25s ease;
}

.socright ul li a.soc6:after {
  background-position: -137px -23px;
  background-image: url(/images/allicons.svg); 
  opacity: 0;
  content: "";background-repeat: no-repeat;
  display: block;
  width: 18px;
  height: 18px;
  position: absolute; 
  top: 11px; 
  left: 10px;
 -webkit-transition: opacity 0.25s ease;
  -moz-transition: opacity 0.25s ease;
  -o-transition: opacity 0.25s ease;
  transition: opacity 0.25s ease;
}

.socright ul li a.soc7 i:before  {
  background-position: -115px 0px;
  opacity: 1;
  content: "";
  background-image: url(/images/allicons.svg);
  background-repeat: no-repeat;
  display: block;
  width: 18px;
  height: 18px;
  position: absolute;   
  top: 11px; 
  left: 10px;
  -webkit-transition: opacity 0.25s ease;
  -moz-transition: opacity 0.25s ease;
  -o-transition: opacity 0.25s ease;
  transition: opacity 0.25s ease;
}

.socright ul li a.soc7:after {
  background-position: -115px -23px;
  background-image: url(/images/allicons.svg); 
  opacity: 0;
  content: "";background-repeat: no-repeat;
  display: block;
  width: 18px;
  height: 18px;
  position: absolute; 
  top: 11px; 
  left: 10px;
 -webkit-transition: opacity 0.25s ease;
  -moz-transition: opacity 0.25s ease;
  -o-transition: opacity 0.25s ease;
  transition: opacity 0.25s ease;
}


.socright ul li a.soc9 i:before  {
  background-position: -183px 0px;
  opacity: 1;
  content: "";
  background-image: url(/images/allicons.svg);
  background-repeat: no-repeat;
  display: block;
  width: 18px;
  height: 18px;
  position: absolute;   
  top: 11px; 
  left: 10px;
  -webkit-transition: opacity 0.25s ease;
  -moz-transition: opacity 0.25s ease;
  -o-transition: opacity 0.25s ease;
  transition: opacity 0.25s ease;
}

.socright ul li a.soc9:after {
  background-position: -183px -23px;
  background-image: url(/images/allicons.svg); 
  opacity: 0;
  content: "";background-repeat: no-repeat;
  display: block;
  width: 18px;
  height: 18px;
  position: absolute; 
  top: 11px; 
  left: 10px;
 -webkit-transition: opacity 0.25s ease;
  -moz-transition: opacity 0.25s ease;
  -o-transition: opacity 0.25s ease;
  transition: opacity 0.25s ease;
}



.socbottom ul {
  float: left;
  padding: 17px 0 0 0;
  margin: 0;
  list-style: none;
  height: 23px;
}

.socbottom ul li {
  float: left;
  margin-right: 20px;
  width: 18px;
  height: 18px;
  display: block;
}

.socbottom ul li a {
  display: block;
  width: 18px;
  height: 18px;
  position: relative;
}

.socbottom ul li a:before,
.socbottom ul li a:after {
  background:url(/images/allicons.svg) no-repeat;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 18px;
  height: 18px;
  -moz-transition: all 600ms cubic-bezier(0.86, 0, 0.07, 1);
  -o-transition: all 600ms cubic-bezier(0.86, 0, 0.07, 1);
  -webkit-transition: all 600ms cubic-bezier(0.86, 0, 0.07, 1);
  transition: all 600ms cubic-bezier(0.86, 0, 0.07, 1);
}

.socbottom ul li a:before,
.socbottom ul li a:active:after,
.socbottom ul li a:hover:after {
  opacity: 1;
}

.socbottom ul li a:after,
.socbottom ul li a:active:before,
.socbottom ul li a:hover:before {
  opacity: 0;
}

.socbottom ul li a.soc1:before {  background-position: 0 0;  }
.socbottom ul li a.soc1:after  {  background-position: 0 -23px;  }

.socbottom ul li a.soc2:before {  background-position: -23px 0;  }
.socbottom ul li a.soc2:after  {  background-position: -23px -23px;  }

.socbottom ul li a.soc3:before {  background-position: -46px 0;  }
.socbottom ul li a.soc3:after  {  background-position: -46px -23px;  }

.socbottom ul li a.soc4:before {  background-position: -92px 0;  }
.socbottom ul li a.soc4:after  {  background-position: -92px -23px;  }

.socbottom ul li a.soc5:before {  background-position: -160px 0;  }
.socbottom ul li a.soc5:after  {  background-position: -160px -23px;  }

.socbottom ul li a.soc6:before {  background-position: -137px 0;  }
.socbottom ul li a.soc6:after  {  background-position: -137px -23px;  }

.socbottom ul li a.soc7:before {  background-position: -115px 0;  }
.socbottom ul li a.soc7:after  {  background-position: -115px -23px;  }