.zoom {
    transition: transform .5s; /* Animation */
    /*width: 200px;
    height: 200px;*/
    margin: 0 auto;
  }

  .zoom:hover {
    transform: scale(1.5); /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
  }


/* style navbar menu frontend*/
.link-yellow {
  font-weight:bold;
  
}

.link-yellow-li {
  background-color:#F2A007;
  color:#fff;
  font-weight:bold;
}

.link-yellow-header {
  background-color: #F2A007; 
  padding:0px 15px 0px 15px; 
  font-weight:bold;"
}
.link-yellow-header a:hover {
  color:#fff;
  padding:0px 15px 0px 15px;
}
.link-yellow-header:hover {
  background-color: #B2002D;
}


/*.link-yellow:focus {
  background-color:#F24C26;
}*/
/* end */


 @media screen and (min-width: 980px) {

  .icon-bar {
    position: fixed;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
  }

}

/* Style the icon bar links */
.icon-bar a {
  display: block;
  text-align: center;
 /* padding: 16px;*/
  transition: all 0.3s ease;
  color: white;
  font-size: 10px;
}

/* Style the social media icons with color, if you want */
.icon-bar a:hover { background-color: #000; }
.facebook { background: #3B5998; color: white; }
.twitter { background: #55ACEE; color: white; }
.google { background: #dd4b39; color: white; }
.linkedin { background: #007bb5; color: white; }
.youtube { background: #bb0000; color: white; }

.btn-sosmed-x {
  clear:both;
  white-space:nowrap;
  font-size:.8em;
  display:inline-block;
  border-radius:5px;
  box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.35);
  margin:2px;
  -webkit-transition:all .5s;
  -moz-transition:all .5s;
  transition:all .5s;
  overflow:hidden
}

.btn-sosmed-x:hover {
  /*box-shadow: 0 5px 15px 0 rgba(0, 0, 0, 0.45);*/
}

.btn-sosmed-x:focus {
  /*box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.4);*/
}

.btn-sosmed-x > span,.btn-icon > i {
  float:left;
  padding:13px;
  -webkit-transition:all .5s;
  -moz-transition:all .5s;
  transition:all .5s;
  line-height:1em
}

.btn-sosmed-x > span {
  padding:14px 18px 16px;
  white-space:nowrap;
  color:#FFF;
  /*background:#b8b8b8;*/
}

.btn-sosmed-x:focus > span {
 /*background:#9a9a9a;*/
}




/* sosial media share */
  #social-platforms {
    position:relative;
    top:100px;
    top:25vh;
    font-size:1rem;
    text-align:center;
    height:250px;
    overflow:hidden;
  }

  .btn-sosmed {
    clear:both;
    white-space:nowrap;
    font-size:.8em;
    display:inline-block;
    border-radius:5px;
    box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.35);
    margin:2px;
    -webkit-transition:all .5s;
    -moz-transition:all .5s;
    transition:all .5s;
    overflow:hidden
  }

  .btn-sosmed:hover { box-shadow: 0 5px 15px 0 rgba(0, 0, 0, 0.45); }
  .btn-sosmed:focus { box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.4); }

  .btn-sosmed > span,.btn-icon > i {
    float:left;
    padding:13px;
    -webkit-transition:all .5s;
    -moz-transition:all .5s;
    transition:all .5s;
    line-height:1em
  }

  .btn-sosmed > span {
    padding:14px 18px 16px;
    white-space:nowrap;
    color:#FFF;
    background:#b8b8b8
  }

  .btn-sosmed:focus > span { background:#9a9a9a; }

  .btn-icon > i {
    border-radius:5px 0 0 5px;
    position:relative;
    width:13px;
    text-align:center;
    font-size:1.25em;
    color:#fff;
    background:#212121
  }

  .btn-icon > i:after {
    content:"";
    border:8px solid;
    border-color:transparent transparent transparent #222;
    position:absolute;
    top:13px;
    right:-15px
  }

  .btn-icon:hover > i,.btn-icon:focus > i { color:#FFF; }
  .btn-icon > span { border-radius:0 5px 5px 0 }

  /*Facebook*/
  .btn-facebook:hover > i,.btn-facebook:focus > i { color:#3b5998; }
  .btn-facebook > span { background:#3b5998; }

  /*Twitter*/
  .btn-twitter:hover > i,.btn-twitter:focus > i { color:#55acee; }
  .btn-twitter > span { background:#55acee; }

  /*Google*/
  .btn-googleplus:hover > i,.btn-googleplus:focus > i { color:#dd4b39; }
  .btn-googleplus > span { background:#dd4b39; }

  /*Pinterest*/
  .btn-pinterest:hover > i,.btn-pinterest:focus > i { color:#cb2028; }
  .btn-pinterest > span { background:#cb2028; }

  /*LinkedIn*/
  .btn-linkedin:hover > i,.btn-linkedin:focus > i { color:#007bb6; }
  .btn-linkedin > span { background:#007bb6; }

  /*youtube*/
  .btn-youtube:hover > i,.btn-youtube:focus > i { color:#bb0000; }
  .btn-youtube > span { background:#bb0000; }

  /*instagram*/
  .btn-instagram:hover > i,.btn-instagram:focus > i { background: #dc2743; }
  .btn-instagram > span { background: #dc2743; }

  /*instagram*/
  .btn-instagram-x:hover > i,.btn-instagram-x:focus > i {
    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 );
  }

  .btn-instagram-x > span {
    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 );
  }
/* end */