.phun {
    width:900px;
	background-color:#161616;
	height:45px;
    box-sizing:border-box;
    display:inline-block;
}
.phun2 {
  margin:0 auto;
  width:900px;
  height:45px;
  position:relative;
  background-color:#161616;
  max-width:900px;
  display:flex;
}
.phunlogo {
  background-image: url('data:image/png;base64,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');
  width:50px;
  height:45px;
  left:5px;
  font-size:25px;
  transform: rotate(0);
  transition: opacity 0.5s ease, transform 0.5s ease;
  line-height:40px;
  position:relative;
  opacity:1;
  z-index:0;
}
.phunname {
  width:150px;
  left:40px;
  height:45px;
  text-align:center;
  line-height:45px;
  position:absolute;
  transition: opacity 0.5s ease, color 0.5s ease, font-size 0.3s ease, line-height 0.1s ease;
  font-size:30px;
  text-shadow: 1px 1px 5px #000;
  color:#fff;
  font-family:montserrat,ubuntu,arial;
}
.phunbelowbar1a {
  width:50px;
  left:54px;
  bottom:7px;
  height:20px;
  text-align:right;
  position:absolute;
  text-shadow: 1px 1px 5px #000;
  transition: opacity 0.5s ease, font-size 0.5s ease;
  font-size:5px;
  opacity:0;
  color:#fff;
  font-family:arial black,arial,sans-serif;
}
.phunbelowbar1b {
  width:100px;
  left:107px;
  bottom:7px;
  height:20px;
  text-align:left;
  opacity:0;
  transition: opacity 0.5s ease, font-size 0.5s ease;
  position:absolute;
  font-size:5px;
  text-shadow: 1px 1px 5px #000;
  color:#4CCA47;
  font-family:arial black,arial,sans-serif;
}
.phunbelowbar2 {
  width:150px;
  left:40px;
  opacity:0;
  bottom:0px;
  text-shadow: 1px 1px 5px #000;
  height:15px;
  transition: opacity 0.5s ease, font-size 0.5s ease;
  text-align:center;
  position:absolute;
  font-size:5px;
  color:#fff;
  font-family:arial black,arial,sans-serif;
}
.phunbar {
  width:129px;
  height:1px;
  top:17px;
  left:100px;
  display:"";
  transition: opacity 0.5s ease, left 0.5s ease;
  position:absolute;
  background:#4CCA47;
  opacity:0;
  box-sizing:border-box;
}
.phunarrow1 {
  width:8px;
  height:22.5px;
  bottom:0.5px;
  left:200px;
  display:"";
  transition: opacity 0.5s ease, width 0.5s ease;
  position:absolute;
  transform: skew(-19deg);
  background:#444;
  box-sizing:border-box;
}
.phunarrow2 {
  width:8px;
  height:22px;
  top:0px;
  left:200px;
  display:"";
  transition: opacity 0.5s ease, width 0.5s ease;
  position:absolute;
  transform: skew(19deg);
  background:#444;
  box-sizing:border-box;
}
.phunslogan1 {
  width:350px;
  height:11px;
  left:200px;
  top:1px;
  text-align:right;
  height:inherit;
  line-height:45px;
  position:absolute;
  opacity:0;
  font-size:5px;
  color:#fff;
  text-shadow: 1px 1px 1px #000;
  transition: opacity 0.5s ease, color 0.5s ease, font-size 0.3s ease;
  font-weight:bold;
  font-family:arial,sans-serif;
  box-sizing:border-box;
}
.phunslogan2 {
  width:150px;
  height:11px;
  left:555px;
  top:1px;
  opacity:0;
  text-align:left;
  height:inherit;
  line-height:45px;
  position:absolute;
  font-size:5px;
  color:#4CCA47;
  text-shadow: 1px 1px 2px #000;
  transition: opacity 0.5s ease, color 0.5s ease, font-size 0.3s ease;
  font-weight:bold;
  font-family:arial,sans-serif;
  box-sizing:border-box;
}
.phunlinesb1 {
  width:122px;
  height:45px;
  opacity:1;
  text-align:right;
  height:inherit;
  line-height:36px;
  transition:opacity 1s ease, font-size 0.3s ease;
  position:absolute;
  text-shadow: 1px 1px 2px #000;
  left:225px;
  font-size:28px;
  color:#4CCA47;
  font-weight:bold;
  font-family:arial;
  box-sizing:border-box;
}
.phunlinesb2 {
  width:300px;
  height:45px;
  opacity:1;
  text-align:left;
  height:inherit;
  line-height:35px;
  transition:opacity 1s ease, font-size 0.3s ease;
  position:absolute;
  left:355px;
  font-size:28px;
  text-shadow: 1px 1px 2px #000;
  color:#fff;
  font-weight:bold;
  font-family:arial;
  box-sizing:border-box;
}
.phunlines2 {
  width:500px;
  height:9px;
  bottom:5px;
  text-align:center;
  white-space:pre;
  font-size:9px;
  opacity:1;
  color:#10B609;
  text-shadow: 1px 1px 1px #000;
  position:absolute;
  transition: opacity 0.5s ease, color 2s ease;
  left:202px;
  font-weight:bolder;
  font-family:arial;
  box-sizing:border-box;
}
.phunjoinbg {
  width:170px;
  height:35px;
  top:5px;
  line-height:35px;
  right:20px;
  font-size: 25px;
  background-color:#4CCA47;
  font-family:ubuntu,arial,sans-serif;
  text-shadow: 2px 2px 2px #333;
  box-shadow: 1px 1px 1px 1px #000;
  text-align:center;
  transition: opacity 0.5s ease, font-size 0.5s, text-shadow 0.5s, color 0.5s ease;
  position:absolute;
  font-weight:bolder;
  color:#fff;
  border-radius:20px;
}
.phun:hover .phunlogo {
  transform: rotate(360deg);
}
.phun:hover .phunname {
  font-size:14px;
  line-height:20px;
}
.phun:hover .phunbar {
  opacity:1;
  left:51px;
}
.phun:hover .phunbelowbar1a {
  opacity:1;
  font-size:11px;
}
.phun:hover .phunbelowbar1b {
  opacity:1;
  font-size:11px;
}
.phun:hover .phunbelowbar2 {
  opacity:1;
  font-size:10px;
}
.phun:hover .phunarrow1 {
  opacity:1;
  width:695px;
}
.phun:hover .phunarrow2 {
  opacity:1;
  width:695px;
}
.phun:hover .phunslogan1 {
  opacity:1;
  font-size:23px;
}
.phun:hover .phunslogan2 {
  opacity:1;
  font-size:23px;
}
.phun:hover .phunlines2 {
  opacity:0;
  color:transparent;
}
.phun:hover .phunlinesb1 {
  opacity:0;
  font-size:5px;
}
.phun:hover .phunlinesb2 {
  opacity:0;
  font-size:5px;
}
.phun:hover .phunjoinbg {
  opacity:1;
  color:#fff;
  text-shadow: -1px -1px 1px #000;
}
.phore-btctalk {
    background: #111d2b;
    background: radial-gradient(ellipse farthest-corner at center, #214f54 0%, #111D2B 100%);
    height: 42px;
    display: inline-block;
    position: relative;
    width: 97%;
    font-family: Arial, Helvetica, sans-serif;
    overflow:hidden;
    border:0;
    transition: all .25s ease-in-out;
    background-position: 0 50%;

}
.phore-logo {
    background-image: url(data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMzYuNDIiIGhlaWdodD0iMzguODMiIHZpZXdCb3g9IjAgMCAxMzYuNDIgMzguODMiPjxkZWZzPjxzdHlsZT4uY2xzLTF7ZmlsbDpub25lO3N0cm9rZTojY2UwMGI2O3N0cm9rZS1taXRlcmxpbWl0OjEwO3N0cm9rZS13aWR0aDowLjI1cHg7fS5jbHMtMntmaWxsOiMwMGQxODg7fS5jbHMtM3tmaWxsOiNmZmY7fTwvc3R5bGU+PC9kZWZzPjx0aXRsZT5sb2dvPC90aXRsZT48cGF0aCBjbGFzcz0iY2xzLTEiIGQ9Ik0zOTUuMjYsMjEuMDciIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0zNzguNTggLTEuNjMpIi8+PHBhdGggY2xhc3M9ImNscy0xIiBkPSJNMzk1LjI2LDIxLjA3IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMzc4LjU4IC0xLjYzKSIvPjxwYXRoIGNsYXNzPSJjbHMtMiIgZD0iTTQxMS45NCwxLjYzbDAsMjMuOTRjMCwyLTEuMzUsMy4zMy0zLjMsMy44N2wtMjEsNS4xMnYzLjcxbC05LDIuMTlWNS42N2EzLjg2LDMuODYsMCwwLDEsNC4xNS00Wm0tMjQuMzYsOVYyNS4zOGwxNS4zNi0zLjY4VjEwLjYzWiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTM3OC41OCAtMS42MykiLz48cGF0aCBjbGFzcz0iY2xzLTEiIGQ9Ik0zOTUuMjYsMjEuMDciIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0zNzguNTggLTEuNjMpIi8+PHBhdGggY2xhc3M9ImNscy0xIiBkPSJNMzk1LjI2LDIxLjA3IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMzc4LjU4IC0xLjYzKSIvPjxwYXRoIGNsYXNzPSJjbHMtMyIgZD0iTTQyOC40NywxMC41NGE4LDgsMCwwLDAtNi40MiwyLjg2VjEwLjcyaC0zLjQzVjMzLjg5aDMuNTd2LTdhOCw4LDAsMCwwLDYuMjgsMi43N2M1LjUzLDAsOS4zOS0zLjkzLDkuMzktOS41NlM0MzQsMTAuNTQsNDI4LjQ3LDEwLjU0Wm0tLjI4LDE1LjkyYy0zLjU1LDAtNi0yLjYzLTYtNi4zOXMyLjQ5LTYuMzUsNi02LjM1LDYuMDcsMi42MSw2LjA3LDYuMzVTNDMxLjc2LDI2LjQ2LDQyOC4xOSwyNi40NlptMjMuMDgtMTUuOTJhOC4xNyw4LjE3LDAsMCwwLTYuMzUsMi41N1Y1LjYyaC0zLjU3djIzLjhoMy41N1YxOS43OWMwLTMuODIsMi4wOC02LDUuNjktNiwzLjE2LDAsNC44MywxLjgyLDQuODMsNS4yN1YyOS40Mkg0NTlWMTguNjhhOC4yNyw4LjI3LDAsMCwwLTIuMTctNi4xNEE3LjczLDcuNzMsMCwwLDAsNDUxLjI3LDEwLjU0Wm0yMC44NywwYTkuMjksOS4yOSwwLDAsMC05LjY4LDkuNTMsOS42Niw5LjY2LDAsMCwwLDE5LjMyLDBBOS4yOCw5LjI4LDAsMCwwLDQ3Mi4xNCwxMC41NFptMCwxNS45MmMtMy41OCwwLTYuMDctMi42My02LjA3LTYuMzlzMi40OS02LjM1LDYuMDctNi4zNSw2LDIuNjEsNiw2LjM1UzQ3NS42OSwyNi40Niw0NzIuMTQsMjYuNDZabTE2LjU2LTEzVjEwLjcyaC0zLjQzdjE4LjdoMy41N1YyMC4xYzAtMy44OCwyLjA2LTYuMTEsNS42NS02LjExYTQuODQsNC44NCwwLDAsMSwuNzUsMGwuMTQsMFYxMC41NGgtLjEyQzQ5Mi4yLDEwLjU0LDQ5MCwxMS41Niw0ODguNywxMy40OVptMTcuMTEtM2E5LjEyLDkuMTIsMCwwLDAtOS4zMyw5LjUzYzAsNS42Myw0LjExLDkuNTYsMTAsOS41NmE5LjIzLDkuMjMsMCwwLDAsNy4zMi0zbC4wNy0uMDgtMi0yLjM1LS4xLjExYTYuNjgsNi42OCwwLDAsMS01LjIsMi4xOWMtMy41LDAtNi0yLTYuNS01LjE1aDE0Ljg1VjIxLjJjMC0uMzEuMDctLjc0LjA3LTFDNTE1LDE0LjUsNTExLjIyLDEwLjU0LDUwNS44MSwxMC41NFptLTUuNzQsOC4xMmE1Ljc5LDUuNzksMCwwLDEsMTEuNDgsMFoiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0zNzguNTggLTEuNjMpIi8+PC9zdmc+);
    display: inline-block;
    position:relative;
    width:135px;
    height:38.4px;
    background-size: 80%;
    background-repeat: no-repeat;
    background-position: left center;
    top: 2px;
    float:left;
    margin-left:8px;
}
.phore-tagline {
    display:inline-block;
}
.phore-tagline span {
    color:#fff;
    text-transform:uppercase;
    font-weight:600;
    letter-spacing:0.35vw;
    font-size:1vw;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height:100%;
    line-height:1.5;
    position:absolute;
    left:0;
    right:0;
    margin:0 auto;
    transition: 0.3s;
    transition-delay: 0.05s;
}
.phore-tagline span:last-child {
    margin-top:50px;
}
.phore-cta {
    display:inline-block;
    float:right;
    background:transparent;
    border:2px solid #00d188;
    width:90px;
    border-radius:30px;
    color:white;
    text-transform:uppercase;
    line-height:30px;
    height:30px;
    letter-spacing:2px;
    font-weight:bold;
    padding-left:10px;
    padding-right:10px;
    margin-top: 4px;
    margin-right: 8px;
    transition: all .25s ease-in-out;
    transition-delay: 0.05s;
    line-height: 32px;
    font-size: 12px;
}
@media only screen and (max-width: 500px) {
    .phore-tagline span {
        display:none;
   }
}
@media only screen and (max-width: 800px) {
    .phore-tagline span {
        width:45%;
   }
}

.phore-btctalk:hover .phore-tagline span:first-child {
    margin-top:-30px;
}
.phore-btctalk:hover .phore-tagline span:last-child {
    margin-top:0;
}
.phore-btctalk:hover .phore-cta {
    background:#00d188;
}