.resp-sharing-button__link,
.resp-sharing-button__icon {
  display: inline-block
}

.resp-sharing-button__link {
  text-decoration: none;
  color: #fff;
  margin: 0.5em;
  width: 45px;
  height: 45px;
}

.resp-sharing-button {
  border-radius: 100%;
  transition: 25ms ease-out;
  font-family: Helvetica Neue,Helvetica,Arial,sans-serif;
  height: 100%;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.resp-sharing-button__icon svg {
  width: 1em;
  height: 1em;
  vertical-align: top
}

.resp-sharing-button--small svg {
  margin: 0;
  vertical-align: middle
}

/* Non solid icons get a stroke */
.resp-sharing-button__icon {
  stroke: #fff;
  fill: none
}

/* Solid icons get a fill */
.resp-sharing-button__icon--solid,
.resp-sharing-button__icon--solidcircle {
  fill: #fff;
  stroke: none;
  display: flex;
  justify-content: center;
  align-items: center;
}

.resp-sharing-button--twitter {
  background-color:#E7F6FE;
  border-color: #E7F6FE;
}

.resp-sharing-button--twitter svg {
  fill: #1DA1F2;
}


.resp-sharing-button--twitter:hover {
  background-color: #2795e9
}

.resp-sharing-button--twitter:hover svg {
  fill: #fff;
}

.resp-sharing-button--pinterest {
  background-color: #bd081c
}

.resp-sharing-button--pinterest:hover {
  background-color: #8c0615
}


.resp-sharing-button--facebook:hover {
  background-color: #2d4373
}

.resp-sharing-button--facebook:hover svg {
  fill: #fff;
}

.resp-sharing-button--tumblr {
  background-color: #35465C
}

.resp-sharing-button--tumblr:hover {
  background-color: #222d3c
}

.resp-sharing-button--reddit {
  background-color: #5f99cf
}

.resp-sharing-button--reddit:hover {
  background-color: #3a80c1
}

.resp-sharing-button--google {
  background-color: #dd4b39
}

.resp-sharing-button--google:hover {
  background-color: #c23321
}

.resp-sharing-button--linkedin {
  background-color: #0077b5
}

.resp-sharing-button--linkedin:hover {
  background-color: #046293
}

.resp-sharing-button--email {
  background-color: #777
}

.resp-sharing-button--email:hover {
  background-color: #5e5e5e
}

.resp-sharing-button--xing {
  background-color: #1a7576
}

.resp-sharing-button--xing:hover {
  background-color: #114c4c
}

.resp-sharing-button--whatsapp {
  background-color: #25D366
}

.resp-sharing-button--whatsapp:hover {
  background-color: #1da851
}

.resp-sharing-button--hackernews {
background-color: #FF6600
}
.resp-sharing-button--hackernews:hover, .resp-sharing-button--hackernews:focus {   background-color: #FB6200 }

.resp-sharing-button--vk {
  background-color: #507299
}

.resp-sharing-button--vk:hover {
  background-color: #43648c
}

.resp-sharing-button--facebook {
  background-color:#E7F1FE;
  border-color: #E7F1FE;
}

.resp-sharing-button--facebook svg {
  fill: #1877F2;
}

.resp-sharing-button--facebook:hover,
.resp-sharing-button--facebook:active {
  background-color: #2d4373;
  border-color: #2d4373;
}


.resp-sharing-button--twitter:hover,
.resp-sharing-button--twitter:active {
  background-color: #2795e9;
  border-color: #2795e9;
}


.modal-wrap {
  display: none;
  background: rgba(15, 15, 17, 0.75);
  align-items: center;
  justify-content: center;
  position: fixed;
  left: 0px;
  top: 0px;
  right: 0px;
  bottom: 0px;
  z-index: 3;
  margin-left: 0 !important;
  margin-top: 0 !important;
}

#share-my-cart-modal {
  background: #fff;
  position: relative;
  padding: 0;
  max-width: 400px;
  width:80%;
  padding: 20px 30px;
}



.close-node {
  outline: 0;
  border: none;
  background-color: unset;
  position: absolute;
  right: 20px;
  top: 20px;
  font-size: 20px;
  font-weight: bold;
  line-height: 1;
  color: #000000;
  text-shadow: 0 1px 0 #ffffff;
  opacity: 0.2;
  text-decoration: none;
  cursor: pointer;
  padding: 0 5px;
}

.close-node:hover {
  background-color: unset;
  color: #000000;
  opacity: 0.5;
}

.modal-wrap .input {
  position: relative;
  text-align: left;
  width: 100%;
  color: #777;
  background-color: #fff;
  padding: 6px 12px;
  border-radius: 0;
  border: 1px solid #c4c4c4;
  line-height: 24px;
  text-decoration: none;
  display: inline-block;
  height: 41px;
  padding-right: 43px;
  max-width: 100%;
  box-sizing: border-box;
}

.input-cont {
  position: relative;
  margin-left: 0 !important;
}

.js-clipboard {
  background-image: url(../images/copy-regular.svg);
  background-repeat: no-repeat;
  display: inline-block;
  position: absolute;
  right: 5px;
  top: 10px;
  width: 20px;
  height: 20px;
  background-size: contain;
  margin-top: 0 !important;
}

.share-headline {
  margin-left: 0 !important;
  margin-top: 0;
  margin-bottom: 15px;
}

.share-my-cart-sns-container {
  margin-left: -10px !important;
  margin-bottom: 20px;
  display: flex;
  flex-wrap: wrap;
}

.share-my-cart-sns-container > div {
  margin: 0 !important;
}

.user-email-icon a {
  background-size: 17px;
  height: 45px;
  width: 45px;
  display: inline-block;
  margin: 0.5em;
  background-position: center center;
  border-radius: 100%;
  background-color: #FFECE6;
}

.user-email-icon a:hover {
  background-color: #ff6e42 !important;
}

.share-my-cart-sns-container > a {
  width: 45px;
  height: 45px;
  box-sizing: border-box;
}

.share-my-cart-sns-container > div a:hover {
  background-color: unset;
}

.link-cont {
  margin-left: 0 !important;
}

.link-cont .alert-message {
  font-weight: bold;
  margin-bottom: 21px;
}

.user-email-icon a:hover svg {
  fill: #fff;
}

.user-email-icon svg {
  fill: #FF4400;
}

.btns-wrap {
  display: flex;
  justify-content: space-between;
}

.btns-wrap .back, .btns-wrap .forward {
  float: unset;
}



/* mobile */


@media (max-width:630px) {
  .btns-wrap {
    flex-direction: column;
  }
}

@media (max-width:520px) {


  #share-my-cart-modal {
    padding:20px;
  }

  .modal-wrap .input {
    padding-right: 31px;
  }

  .share-my-cart-container .share-my-cart-link {
    width: 100%;
  }

  .share-my-cart-sns-container > div {
    width: unset !important;
  }

  .close-node {
    width: unset !important;
    right: 15px;
  }

  .btns-wrap {
    flex-direction: column;
  }
}